@stream-io/video-react-sdk 1.43.2 → 2.0.0-beta.1

package/dist/css/styles.css

@@ -5,144 +5,1101 @@
   box-sizing: border-box;
 }
 
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
 .str-video {
-  --str-video__brand-color1: #005fff;
-  --str-video__brand-color2: #69e5f6;
-  --str-video__brand-color3: #00e2a1;
-  --str-video__brand-color4: #ffd646;
-  --str-video__brand-color5: #dc433b;
-  --str_video__brand-color6: #b38af8;
-  --str-video__base-color1: #e3e4e5;
-  --str-video__base-color2: #979ca0;
-  --str-video__base-color3: #4c535b;
-  --str-video__base-color4: #000000;
-  --str-video__base-color5: #0c0d0e;
-  --str-video__base-color6: #19232d;
-  --str-video__base-color7: #101213;
-  --str-video__backdrop1: rgba(0, 0, 0, 0.5);
-  --str-video__button-default-base: #19232d;
-  --str-video__button-default-hover: #323b44;
-  --str-video__button-default-pressed: #0c0d0e;
-  --str-video__button-default-active: #19232d;
-  --str-video__button-default-disabled: #1e262e;
-  --str-video__button-primary-base: #19232d;
-  --str-video__button-primary-hover: #4c8fff;
-  --str-video__button-primary-pressed: #0c48ab;
-  --str-video__button-primary-active: #005fff;
-  --str-video__button-secondary-base: #19232d;
-  --str-video__button-secondary-hover: #e96962;
-  --str-video__button-secondary-pressed: #6a3233;
-  --str-video__button-secondary-active: #dc433b;
-  --str-video__button-tertiary-base: #dc433b;
-  --str-video__button-tertiary-hover: #e96962;
-  --str-video__button-tertiary-pressed: #6a3233;
-  --str-video__button-tertiary-active: #31292f;
-  --str-video__icon-default: #eff0f1;
-  --str-video__icon-hover: #eff0f1;
-  --str-video__icon-pressed: #656b72;
-  --str-video__icon-active: #e3e4e5;
-  --str-video__icon-alert: #e3e4e5;
-  --str-video__icon-disabled: #7e8389;
-  --str-video__alert-success: #00e2a1;
-  --str-video__alert-caution: #ffd646;
-  --str-video__alert-warning: #dc433b;
-  --str-video__alert-success-background: rgba(0, 226, 161, 0.5);
-  --str-video__alert-caution-background: rgba(255, 214, 70, 0.5);
-  --str-video__alert-warning-background: rgba(220, 67, 59, 0.5);
-  --str-video__font-size-xxs: 0.625rem;
-  --str-video__font-size-xs: 0.75rem;
-  --str-video__font-size-sm: 0.875rem;
-  --str-video__font-size-md: 1rem;
-  --str-video__font-size-lg: 1.125rem;
-  --str-video__font-size-xl: 1.25rem;
-  --str-video__font-size-xxl: 1.5rem;
-  --str-video__border-radius-xxs: 4px;
-  --str-video__border-radius-xs: 8px;
-  --str-video__border-radius-sm: 12px;
-  --str-video__border-radius-md: 18px;
-  --str-video__border-radius-lg: 24px;
-  --str-video__border-radius-xl: 30px;
-  --str-video__border-radius-xxl: 48px;
-  --str-video__border-radius-circle: 999px;
-  --str-video__spacing-xxs: 4px;
-  --str-video__spacing-xs: 6px;
-  --str-video__spacing-sm: 8px;
-  --str-video__spacing-md: 12px;
-  --str-video__spacing-lg: 16px;
-  --str-video__spacing-xl: 20px;
-  --str-video__primary-color: #005fff;
-  --str-video__secondary-color: #669fff;
-  --str-video__text-color1: #ffffff;
-  --str-video__text-color2: #b4b7bb;
-  --str-video__text-color3: #72767e;
-  --str-video__text-color4: #f7f7f8;
-  --str-video__info-color: #4ce68c;
-  --str-video__info-color--accent: #20e070;
-  --str-video__danger-color: #ff3742;
-  --str-video__danger-color--accent: #ff000e;
-  --str-video__background-color0: #000000;
-  --str-video__background-color1: #1c1e22;
-  --str-video__background-color2: #272a30;
-  --str-video__background-color3: #f4f4f5;
-  --str-video__background-color4: #121416;
-  --str-video__background-color5: #1d2938;
-  --str-video__background-color6: #b4b7bb;
-  --str-video__background-color7: #72767e;
-  --str-video__overlay-color: rgba(39, 42, 48, 0.75);
-  --str-video__livestream-overlay-color: rgba(39, 42, 48, 0.25);
-  --str-video__livestream-overlay-color-hovered: rgba(39, 42, 48, 0.5);
-  --str-video__audio-blocked-overlay-color: rgba(39, 42, 48, 0.35);
-  --str-video__audio-blocked-overlay-color-hovered: rgba(39, 42, 48, 0.45);
-  --str-video__icon--call-accept: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTkiIHZpZXdCb3g9IjAgMCAxOSAxOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0xNy41MSAxMi4zODJDMTYuMjggMTIuMzgyIDE1LjA5IDEyLjE4MiAxMy45OCAxMS44MjJDMTMuNjMgMTEuNzAyIDEzLjI0IDExLjc5MiAxMi45NyAxMi4wNjJMMTEuNCAxNC4wMzJDOC41NyAxMi42ODIgNS45MiAxMC4xMzIgNC41MSA3LjIwMTk1TDYuNDYgNS41NDE5NUM2LjczIDUuMjYxOTUgNi44MSA0Ljg3MTk1IDYuNyA0LjUyMTk1QzYuMzMgMy40MTE5NSA2LjE0IDIuMjIxOTUgNi4xNCAwLjk5MTk1M0M2LjE0IDAuNDUxOTUzIDUuNjkgMC4wMDE5NTMxMyA1LjE1IDAuMDAxOTUzMTNIMS42OUMxLjE1IDAuMDAxOTUzMTIgMC41IDAuMjQxOTUzIDAuNSAwLjk5MTk1M0MwLjUgMTAuMjgyIDguMjMgMTguMDAyIDE3LjUxIDE4LjAwMkMxOC4yMiAxOC4wMDIgMTguNSAxNy4zNzIgMTguNSAxNi44MjJWMTMuMzcyQzE4LjUgMTIuODMyIDE4LjA1IDEyLjM4MiAxNy41MSAxMi4zODJaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K');
-  --str-video__icon--call-end: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTQuNTgwMSAxNi4wMzA0TDYuNTgwMSAxNC40NDA0QzcuMDYwMSAxNC4wNjA0IDcuMzQwMSAxMy40ODA0IDcuMzQwMSAxMi44NzA0VjEwLjI3MDRDMTAuMzYwMSA5LjI5MDQgMTMuNjMwMSA5LjI4MDQgMTYuNjYwMSAxMC4yNzA0VjEyLjg4MDRDMTYuNjYwMSAxMy40OTA0IDE2Ljk0MDEgMTQuMDcwNCAxNy40MjAxIDE0LjQ1MDRMMTkuNDEwMSAxNi4wMzA0QzIwLjIxMDEgMTYuNjYwNCAyMS4zNTAxIDE2LjYwMDQgMjIuMDcwMSAxNS44ODA0TDIzLjI5MDEgMTQuNjYwNEMyNC4wOTAxIDEzLjg2MDQgMjQuMDkwMSAxMi41MzA0IDIzLjI0MDEgMTEuNzgwNEMxNi44MzAxIDYuMTIwNCA3LjE3MDEgNi4xMjA0IDAuNzYwMTAzIDExLjc4MDRDLTAuMDg5ODk3IDEyLjUzMDQgLTAuMDg5ODk3IDEzLjg2MDQgMC43MTAxMDMgMTQuNjYwNEwxLjkzMDEgMTUuODgwNEMyLjY0MDEgMTYuNjAwNCAzLjc4MDEgMTYuNjYwNCA0LjU4MDEgMTYuMDMwNFoiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K');
-  --str-video__icon--camera: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE3IDEwLjVWN0MxNyA2LjQ1IDE2LjU1IDYgMTYgNkg0QzMuNDUgNiAzIDYuNDUgMyA3VjE3QzMgMTcuNTUgMy40NSAxOCA0IDE4SDE2QzE2LjU1IDE4IDE3IDE3LjU1IDE3IDE3VjEzLjVMMTkuMjkgMTUuNzlDMTkuOTIgMTYuNDIgMjEgMTUuOTcgMjEgMTUuMDhWOC45MUMyMSA4LjAyIDE5LjkyIDcuNTcgMTkuMjkgOC4yTDE3IDEwLjVaIiBmaWxsPSIjQjBCNEI3Ii8+Cjwvc3ZnPgo=');
-  --str-video__icon--camera-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIxLjI5MTUgMTQuNzY5OVY5LjQ3OTlDMjEuMjkxNSA4LjU4OTkgMjAuMjExNSA4LjEzOTkgMTkuNTgxNSA4Ljc2OTlMMTcuMjkxNSAxMS4wNjk5VjcuNTY5OUMxNy4yOTE1IDcuMDE5OSAxNi44NDE1IDYuNTY5OSAxNi4yOTE1IDYuNTY5OUgxMC42ODE1TDE5LjU5MTUgMTUuNDc5OUMyMC4yMTE1IDE2LjEwOTkgMjEuMjkxNSAxNS42NTk5IDIxLjI5MTUgMTQuNzY5OVpNMy4wMDE0OCAzLjEyOTlDMi42MTE0OCAzLjUxOTkgMi42MTE0OCA0LjE0OTkgMy4wMDE0OCA0LjUzOTlMNS4wMjE0OCA2LjU2OTlINC4yOTE0OEMzLjc0MTQ4IDYuNTY5OSAzLjI5MTQ4IDcuMDE5OSAzLjI5MTQ4IDcuNTY5OVYxNy41Njk5QzMuMjkxNDggMTguMTE5OSAzLjc0MTQ4IDE4LjU2OTkgNC4yOTE0OCAxOC41Njk5SDE2LjI5MTVDMTYuNTAxNSAxOC41Njk5IDE2LjY4MTUgMTguNDg5OSAxNi44NDE1IDE4LjM4OTlMMTkuMzIxNSAyMC44Njk5QzE5LjcxMTUgMjEuMjU5OSAyMC4zNDE1IDIxLjI1OTkgMjAuNzMxNSAyMC44Njk5QzIxLjEyMTUgMjAuNDc5OSAyMS4xMjE1IDE5Ljg0OTkgMjAuNzMxNSAxOS40NTk5TDQuNDExNDggMy4xMjk5QzQuMDIxNDggMi43Mzk5IDMuMzkxNDggMi43Mzk5IDMuMDAxNDggMy4xMjk5WiIgZmlsbD0iI0IwQjRCNyIvPgo8L3N2Zz4K');
-  --str-video__icon--caret: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMjU0ODggMTAuNDg4NUw5LjQxMzIxIDguMzMwMThDOS43MzgyMSA4LjAwNTE4IDEwLjI2MzIgOC4wMDUxOCAxMC41ODgyIDguMzMwMThMMTIuNzQ2NSAxMC40ODg1QzEzLjI3MTUgMTEuMDEzNSAxMi44OTY1IDExLjkxMzUgMTIuMTU0OSAxMS45MTM1SDcuODM4MjFDNy4wOTY1NCAxMS45MTM1IDYuNzI5ODggMTEuMDEzNSA3LjI1NDg4IDEwLjQ4ODVaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=');
-  --str-video__icon--caret-down: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMjU0ODggMTAuNDg4NUw5LjQxMzIxIDguMzMwMThDOS43MzgyMSA4LjAwNTE4IDEwLjI2MzIgOC4wMDUxOCAxMC41ODgyIDguMzMwMThMMTIuNzQ2NSAxMC40ODg1QzEzLjI3MTUgMTEuMDEzNSAxMi44OTY1IDExLjkxMzUgMTIuMTU0OSAxMS45MTM1SDcuODM4MjFDNy4wOTY1NCAxMS45MTM1IDYuNzI5ODggMTEuMDEzNSA3LjI1NDg4IDEwLjQ4ODVaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=');
-  --str-video__icon--caret-up: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuMjU0ODggMTAuNDg4NUw5LjQxMzIxIDguMzMwMThDOS43MzgyMSA4LjAwNTE4IDEwLjI2MzIgOC4wMDUxOCAxMC41ODgyIDguMzMwMThMMTIuNzQ2NSAxMC40ODg1QzEzLjI3MTUgMTEuMDEzNSAxMi44OTY1IDExLjkxMzUgMTIuMTU0OSAxMS45MTM1SDcuODM4MjFDNy4wOTY1NCAxMS45MTM1IDYuNzI5ODggMTEuMDEzNSA3LjI1NDg4IDEwLjQ4ODVaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=');
-  --str-video__icon--chevron-down: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNDEgOC4yOTUwNEwxMiAxMi44NzVMMTYuNTkgOC4yOTUwNEwxOCA5LjcwNTA0TDEyIDE1LjcwNUw2IDkuNzA1MDRMNy40MSA4LjI5NTA0WiIgZmlsbD0iI0IwQjRCNyIvPgo8L3N2Zz4K');
-  --str-video__icon--chevron-up: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcuNDEgMTUuNzA1TDEyIDExLjEyNUwxNi41OSAxNS43MDVMMTggMTQuMjk1TDEyIDguMjk1MDRMNiAxNC4yOTVMNy40MSAxNS43MDVaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=');
-  --str-video__icon--chevron-right: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTYuOTk3NjcgMjEuMDE0OUM3LjQ4NzY3IDIxLjUwNDkgOC4yNzc2NyAyMS41MDQ5IDguNzY3NjcgMjEuMDE0OUwxNy4wNzc3IDEyLjcwNDlDMTcuNDY3NyAxMi4zMTQ5IDE3LjQ2NzcgMTEuNjg0OSAxNy4wNzc3IDExLjI5NDlMOC43Njc2NyAyLjk4NDkzQzguMjc3NjcgMi40OTQ5MyA3LjQ4NzY3IDIuNDk0OTMgNi45OTc2NyAyLjk4NDkzQzYuNTA3NjcgMy40NzQ5MyA2LjUwNzY3IDQuMjY0OTMgNi45OTc2NyA0Ljc1NDkzTDE0LjIzNzcgMTIuMDA0OUw2Ljk4NzY3IDE5LjI1NDlDNi41MDc2NyAxOS43MzQ5IDYuNTA3NjcgMjAuNTM0OSA2Ljk5NzY3IDIxLjAxNDlaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==');
-  --str-video__icon--call-latency: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyLjAwMjkgMTcuOTk4OEMxMi41NTUyIDE3Ljk5ODggMTMuMDAyOSAxNy41NTExIDEzLjAwMjkgMTYuOTk4OEMxMy4wMDI5IDE2LjQ0NjUgMTIuNTU1MiAxNS45OTg4IDEyLjAwMjkgMTUuOTk4OEMxMS40NTA2IDE1Ljk5ODggMTEuMDAyOSAxNi40NDY1IDExLjAwMjkgMTYuOTk4OEMxMS4wMDI5IDE3LjU1MTEgMTEuNDUwNiAxNy45OTg4IDEyLjAwMjkgMTcuOTk4OFoiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTcuMDAyOTMgMTIuOTk4OEM3LjU1NTIxIDEyLjk5ODggOC4wMDI5MyAxMi41NTExIDguMDAyOTMgMTEuOTk4OEM4LjAwMjkzIDExLjQ0NjUgNy41NTUyMSAxMC45OTg4IDcuMDAyOTMgMTAuOTk4OEM2LjQ1MDY0IDEwLjk5ODggNi4wMDI5MyAxMS40NDY1IDYuMDAyOTMgMTEuOTk4OEM2LjAwMjkzIDEyLjU1MTEgNi40NTA2NCAxMi45OTg4IDcuMDAyOTMgMTIuOTk4OFoiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTE3LjAwMjkgMTIuOTk4OEMxNy41NTUyIDEyLjk5ODggMTguMDAyOSAxMi41NTExIDE4LjAwMjkgMTEuOTk4OEMxOC4wMDI5IDExLjQ0NjUgMTcuNTU1MiAxMC45OTg4IDE3LjAwMjkgMTAuOTk4OEMxNi40NTA2IDEwLjk5ODggMTYuMDAyOSAxMS40NDY1IDE2LjAwMjkgMTEuOTk4OEMxNi4wMDI5IDEyLjU1MTEgMTYuNDUwNiAxMi45OTg4IDE3LjAwMjkgMTIuOTk4OFoiIGZpbGw9IiNFM0U0RTUiLz4KPHBhdGggZD0iTTEyLjAwMjkgMi45OTg3OEMxMS40NTI5IDIuOTk4NzggMTEuMDAyOSAzLjQ0ODc4IDExLjAwMjkgMy45OTg3OFY1Ljk5ODc4QzExLjAwMjkgNi41NDg3OCAxMS40NTI5IDYuOTk4NzggMTIuMDAyOSA2Ljk5ODc4QzEyLjU1MjkgNi45OTg3OCAxMy4wMDI5IDYuNTQ4NzggMTMuMDAyOSA1Ljk5ODc4VjUuMDc4NzhDMTYuMzEyOSA1LjU1ODc4IDE4Ljg3MjkgOC4zMjg3OCAxOS4wMDI5IDExLjczODhDMTkuMTQyOSAxNS41ODg4IDE1Ljk3MjkgMTguOTM4OCAxMi4xMjI5IDE4Ljk5ODhDOC4xOTI5MyAxOS4wNTg4IDUuMDAyOTMgMTUuOTA4OCA1LjAwMjkzIDExLjk5ODhDNS4wMDI5MyAxMC4zMTg4IDUuNTkyOTMgOC43Nzg3OCA2LjU4MjkzIDcuNTc4NzhMMTEuMjkyOSAxMi4yOTg4QzExLjY4MjkgMTIuNjg4OCAxMi4zMTI5IDEyLjY4ODggMTIuNzAyOSAxMi4yOTg4QzEzLjA5MjkgMTEuOTA4OCAxMy4wOTI5IDExLjI3ODggMTIuNzAyOSAxMC44ODg4TDcuMjYyOTMgNS40NTg3OEM2Ljg4MjkzIDUuMDc4NzggNi4yNjI5MyA1LjA2ODc4IDUuODYyOTMgNS40Mzg3OEM0LjEwMjkzIDcuMDY4NzggMy4wMDI5MyA5LjM5ODc4IDMuMDAyOTMgMTEuOTk4OEMzLjAwMjkzIDE3LjAzODggNy4xNDI5MyAyMS4xMTg4IDEyLjIxMjkgMjAuOTk4OEMxNi45MTI5IDIwLjg4ODggMjAuODQyOSAxNi45ODg4IDIwLjk5MjkgMTIuMjg4OEMyMS4xNjI5IDcuMTg4NzggMTcuMDcyOSAyLjk5ODc4IDEyLjAwMjkgMi45OTg3OFoiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==');
-  --str-video__icon--close: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE4LjI5OTcgNS43MDk5N0MxNy45MDk3IDUuMzE5OTcgMTcuMjc5NyA1LjMxOTk3IDE2Ljg4OTcgNS43MDk5N0wxMS45OTk3IDEwLjU5TDcuMTA5NzMgNS42OTk5N0M2LjcxOTczIDUuMzA5OTcgNi4wODk3MyA1LjMwOTk3IDUuNjk5NzMgNS42OTk5N0M1LjMwOTczIDYuMDg5OTcgNS4zMDk3MyA2LjcxOTk3IDUuNjk5NzMgNy4xMDk5N0wxMC41ODk3IDEyTDUuNjk5NzMgMTYuODlDNS4zMDk3MyAxNy4yOCA1LjMwOTczIDE3LjkxIDUuNjk5NzMgMTguM0M2LjA4OTczIDE4LjY5IDYuNzE5NzMgMTguNjkgNy4xMDk3MyAxOC4zTDExLjk5OTcgMTMuNDFMMTYuODg5NyAxOC4zQzE3LjI3OTcgMTguNjkgMTcuOTA5NyAxOC42OSAxOC4yOTk3IDE4LjNDMTguNjg5NyAxNy45MSAxOC42ODk3IDE3LjI4IDE4LjI5OTcgMTYuODlMMTMuNDA5NyAxMkwxOC4yOTk3IDcuMTA5OTdDMTguNjc5NyA2LjcyOTk3IDE4LjY3OTcgNi4wODk5NyAxOC4yOTk3IDUuNzA5OTdaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==');
-  --str-video__icon--connection-quality-poor: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzMiIHZpZXdCb3g9IjAgMCAzMyAzMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuMjU0ODgzIDYuMjVDMC4yNTQ4ODMgMi45MzYyOSAyLjk0MTE3IDAuMjUgNi4yNTQ4OCAwLjI1SDMyLjI1NDlWMjYuMjVDMzIuMjU0OSAyOS41NjM3IDI5LjU2ODYgMzIuMjUgMjYuMjU0OSAzMi4yNUgwLjI1NDg4M1Y2LjI1WiIgZmlsbD0iIzBDMEQwRSIgZmlsbC1vcGFjaXR5PSIwLjY1Ii8+CjxwYXRoIGQ9Ik0xNi4yNTQ5IDIwLjI1TDE2LjI1NDkgMTUuMjUiIHN0cm9rZT0iI0UzRTRFNSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTExLjI1NDkgMjAuMjVMMTEuMjU0OSAxOC4yNSIgc3Ryb2tlPSIjREM0MzNCIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMjEuMjU0OSAyMC4yNUwyMS4yNTQ5IDEyLjI1IiBzdHJva2U9IiNFM0U0RTUiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=');
-  --str-video__icon--connection-quality-good: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzMiIHZpZXdCb3g9IjAgMCAzMyAzMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuOTI0ODA1IDYuMjVDMC45MjQ4MDUgMi45MzYyOSAzLjYxMTEgMC4yNSA2LjkyNDggMC4yNUgzMi45MjQ4VjI2LjI1QzMyLjkyNDggMjkuNTYzNyAzMC4yMzg1IDMyLjI1IDI2LjkyNDggMzIuMjVIMC45MjQ4MDVWNi4yNVoiIGZpbGw9IiMwQzBEMEUiIGZpbGwtb3BhY2l0eT0iMC42NSIvPgo8cGF0aCBkPSJNMTYuOTI0OCAyMC4yNUwxNi45MjQ4IDE1LjI1IiBzdHJva2U9IiMwMEUyQTEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMS45MjQ4IDIwLjI1TDExLjkyNDggMTguMjUiIHN0cm9rZT0iIzAwRTJBMSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTIxLjkyNDggMjAuMjVMMjEuOTI0OCAxMi4yNSIgc3Ryb2tlPSIjRTNFNEU1IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K');
-  --str-video__icon--connection-quality-excellent: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzMiIHZpZXdCb3g9IjAgMCAzMyAzMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuMjU0ODgzIDYuMjVDMC4yNTQ4ODMgMi45MzYyOSAyLjk0MTE3IDAuMjUgNi4yNTQ4OCAwLjI1SDMyLjI1NDlWMjYuMjVDMzIuMjU0OSAyOS41NjM3IDI5LjU2ODYgMzIuMjUgMjYuMjU0OSAzMi4yNUgwLjI1NDg4M1Y2LjI1WiIgZmlsbD0iIzBDMEQwRSIgZmlsbC1vcGFjaXR5PSIwLjY1Ii8+CjxwYXRoIGQ9Ik0xNi4yNTQ5IDIwLjI1TDE2LjI1NDkgMTUuMjUiIHN0cm9rZT0iIzAwRTJBMSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTExLjI1NDkgMjAuMjVMMTEuMjU0OSAxOC4yNSIgc3Ryb2tlPSIjMDBFMkExIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMjEuMjU0OSAyMC4yNUwyMS4yNTQ5IDEyLjI1IiBzdHJva2U9IiMwMEUyQTEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=');
-  --str-video__icon--download: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAyOCAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE3LjA2MDcgNi4zMzM1SDE2LjAwMDdWMy4wMDAxNkMxNi4wMDA3IDIuNjMzNSAxNS43MDA3IDIuMzMzNSAxNS4zMzQgMi4zMzM1SDEyLjY2NzNDMTIuMzAwNyAyLjMzMzUgMTIuMDAwNyAyLjYzMzUgMTIuMDAwNyAzLjAwMDE2VjYuMzMzNUgxMC45NDA3QzEwLjM0NzMgNi4zMzM1IDEwLjA0NzMgNy4wNTM1IDEwLjQ2NzMgNy40NzM1TDEzLjUyNzMgMTAuNTMzNUMxMy43ODczIDEwLjc5MzUgMTQuMjA3MyAxMC43OTM1IDE0LjQ2NzMgMTAuNTMzNUwxNy41MjczIDcuNDczNUMxNy45NDczIDcuMDUzNSAxNy42NTQgNi4zMzM1IDE3LjA2MDcgNi4zMzM1Wk05LjMzMzk4IDEzLjAwMDJDOS4zMzM5OCAxMy4zNjY4IDkuNjMzOTggMTMuNjY2OCAxMC4wMDA3IDEzLjY2NjhIMTguMDAwN0MxOC4zNjczIDEzLjY2NjggMTguNjY3MyAxMy4zNjY4IDE4LjY2NzMgMTMuMDAwMkMxOC42NjczIDEyLjYzMzUgMTguMzY3MyAxMi4zMzM1IDE4LjAwMDcgMTIuMzMzNUgxMC4wMDA3QzkuNjMzOTggMTIuMzMzNSA5LjMzMzk4IDEyLjYzMzUgOS4zMzM5OCAxMy4wMDAyWiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K');
-  --str-video__icon--ellipsis: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYgMTBDNC45IDEwIDQgMTAuOSA0IDEyQzQgMTMuMSA0LjkgMTQgNiAxNEM3LjEgMTQgOCAxMy4xIDggMTJDOCAxMC45IDcuMSAxMCA2IDEwWk0xOCAxMEMxNi45IDEwIDE2IDEwLjkgMTYgMTJDMTYgMTMuMSAxNi45IDE0IDE4IDE0QzE5LjEgMTQgMjAgMTMuMSAyMCAxMkMyMCAxMC45IDE5LjEgMTAgMTggMTBaTTEyIDEwQzEwLjkgMTAgMTAgMTAuOSAxMCAxMkMxMCAxMy4xIDEwLjkgMTQgMTIgMTRDMTMuMSAxNCAxNCAxMy4xIDE0IDEyQzE0IDEwLjkgMTMuMSAxMCAxMiAxMFoiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==');
-  --str-video__icon--film-roll: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTMgNkMyLjQ1IDYgMiA2LjQ1IDIgN1YyMEMyIDIxLjEgMi45IDIyIDQgMjJIMTdDMTcuNTUgMjIgMTggMjEuNTUgMTggMjFDMTggMjAuNDUgMTcuNTUgMjAgMTcgMjBINUM0LjQ1IDIwIDQgMTkuNTUgNCAxOVY3QzQgNi40NSAzLjU1IDYgMyA2Wk0yMCAySDhDNi45IDIgNiAyLjkgNiA0VjE2QzYgMTcuMSA2LjkgMTggOCAxOEgyMEMyMS4xIDE4IDIyIDE3LjEgMjIgMTZWNEMyMiAyLjkgMjEuMSAyIDIwIDJaTTEyIDE0LjVWNS41TDE3LjQ3IDkuNkMxNy43NCA5LjggMTcuNzQgMTAuMiAxNy40NyAxMC40TDEyIDE0LjVaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==');
-  --str-video__icon--filter: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSI+CiAgICA8cGF0aCBkPSJNMSAzLjc1QS43NS43NSAwIDAgMSAxLjc1IDNoMTIuNWEuNzUuNzUgMCAwIDEgMCAxLjVIMS43NUEuNzUuNzUgMCAwIDEgMSAzLjc1em0yLjUgNEEuNzUuNzUgMCAwIDEgNC4yNSA3aDcuNWEuNzUuNzUgMCAwIDEgMCAxLjVoLTcuNWEuNzUuNzUgMCAwIDEtLjc1LS43NXpNNi43NSAxMWEuNzUuNzUgMCAwIDAgMCAxLjVoMi41YS43NS43NSAwIDAgMCAwLTEuNWgtMi41eiIgZmlsbD0iY3VycmVudENvbG9yIi8+XAo8L3N2Zz4K');
-  --str-video__icon--fullscreen: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAzNiAzNiIgd2lkdGg9IjM2IiBoZWlnaHQ9IjM2IiBmaWxsPSJ3aGl0ZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0ibSAxMCwxNiAyLDAgMCwtNCA0LDAgMCwtMiBMIDEwLDEwIGwgMCw2IDAsMCB6Ii8+CjxwYXRoIGQ9Im0gMjAsMTAgMCwyIDQsMCAwLDQgMiwwIEwgMjYsMTAgbCAtNiwwIDAsMCB6Ii8+CjxwYXRoIGQ9Im0gMjQsMjQgLTQsMCAwLDIgTCAyNiwyNiBsIDAsLTYgLTIsMCAwLDQgMCwwIHoiLz4KPHBhdGggZD0iTSAxMiwyMCAxMCwyMCAxMCwyNiBsIDYsMCAwLC0yIC00LDAgMCwtNCAwLDAgeiIvPgo8L3N2Zz4=');
-  --str-video__icon--info-icon: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjRweCIgdmlld0JveD0iMCAwIDI0IDI0IiB3aWR0aD0iMjRweCIgZmlsbD0iI2ZmZmZmZiI+PHBhdGggZD0iTTAgMGgyNHYyNEgwVjB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTExIDdoMnYyaC0yem0wIDRoMnY2aC0yem0xLTlDNi40OCAyIDIgNi40OCAyIDEyczQuNDggMTAgMTAgMTAgMTAtNC40OCAxMC0xMFMxNy41MiAyIDEyIDJ6bTAgMThjLTQuNDEgMC04LTMuNTktOC04czMuNTktOCA4LTggOCAzLjU5IDggOC0zLjU5IDgtOCA4eiIvPjwvc3ZnPg==');
-  --str-video__icon--kick-user: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDI0IDI0IiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCI+PGc+PHJlY3QgZmlsbD0ibm9uZSIgaGVpZ2h0PSIyNCIgd2lkdGg9IjI0Ii8+PC9nPjxnPjxwYXRoIGQ9Ik0xNCw4YzAtMi4yMS0xLjc5LTQtNC00UzYsNS43OSw2LDhzMS43OSw0LDQsNFMxNCwxMC4yMSwxNCw4eiBNMTcsMTB2Mmg2di0ySDE3eiBNMiwxOHYyaDE2di0yYzAtMi42Ni01LjMzLTQtOC00IFMyLDE1LjM0LDIsMTh6Ii8+PC9nPjwvc3ZnPg==');
-  --str-video__icon--livestream-viewers: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzg2OTdfMjU1NykiPgo8cGF0aCBkPSJNOC4zNzc0NCA0LjU2MjVDMTAuNzQ2MiA0LjU2MjUgMTIuODU4NyA1Ljg5Mzc1IDEzLjg4OTkgOEMxMi44NTg3IDEwLjEwNjIgMTAuNzQ2MiAxMS40Mzc1IDguMzc3NDQgMTEuNDM3NUM2LjAwODY5IDExLjQzNzUgMy44OTYxOSAxMC4xMDYyIDIuODY0OTQgOEMzLjg5NjE5IDUuODkzNzUgNi4wMDg2OSA0LjU2MjUgOC4zNzc0NCA0LjU2MjVaTTguMzc3NDQgMy4zMTI1QzUuMjUyNDQgMy4zMTI1IDIuNTgzNjkgNS4yNTYyNSAxLjUwMjQ0IDhDMi41ODM2OSAxMC43NDM4IDUuMjUyNDQgMTIuNjg3NSA4LjM3NzQ0IDEyLjY4NzVDMTEuNTAyNCAxMi42ODc1IDE0LjE3MTIgMTAuNzQzOCAxNS4yNTI0IDhDMTQuMTcxMiA1LjI1NjI1IDExLjUwMjQgMy4zMTI1IDguMzc3NDQgMy4zMTI1Wk04LjM3NzQ0IDYuNDM3NUM5LjIzOTk0IDYuNDM3NSA5LjkzOTk0IDcuMTM3NSA5LjkzOTk0IDhDOS45Mzk5NCA4Ljg2MjUgOS4yMzk5NCA5LjU2MjUgOC4zNzc0NCA5LjU2MjVDNy41MTQ5NCA5LjU2MjUgNi44MTQ5NCA4Ljg2MjUgNi44MTQ5NCA4QzYuODE0OTQgNy4xMzc1IDcuNTE0OTQgNi40Mzc1IDguMzc3NDQgNi40Mzc1Wk04LjM3NzQ0IDUuMTg3NUM2LjgyNzQ0IDUuMTg3NSA1LjU2NDk0IDYuNDUgNS41NjQ5NCA4QzUuNTY0OTQgOS41NSA2LjgyNzQ0IDEwLjgxMjUgOC4zNzc0NCAxMC44MTI1QzkuOTI3NDQgMTAuODEyNSAxMS4xODk5IDkuNTUgMTEuMTg5OSA4QzExLjE4OTkgNi40NSA5LjkyNzQ0IDUuMTg3NSA4LjM3NzQ0IDUuMTg3NVoiIGZpbGw9IiNGQ0ZDRkMiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF84Njk3XzI1NTciPgo8cmVjdCB4PSIwLjg3NzQ0MSIgeT0iMC41IiB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHJ4PSI0IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=');
-  --str-video__icon--loading: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzEiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMSAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMzAuOTIxMyAxNUMzMC45MjEzIDIzLjI4NDMgMjQuMjA1NiAzMCAxNS45MjEzIDMwQzEwLjcxNTQgMzAgNi4xMjg5OSAyNy4zNDggMy40MzkyMSAyMy4zMjE0TDUuMTAzNDkgMjIuMjExOUM3LjQzNDYzIDI1LjcwMTYgMTEuNDA5NiAyOCAxNS45MjEzIDI4QzIzLjEwMSAyOCAyOC45MjEzIDIyLjE3OTcgMjguOTIxMyAxNUMyOC45MjEzIDcuODIwMyAyMy4xMDEgMiAxNS45MjEzIDJMMTUuOTIxMyAwQzI0LjIwNTYgMCAzMC45MjEzIDYuNzE1NzMgMzAuOTIxMyAxNVoiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8xODYwXzExMDYyMykiLz4KICAgIDxkZWZzPgogICAgICAgIDxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQwX2xpbmVhcl8xODYwXzExMDYyMyIgeDE9IjMuNDM5MjEiIHkxPSIwIiB4Mj0iMy40MzkyMSIgeTI9IjMwIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgICAgICAgICAgIDxzdG9wIGlkPSJzdG9wLXNlbWl0cmFuc3BhcmVudCIgc3RvcC1vcGFjaXR5PSIwLjAxIi8+CiAgICAgICAgICAgIDxzdG9wIGlkPSJzdG9wLW9wYXF1ZSIgb2Zmc2V0PSIxIiAvPgogICAgICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgICA8L2RlZnM+Cjwvc3ZnPg==');
-  --str-video__icon--logout: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNSAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuMDA2NTEgMi45MTY2N0g2LjUwNjUxQzYuODI3MzQgMi45MTY2NyA3LjA4OTg0IDIuNjU0MTcgNy4wODk4NCAyLjMzMzMzQzcuMDg5ODQgMi4wMTI1IDYuODI3MzQgMS43NSA2LjUwNjUxIDEuNzVIMy4wMDY1MUMyLjM2NDg0IDEuNzUgMS44Mzk4NCAyLjI3NSAxLjgzOTg0IDIuOTE2NjdWMTEuMDgzM0MxLjgzOTg0IDExLjcyNSAyLjM2NDg0IDEyLjI1IDMuMDA2NTEgMTIuMjVINi41MDY1MUM2LjgyNzM0IDEyLjI1IDcuMDg5ODQgMTEuOTg3NSA3LjA4OTg0IDExLjY2NjdDNy4wODk4NCAxMS4zNDU4IDYuODI3MzQgMTEuMDgzMyA2LjUwNjUxIDExLjA4MzNIMy4wMDY1MVYyLjkxNjY3WiIgZmlsbD0iI0UzRTRFNSIvPgo8cGF0aCBkPSJNMTIuMTM1NyA2Ljc5NTgzTDEwLjUwODIgNS4xNjgzM0MxMC4zMjE1IDQuOTgxNjcgMTAuMDA2NSA1LjExIDEwLjAwNjUgNS4zNzI1VjYuNDE2NjdINS45MjMxOEM1LjYwMjM0IDYuNDE2NjcgNS4zMzk4NCA2LjY3OTE3IDUuMzM5ODQgN0M1LjMzOTg0IDcuMzIwODMgNS42MDIzNCA3LjU4MzMzIDUuOTIzMTggNy41ODMzM0gxMC4wMDY1VjguNjI3NUMxMC4wMDY1IDguODkgMTAuMzIxNSA5LjAxODMzIDEwLjUwMjMgOC44MzE2N0wxMi4xMjk4IDcuMjA0MTdDMTIuMjQ2NSA3LjA5MzMzIDEyLjI0NjUgNi45MDY2NyAxMi4xMzU3IDYuNzk1ODNaIiBmaWxsPSIjRTNFNEU1Ii8+Cjwvc3ZnPgo=');
-  --str-video__icon--low-bandwidth: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNMjQgMEgwdjI0aDI0eiIgZmlsbD0ibm9uZSIvPjxwYXRoIGQ9Ik04LjEgNWMuMTcgMCAuMzIuMDkuNDEuMjNsLjA3LjE1IDUuMTggMTEuNjVjLjE2LjI5LjI2LjYxLjI2Ljk2IDAgMS4xMS0uOSAyLjAxLTIuMDEgMi4wMS0uOTYgMC0xLjc3LS42OC0xLjk2LTEuNTlsLS4wMS0uMDNMNy42IDUuNWMwLS4yOC4yMi0uNS41LS41TTIzIDlsLTIgMmExMi42NiAxMi42NiAwIDAgMC0xMC41My0zLjYyTDkuMjggNC43YzQuODMtLjg2IDkuOTguNTcgMTMuNzIgNC4zTTMgMTEgMSA5YTE1LjQgMTUuNCAwIDAgMSA1LjU5LTMuNTdsLjUzIDIuODJDNS42MiA4Ljg3IDQuMjIgOS43OCAzIDExbTQgNC0yLTJjLjgtLjggMS43LTEuNDIgMi42Ni0xLjg5bC41NSAyLjkyYy0uNDIuMjctLjgzLjU5LTEuMjEuOTdtMTItMi0yIDJhNy4xIDcuMSAwIDAgMC00LjAzLTJsLTEuMjgtMi44OGMyLjYzLS4wOCA1LjMuODcgNy4zMSAyLjg4Ii8+PC9zdmc+');
-  --str-video__icon--magnifier-glass: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik04LjQ4NDkxIDcuODYwM0g3Ljk1NTk3TDcuNzY4NSA3LjY3OTUyQzguNTcxOTUgNi43NDIxNiA4Ljk4NzA2IDUuNDYzMzQgOC43NTk0MiA0LjEwNDE4QzguNDQ0NzMgMi4yNDI4NSA2Ljg5MTQgMC43NTY0NzQgNS4wMTY2OSAwLjUyODgzQzIuMTg0NTMgMC4xODA2NjkgLTAuMTk5MDMxIDIuNTY0MjMgMC4xNDkxMyA1LjM5NjM5QzAuMzc2Nzc0IDcuMjcxMSAxLjg2MzE1IDguODI0NDMgMy43MjQ0OCA5LjEzOTEyQzUuMDgzNjQgOS4zNjY3NiA2LjM2MjQ2IDguOTUxNjUgNy4yOTk4MiA4LjE0ODJMNy40ODA2IDguMzM1NjdWOC44NjQ2MUwxMC4zMjYxIDExLjcxMDJDMTAuNjAwNyAxMS45ODQ3IDExLjA0OTIgMTEuOTg0NyAxMS4zMjM4IDExLjcxMDJDMTEuNTk4MyAxMS40MzU2IDExLjU5ODMgMTAuOTg3IDExLjMyMzggMTAuNzEyNUw4LjQ4NDkxIDcuODYwM1pNNC40Njc2NiA3Ljg2MDNDMi44MDA1MSA3Ljg2MDMgMS40NTQ3MyA2LjUxNDUyIDEuNDU0NzMgNC44NDczNkMxLjQ1NDczIDMuMTgwMjEgMi44MDA1MSAxLjgzNDQzIDQuNDY3NjYgMS44MzQ0M0M2LjEzNDgyIDEuODM0NDMgNy40ODA2IDMuMTgwMjEgNy40ODA2IDQuODQ3MzZDNy40ODA2IDYuNTE0NTIgNi4xMzQ4MiA3Ljg2MDMgNC40Njc2NiA3Ljg2MDNaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K');
-  --str-video__icon--mic: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTExLjk5OSAxNC41QzEzLjY1OSAxNC41IDE0Ljk5OSAxMy4xNiAxNC45OTkgMTEuNVY1LjVDMTQuOTk5IDMuODQgMTMuNjU5IDIuNSAxMS45OTkgMi41QzEwLjMzOSAyLjUgOC45OTkwMSAzLjg0IDguOTk5MDEgNS41VjExLjVDOC45OTkwMSAxMy4xNiAxMC4zMzkgMTQuNSAxMS45OTkgMTQuNVpNMTcuOTA5IDExLjVDMTcuNDE5IDExLjUgMTcuMDA5IDExLjg2IDE2LjkyOSAxMi4zNUMxNi41MTkgMTQuNyAxNC40NjkgMTYuNSAxMS45OTkgMTYuNUM5LjUyOTAxIDE2LjUgNy40NzkwMSAxNC43IDcuMDY5MDEgMTIuMzVDNi45ODkwMSAxMS44NiA2LjU3OTAxIDExLjUgNi4wODkwMSAxMS41QzUuNDc5MDEgMTEuNSA0Ljk5OTAxIDEyLjA0IDUuMDg5MDEgMTIuNjRDNS41NzkwMSAxNS42NCA3Ljk3OTAxIDE3Ljk5IDEwLjk5OSAxOC40MlYyMC41QzEwLjk5OSAyMS4wNSAxMS40NDkgMjEuNSAxMS45OTkgMjEuNUMxMi41NDkgMjEuNSAxMi45OTkgMjEuMDUgMTIuOTk5IDIwLjVWMTguNDJDMTYuMDE5IDE3Ljk5IDE4LjQxOSAxNS42NCAxOC45MDkgMTIuNjRDMTkuMDA5IDEyLjA0IDE4LjUxOSAxMS41IDE3LjkwOSAxMS41WiIgZmlsbD0iI0IwQjRCNyIvPgo8L3N2Zz4K');
-  --str-video__icon--mic-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE0LjkyMDQgMTEuMVY1LjVDMTQuOTIwNCAzLjg0IDEzLjU4MDQgMi41IDExLjkyMDQgMi41QzEwLjM4MDQgMi41IDkuMTMwMzkgMy42NiA4Ljk2MDM5IDUuMTVMMTQuOTIwNCAxMS4xWk0xOC4wMDA0IDExLjVDMTcuNTkwNCAxMS41IDE3LjIzMDQgMTEuOCAxNy4xNzA0IDEyLjIxQzE3LjEyMDQgMTIuNTMgMTcuMDUwNCAxMi44NSAxNi45NTA0IDEzLjE0TDE4LjIyMDQgMTQuNDFDMTguNTIwNCAxMy44MSAxOC43NDA0IDEzLjE2IDE4Ljg1MDQgMTIuNDdDMTguOTIwNCAxMS45NiAxOC41MjA0IDExLjUgMTguMDAwNCAxMS41Wk0zLjYzMDM5IDQuMDZDMy4yNDAzOSA0LjQ1IDMuMjQwMzkgNS4wOCAzLjYzMDM5IDUuNDdMOC45MjAzOSAxMC43N1YxMS4yQzguOTIwMzkgMTIuMzkgOS41MjAzOSAxMy41MiAxMC41NTA0IDE0LjExQzExLjMwMDQgMTQuNTQgMTEuOTYwNCAxNC41NSAxMi41NzA0IDE0LjQyTDE0LjIzMDQgMTYuMDhDMTMuNTIwNCAxNi40MSAxMi43MzA0IDE2LjYgMTEuOTIwNCAxNi42QzkuMzgwMzkgMTYuNiA3LjA0MDM5IDE0LjgzIDYuNjcwMzkgMTIuMjFDNi42MTAzOSAxMS44IDYuMjUwMzkgMTEuNSA1Ljg0MDM5IDExLjVDNS4zMjAzOSAxMS41IDQuOTIwMzkgMTEuOTYgNC45OTAzOSAxMi40N0M1LjQ1MDM5IDE1LjQzIDcuOTUwMzkgMTcuNzcgMTAuOTIwNCAxOC4yMlYyMC41QzEwLjkyMDQgMjEuMDUgMTEuMzcwNCAyMS41IDExLjkyMDQgMjEuNUMxMi40NzA0IDIxLjUgMTIuOTIwNCAyMS4wNSAxMi45MjA0IDIwLjVWMTguMjJDMTMuODMwNCAxOC4wOSAxNC42OTA0IDE3Ljc3IDE1LjQ3MDQgMTcuMzJMMTguOTYwNCAyMC44MUMxOS4zNTA0IDIxLjIgMTkuOTgwNCAyMS4yIDIwLjM3MDQgMjAuODFDMjAuNzYwNCAyMC40MiAyMC43NjA0IDE5Ljc5IDIwLjM3MDQgMTkuNEw1LjA0MDM5IDQuMDZDNC42NTAzOSAzLjY3IDQuMDIwMzkgMy42NyAzLjYzMDM5IDQuMDZaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==');
+  --str-video__subtle: 25px; /** Subtle background blur. Used on scrims and glass surfaces where the content behind stays partly legible. */
+  --str-video__strong: 50px; /** Strong background blur. Used on scrims and glass surfaces where the content behind should be obscured. */
+  --str-video__base-transparent-white-10: rgba(255, 255, 255, 0.1);
+  --str-video__base-transparent-white-20: rgba(255, 255, 255, 0.2);
+  --str-video__base-transparent-white-30: rgba(
+    255,
+    255,
+    255,
+    0.3
+  ); /** Legacy value, no longer defined in Figma. Kept for compatibility; prefer the 0/10/15/20/25/50/75 scale. */
+  --str-video__base-transparent-white-70: rgba(
+    255,
+    255,
+    255,
+    0.7
+  ); /** Legacy value, no longer defined in Figma. Kept for compatibility; prefer the 0/10/15/20/25/50/75 scale. */
+  --str-video__base-transparent-black-5: rgba(
+    0,
+    0,
+    0,
+    0.05
+  ); /** Legacy value, no longer defined in Figma. Kept for compatibility; prefer the 0/10/15/20/25/50/75 scale. */
+  --str-video__base-transparent-black-10: rgba(
+    0,
+    0,
+    0,
+    0.1
+  ); /** Used for bg in closeButton */
+  --str-video__base-transparent-black-70: rgba(
+    0,
+    0,
+    0,
+    0.7
+  ); /** Legacy value, no longer defined in Figma. Kept for compatibility; prefer the 0/10/15/20/25/50/75 scale. */
+  --str-video__base-transparent-black-0: rgba(0, 0, 0, 0);
+  --str-video__base-transparent-black-15: rgba(0, 0, 0, 0.15);
+  --str-video__base-transparent-black-20: rgba(0, 0, 0, 0.2);
+  --str-video__base-transparent-black-25: rgba(0, 0, 0, 0.25);
+  --str-video__base-transparent-black-50: rgba(0, 0, 0, 0.5);
+  --str-video__base-transparent-black-75: rgba(0, 0, 0, 0.75);
+  --str-video__base-transparent-white-0: rgba(255, 255, 255, 0);
+  --str-video__base-transparent-white-15: rgba(255, 255, 255, 0.15);
+  --str-video__base-transparent-white-25: rgba(255, 255, 255, 0.25);
+  --str-video__base-transparent-white-50: rgba(255, 255, 255, 0.5);
+  --str-video__base-transparent-white-75: rgba(255, 255, 255, 0.75);
+  --str-video__base-black: #000000;
+  --str-video__base-white: #ffffff;
+  --str-video__slate-50: #f6f8fa;
+  --str-video__slate-100: #ebeef1;
+  --str-video__slate-150: #d5dbe1;
+  --str-video__slate-200: #c0c8d2;
+  --str-video__slate-300: #a3acba;
+  --str-video__slate-400: #87909f;
+  --str-video__slate-500: #687385;
+  --str-video__slate-600: #545969;
+  --str-video__slate-700: #414552;
+  --str-video__slate-800: #30313d;
+  --str-video__slate-900: #1a1b25;
+  --str-video__neutral-50: #f8f8f8;
+  --str-video__neutral-100: #efefef;
+  --str-video__neutral-150: #d8d8d8;
+  --str-video__neutral-200: #c4c4c4;
+  --str-video__neutral-300: #ababab;
+  --str-video__neutral-400: #8f8f8f;
+  --str-video__neutral-500: #6a6a6a;
+  --str-video__neutral-600: #565656;
+  --str-video__neutral-700: #464646;
+  --str-video__neutral-800: #323232;
+  --str-video__neutral-900: #1c1c1c;
+  --str-video__blue-50: #f3f7ff;
+  --str-video__blue-100: #e3edff;
+  --str-video__blue-150: #c3d9ff;
+  --str-video__blue-200: #a5c5ff;
+  --str-video__blue-300: #78a8ff;
+  --str-video__blue-400: #4586ff;
+  --str-video__blue-500: #005fff;
+  --str-video__blue-600: #1b53bd;
+  --str-video__blue-700: #19418d;
+  --str-video__blue-800: #142f63;
+  --str-video__blue-900: #091a3b;
+  --str-video__cyan-50: #f1fbfc;
+  --str-video__cyan-100: #d1f3f6;
+  --str-video__cyan-150: #a9e4ea;
+  --str-video__cyan-200: #72d7e0;
+  --str-video__cyan-300: #45bcc7;
+  --str-video__cyan-400: #1e9ea9;
+  --str-video__cyan-500: #248088;
+  --str-video__cyan-600: #006970;
+  --str-video__cyan-700: #065056;
+  --str-video__cyan-800: #003a3f;
+  --str-video__cyan-900: #002124;
+  --str-video__green-50: #e1ffee;
+  --str-video__green-100: #bdfcdb;
+  --str-video__green-150: #8febbd;
+  --str-video__green-200: #59dea3;
+  --str-video__green-300: #00c384;
+  --str-video__green-400: #00a46e;
+  --str-video__green-500: #277e59;
+  --str-video__green-600: #006643;
+  --str-video__green-700: #004f33;
+  --str-video__green-800: #003a25;
+  --str-video__green-900: #002213;
+  --str-video__purple-50: #f7f8ff;
+  --str-video__purple-100: #ecedff;
+  --str-video__purple-150: #d4d7ff;
+  --str-video__purple-200: #c1c5ff;
+  --str-video__purple-300: #a1a3ff;
+  --str-video__purple-400: #8482fc;
+  --str-video__purple-500: #644af9;
+  --str-video__purple-600: #553bd8;
+  --str-video__purple-700: #4032a1;
+  --str-video__purple-800: #2e2576;
+  --str-video__purple-900: #1a114d;
+  --str-video__yellow-50: #fef9da;
+  --str-video__yellow-100: #fcedb9;
+  --str-video__yellow-150: #fcd579;
+  --str-video__yellow-200: #f6bf57;
+  --str-video__yellow-300: #fa922b;
+  --str-video__yellow-400: #f26d10;
+  --str-video__yellow-500: #c84801;
+  --str-video__yellow-600: #a82c00;
+  --str-video__yellow-700: #842106;
+  --str-video__yellow-800: #5f1a05;
+  --str-video__yellow-900: #331302;
+  --str-video__red-50: #fff5fa;
+  --str-video__red-100: #ffe7f2;
+  --str-video__red-150: #ffccdf;
+  --str-video__red-200: #ffb1cd;
+  --str-video__red-300: #fe87a1;
+  --str-video__red-400: #fc526a;
+  --str-video__red-500: #d90d10;
+  --str-video__red-600: #b3093c;
+  --str-video__red-700: #890d37;
+  --str-video__red-800: #68052b;
+  --str-video__red-900: #3e021a;
+  --str-video__violet-50: #fef4ff;
+  --str-video__violet-100: #fbe8fe;
+  --str-video__violet-150: #f7cffc;
+  --str-video__violet-200: #eeb5f4;
+  --str-video__violet-300: #e68bec;
+  --str-video__violet-400: #d75fe7;
+  --str-video__violet-500: #b716ca;
+  --str-video__violet-600: #9d00ae;
+  --str-video__violet-700: #7c0089;
+  --str-video__violet-800: #5c0066;
+  --str-video__violet-900: #36003d;
+  --str-video__lime-50: #f1fde8;
+  --str-video__lime-100: #d4ffb0;
+  --str-video__lime-150: #b1ee79;
+  --str-video__lime-200: #9cda5d;
+  --str-video__lime-300: #78c100;
+  --str-video__lime-400: #639e11;
+  --str-video__lime-500: #4b7a0a;
+  --str-video__lime-600: #3e6213;
+  --str-video__lime-700: #355315;
+  --str-video__lime-800: #203a00;
+  --str-video__lime-900: #112100;
+  --str-video__size-2: 2px;
+  --str-video__size-4: 4px;
+  --str-video__size-6: 6px;
+  --str-video__size-8: 8px;
+  --str-video__size-12: 12px;
+  --str-video__size-16: 16px;
+  --str-video__size-20: 20px;
+  --str-video__size-24: 24px;
+  --str-video__size-32: 32px;
+  --str-video__size-40: 40px;
+  --str-video__size-48: 48px;
+  --str-video__size-64: 64px;
+  --str-video__size-28: 28px;
+  --str-video__size-80: 80px;
+  --str-video__size-128: 128px;
+  --str-video__size-240: 240px;
+  --str-video__size-320: 320px;
+  --str-video__size-480: 480px;
+  --str-video__size-560: 560px;
+  --str-video__size-640: 640px;
+  --str-video__size-760: 760px;
+  --str-video__size-144: 144px;
+  --str-video__size-208: 208px;
+  --str-video__size-56: 56px;
+  --str-video__size-10: 10px;
+  --str-video__size-13: 13px;
+  --str-video__size-14: 14px;
+  --str-video__size-15: 15px;
+  --str-video__size-17: 17px;
+  --str-video__size-18: 18px;
+  --str-video__size-22: 22px;
+  --str-video__radius-0: 0px;
+  --str-video__radius-2: 2px;
+  --str-video__radius-4: 4px;
+  --str-video__radius-6: 6px;
+  --str-video__radius-8: 8px;
+  --str-video__radius-12: 12px;
+  --str-video__radius-16: 16px;
+  --str-video__radius-20: 20px;
+  --str-video__radius-24: 24px;
+  --str-video__radius-32: 32px;
+  --str-video__radius-full: 9999px;
+  --str-video__space-0: 0px;
+  --str-video__space-2: 2px;
+  --str-video__space-4: 4px;
+  --str-video__space-8: 8px;
+  --str-video__space-12: 12px;
+  --str-video__space-16: 16px;
+  --str-video__space-20: 20px;
+  --str-video__space-24: 24px;
+  --str-video__space-32: 32px;
+  --str-video__space-40: 40px;
+  --str-video__space-48: 48px;
+  --str-video__space-64: 64px;
+  --str-video__space-80: 80px;
+  --str-video__space-6: 6px;
+  --str-video__space-10: 10px;
+  --str-video__space-14: 14px;
+  --str-video__w100: 1px;
+  --str-video__w150: 1.5px;
+  --str-video__w200: 2px;
+  --str-video__w300: 3px;
+  --str-video__w400: 4px;
+  --str-video__w120: 1.2px;
+  --str-video__w80: 0.8px;
+  --str-video__font-family-geist: 'Geist'; /** Primary sans-serif font for web typography. Use Geist as the main typeface. Recommended fallbacks: system-ui, -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, sans-serif. */
+  --str-video__font-family-geist-mono: 'Geist Mono'; /** Primary monospace font for web typography. Use Geist Mono for code, timestamps, and technical text. Recommended fallbacks: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace. */
+  --str-video__font-family-sf-pro: 'SF Pro'; /** Primary sans-serif font for iOS typography. Use SF Pro as the main typeface. Recommended fallbacks: -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, sans-serif. */
+  --str-video__font-family-sf-mono: 'SF Mono'; /** Primary monospace font for iOS typography. Use SF Mono for code, timestamps, and technical text. Recommended fallbacks: SFMono-Regular, Menlo, Monaco, Consolas, monospace. */
+  --str-video__font-family-roboto: 'Roboto'; /** Primary sans-serif font for Android typography. Use Roboto as the main typeface, aligned with Material and system defaults. Recommended fallbacks: Roboto, “Noto Sans”, system-ui, sans-serif. */
+  --str-video__font-family-roboto-mono: 'Roboto Mono'; /** Primary monospace font for Android typography. Use Roboto Mono for code, timestamps, and technical text. Recommended fallbacks: Roboto Mono, “Noto Sans Mono”, monospace. */
+  --str-video__font-family-inter: 'Inter'; /** Sans-serif typeface available for custom themes. */
+  --str-video__font-family-dm-mono: 'DM Mono'; /** Monospace typeface available for custom themes. */
+  --str-video__font-weight-w400: 400;
+  --str-video__font-weight-w500: 500;
+  --str-video__font-weight-w600: 600;
+  --str-video__font-weight-w700: 700;
+  --str-video__font-size-size-8: 8px;
+  --str-video__font-size-size-10: 10px;
+  --str-video__font-size-size-11: 11px;
+  --str-video__font-size-size-12: 12px;
+  --str-video__font-size-size-13: 13px;
+  --str-video__font-size-size-14: 14px;
+  --str-video__font-size-size-16: 16px;
+  --str-video__font-size-size-15: 15px;
+  --str-video__font-size-size-17: 17px;
+  --str-video__font-size-size-18: 18px;
+  --str-video__font-size-size-20: 20px;
+  --str-video__font-size-size-22: 22px;
+  --str-video__font-size-size-24: 24px;
+  --str-video__font-size-size-28: 28px;
+  --str-video__font-size-size-32: 32px;
+  --str-video__font-size-size-40: 40px;
+  --str-video__font-size-size-48: 48px;
+  --str-video__font-size-size-64: 64px;
+  --str-video__line-height-line-height-8: 8px;
+  --str-video__line-height-line-height-10: 10px;
+  --str-video__line-height-line-height-12: 12px;
+  --str-video__line-height-line-height-13: 13px;
+  --str-video__line-height-line-height-14: 14px;
+  --str-video__line-height-line-height-15: 15px;
+  --str-video__line-height-line-height-16: 16px;
+  --str-video__line-height-line-height-17: 17px;
+  --str-video__line-height-line-height-18: 18px;
+  --str-video__line-height-line-height-20: 20px;
+  --str-video__line-height-line-height-24: 24px;
+  --str-video__line-height-line-height-28: 28px;
+  --str-video__line-height-line-height-32: 32px;
+  --str-video__line-height-line-height-40: 40px;
+  --str-video__line-height-line-height-48: 48px;
+  --str-video__typography-font-weight-regular: 400; /** Default weight for body text and low-emphasis content. */
+  --str-video__typography-font-weight-medium: 500; /** Slightly emphasized weight for interactive labels, list items, and secondary headings. */
+  --str-video__typography-font-weight-semi-bold: 600; /** Strong emphasis for subheadings, active states, and UI labels that need to stand out. */
+  --str-video__typography-font-weight-bold: 700; /** Highest emphasis weight for titles, primary headings, and critical labels. */
+  --str-video__light-elevation-1:
+    0px 0px 0px 1px rgba(0, 0, 0, 0.05), 0px 1px 2px 0px rgba(0, 0, 0, 0.1),
+    0px 4px 8px 0px rgba(0, 0, 0, 0.06); /** Low elevation level for subtle separation. */
+  --str-video__light-elevation-2:
+    0px 0px 0px 1px rgba(0, 0, 0, 0.05), 0px 2px 4px 0px rgba(0, 0, 0, 0.12),
+    0px 6px 16px 0px rgba(0, 0, 0, 0.06);
+  --str-video__light-elevation-3:
+    0px 0px 0px 1px rgba(0, 0, 0, 0.05), 0px 4px 8px 0px rgba(0, 0, 0, 0.14),
+    0px 12px 24px 0px rgba(0, 0, 0, 0.1);
+  --str-video__light-elevation-4:
+    0px 0px 0px 1px rgba(0, 0, 0, 0.05), 0px 6px 12px 0px rgba(0, 0, 0, 0.16),
+    0px 20px 32px 0px rgba(0, 0, 0, 0.12);
+  --str-video__dark-elevation-1:
+    0px 0px 0px 1px rgba(255, 255, 255, 0.15),
+    0px 1px 2px 0px rgba(0, 0, 0, 0.2), 0px 4px 8px 0px rgba(0, 0, 0, 0.1);
+  --str-video__dark-elevation-2:
+    0px 0px 0px 1px rgba(255, 255, 255, 0.15),
+    0px 2px 4px 0px rgba(0, 0, 0, 0.22), 0px 6px 16px 0px rgba(0, 0, 0, 0.12);
+  --str-video__dark-elevation-3:
+    0px 0px 0px 1px rgba(255, 255, 255, 0.15),
+    0px 4px 8px 0px rgba(0, 0, 0, 0.24), 0px 12px 24px 0px rgba(0, 0, 0, 0.14);
+  --str-video__dark-elevation-4:
+    0px 0px 0px 1px rgba(255, 255, 255, 0.15),
+    0px 6px 12px 0px rgba(0, 0, 0, 0.28), 0px 20px 32px 0px rgba(0, 0, 0, 0.16);
+  --str-video__button-padding-y-lg: 14px;
+  --str-video__button-padding-y-md: 10px;
+  --str-video__button-padding-y-sm: 6px;
+  --str-video__button-padding-y-xs: 2px;
+  --str-video__button-padding-x-icon-only-lg: 16px;
+  --str-video__button-padding-x-icon-only-md: 12px;
+  --str-video__button-padding-x-icon-only-sm: 8px;
+  --str-video__button-padding-x-icon-only-xs: 4px;
+  --str-video__button-padding-x-with-label-lg: 16px;
+  --str-video__button-padding-x-with-label-md: 16px;
+  --str-video__button-padding-x-with-label-sm: 16px;
+  --str-video__button-padding-x-with-label-xs: 12px;
+  --str-video__background-core-overlay-dark: rgba(
+    26,
+    27,
+    37,
+    0.25
+  ); /** A dark semi-transparent layer. Used for image overlays. */
+  --str-video__background-core-overlay-dark-strong: rgba(
+    26,
+    27,
+    37,
+    0.75
+  ); /** A dark semi-transparent layer. Used for image overlays. */
+  --str-video__background-core-overlay-light: rgba(
+    255,
+    255,
+    255,
+    0.75
+  ); /** A light semi-transparent layer. Used to lighten surfaces and for hover states on dark backgrounds. */
+  --str-video__background-core-scrim: rgba(
+    26,
+    27,
+    37,
+    0.5
+  ); /** A heavy semi-transparent layer. Used behind sheets, drawers, and modals to separate them from content. */
+  --str-video__background-utility-hover: rgba(
+    26,
+    27,
+    37,
+    0.1
+  ); /** A semi-transparent overlay applied on pointer hover. Sits on top of any surface without replacing it. */
+  --str-video__background-utility-pressed: rgba(
+    26,
+    27,
+    37,
+    0.15
+  ); /** A slightly stronger overlay applied during an active press or tap. Provides tactile feedback on interactive elements. */
+  --str-video__background-utility-selected: rgba(
+    26,
+    27,
+    37,
+    0.2
+  ); /** Indicates an active or selected state. Used for selected messages, active list items, and toggled controls. */
+  --str-video__border-utility-hover: rgba(
+    26,
+    27,
+    37,
+    0.1
+  ); /** Applied on pointer hover over bordered interactive elements. */
+  --str-video__border-utility-pressed: rgba(
+    26,
+    27,
+    37,
+    0.2
+  ); /** Applied during an active press on bordered interactive elements. */
+  --str-video__border-utility-selected: rgba(
+    26,
+    27,
+    37,
+    0.15
+  ); /** Border for selected or active items. Used for highlighted list items and active controls. */
+  --str-video__border-core-opacity-strong: rgba(
+    26,
+    27,
+    37,
+    0.25
+  ); /** A stronger transparent border for elements on colored or dark backgrounds. Used for waveform bars and similar treatments. */
+  --str-video__border-core-opacity-subtle: rgba(
+    26,
+    27,
+    37,
+    0.1
+  ); /** A very light transparent border. Used as a frame treatment on images and media attachments. */
+  --str-video__system-bg-blur: rgba(255, 255, 255, 0.01);
+  --str-video__system-scrollbar: rgba(0, 0, 0, 0.5);
+  --str-video__badge-bg-overlay: rgba(0, 0, 0, 0.75);
+  --str-video__base-transparent-0: var(
+    --str-video__base-transparent-white-0
+  ); /** Deprecated. Superseded by base/transparent/white-0%. Kept as an alias so existing integrations keep working; will be removed in a later release. */
+  --str-video__typography-font-family-sans: var(
+    --str-video__font-family-geist
+  ); /** The primary UI typeface. Maps to SF Pro on iOS, Roboto on Android, and Geist on web. */
+  --str-video__typography-font-family-mono: var(
+    --str-video__font-family-geist-mono
+  ); /** The monospace typeface. Used for code snippets, and technical string values. */
+  --str-video__typography-font-size-xxs: var(
+    --str-video__font-size-size-10
+  ); /** Very small text for fine-print labels, counters, and compact secondary information */
+  --str-video__typography-font-size-xs: var(
+    --str-video__font-size-size-12
+  ); /** Small text for supporting labels, timestamps, and low-hierarchy metadata. */
+  --str-video__typography-font-size-sm: var(
+    --str-video__font-size-size-14
+  ); /** Secondary body text for subtitles, helper text, and de-emphasized UI copy. */
+  --str-video__typography-font-size-md: var(
+    --str-video__font-size-size-16
+  ); /** Default body text size for most readable UI content. */
+  --str-video__typography-font-size-lg: var(
+    --str-video__font-size-size-18
+  ); /** Emphasized body text for primary labels, section headings, and prominent UI copy. */
+  --str-video__typography-font-size-xl: var(
+    --str-video__font-size-size-20
+  ); /** Large text for titles, screen headings, and high-hierarchy labels */
+  --str-video__typography-font-size-2xl: var(
+    --str-video__font-size-size-24
+  ); /** Section titles, important headings. */
+  --str-video__typography-font-size-micro: var(
+    --str-video__font-size-size-8
+  ); /** Smallest text size. Reserved for legal, captions, or secondary metadata where space is extremely constrained. */
+  --str-video__typography-line-height-tight: var(
+    --str-video__line-height-line-height-16
+  ); /** Compact line spacing for short labels, badges, and single-line UI text where vertical density matters. */
+  --str-video__typography-line-height-normal: var(
+    --str-video__line-height-line-height-20
+  ); /** Compact line spacing for short labels, badges, and single-line UI text where vertical density matters. */
+  --str-video__typography-line-height-relaxed: var(
+    --str-video__line-height-line-height-24
+  ); /** Generous line spacing for multi-line body text and message content where readability is the priority. */
+  --str-video__radius-none: var(
+    --str-video__radius-0
+  ); /** No border radius. Used for elements that must have sharp corners, such as full-width banners or flush containers. */
+  --str-video__radius-xxs: var(
+    --str-video__radius-2
+  ); /** 2px radius. Minimal rounding for compact elements like inline badges and tight chips. */
+  --str-video__radius-xs: var(
+    --str-video__radius-4
+  ); /** 4px radius. Subtle rounding for small interactive elements like tags and small buttons. */
+  --str-video__radius-sm: var(
+    --str-video__radius-6
+  ); /** 6px radius. Light rounding for inputs, secondary buttons, and contained UI elements. */
+  --str-video__radius-md: var(
+    --str-video__radius-8
+  ); /** 8px radius. Default radius for cards, modals, and standard interactive components. */
+  --str-video__radius-lg: var(
+    --str-video__radius-12
+  ); /** 12px radius. Prominent rounding for sheets, drawers, and larger containers. */
+  --str-video__radius-xl: var(--str-video__radius-16);
+  --str-video__radius-2xl: var(--str-video__radius-20);
+  --str-video__radius-max: var(--str-video__radius-full);
+  --str-video__radius-3xl: var(--str-video__radius-24);
+  --str-video__radius-4xl: var(--str-video__radius-32);
+  --str-video__spacing-none: var(
+    --str-video__space-0
+  ); /** No spacing. Used for tight component joins. */
+  --str-video__spacing-xxs: var(
+    --str-video__space-4
+  ); /** Base unit. Minimal padding, tight gaps. */
+  --str-video__spacing-xs: var(
+    --str-video__space-8
+  ); /** Small padding and default vertical gaps. */
+  --str-video__spacing-sm: var(
+    --str-video__space-12
+  ); /** Common internal spacing in inputs and buttons. */
+  --str-video__spacing-md: var(
+    --str-video__space-16
+  ); /** Default large padding for sections and cards. */
+  --str-video__spacing-xl: var(
+    --str-video__space-24
+  ); /** Comfortable spacing for chat bubbles and list items. */
+  --str-video__spacing-2xl: var(
+    --str-video__space-32
+  ); /** Larger spacing for panels, modals, and gutters. */
+  --str-video__spacing-3xl: var(
+    --str-video__space-40
+  ); /** Used for wide layout spacing and breathing room. */
+  --str-video__spacing-lg: var(
+    --str-video__space-20
+  ); /** Medium spacing for grouping elements and section breaks. */
+  --str-video__spacing-xxxs: var(--str-video__space-2);
+  --str-video__device-safe-area-bottom: var(--str-video__space-0);
+  --str-video__device-safe-area-top: var(--str-video__space-0);
+  --str-video__button-radius-lg: var(--str-video__radius-full);
+  --str-video__button-radius-md: var(--str-video__radius-full);
+  --str-video__button-radius-sm: var(--str-video__radius-full);
+  --str-video__button-radius-full: var(--str-video__radius-full);
+  --str-video__button-visual-height-sm: var(--str-video__size-32);
+  --str-video__button-visual-height-md: var(--str-video__size-40);
+  --str-video__button-visual-height-lg: var(--str-video__size-48);
+  --str-video__button-visual-height-xs: var(--str-video__size-24);
+  /**
+   * Minimum interactive hit target size.
+   *
+   * iOS / Android: enforce minimum touch target.
+   * Web: do not apply a min-width or min-height; size to content.
+   *
+   * Note: Web uses a placeholder value in Figma due to variable mode constraints.
+   */
+  --str-video__button-hit-target-min-height: var(--str-video__size-48);
+  /**
+   * Minimum interactive hit target size.
+   *
+   * iOS / Android: enforce minimum touch target.
+   * Web: do not apply a min-width or min-height; size to content.
+   *
+   * Note: Web uses a placeholder value in Figma due to variable mode constraints.
+   */
+  --str-video__button-hit-target-min-width: var(--str-video__size-48);
+  --str-video__icon-size-xs: var(--str-video__size-12);
+  --str-video__icon-size-sm: var(--str-video__size-16);
+  --str-video__icon-size-md: var(--str-video__size-20);
+  --str-video__icon-size-lg: var(--str-video__size-32);
+  --str-video__icon-stroke-subtle: var(--str-video__w120);
+  --str-video__icon-stroke-default: var(--str-video__w150);
+  --str-video__icon-stroke-emphasis: var(--str-video__w200);
+  --str-video__emoji-md: var(--str-video__font-size-size-24);
+  --str-video__emoji-lg: var(--str-video__font-size-size-32);
+  --str-video__emoji-xl: var(--str-video__font-size-size-48);
+  --str-video__emoji-2xl: var(--str-video__font-size-size-64);
+  --str-video__input-radius-search-input: var(--str-video__radius-full);
+  --str-video__background-core-highlight: var(
+    --str-video__yellow-50
+  ); /** A tint for drawing attention to content. Used for highlights and pinned messages. */
+  --str-video__background-utility-skeleton-loading-highlight: var(
+    --str-video__background-core-overlay-light
+  ); /** Highlight color for the default skeleton loading gradient. Used for the moving shimmer to indicate loading activity. */
+  --str-video__control-call-control-error-badge-text: var(
+    --str-video__base-black
+  ); /** Icon or text on the error badge. Pinned to black in every mode, because the badge background does not invert and a mode-aware text token would flip to white on yellow. */
+  --str-video__accent-success: var(
+    --str-video__green-400
+  ); /** Indicates a positive or completed state. Used for confirmations, sent indicators, and success feedback. */
+  --str-video__accent-warning: var(
+    --str-video__yellow-200
+  ); /** Indicates a cautionary state that requires attention. Used for moderation flags and non-critical alerts. */
+  --str-video__accent-error: var(
+    --str-video__red-500
+  ); /** Indicates a failure or destructive state. Used for failed messages, validation errors, and deletions. */
+  --str-video__brand-50: var(--str-video__blue-50);
+  --str-video__brand-100: var(--str-video__blue-100);
+  --str-video__brand-150: var(--str-video__blue-150);
+  --str-video__brand-200: var(--str-video__blue-200);
+  --str-video__brand-300: var(--str-video__blue-300);
+  --str-video__brand-400: var(--str-video__blue-400);
+  --str-video__brand-500: var(--str-video__blue-500);
+  --str-video__brand-600: var(--str-video__blue-600);
+  --str-video__brand-700: var(--str-video__blue-700);
+  --str-video__brand-800: var(--str-video__blue-800);
+  --str-video__brand-900: var(--str-video__blue-900);
+  --str-video__chrome-0: var(--str-video__base-white);
+  --str-video__chrome-50: var(--str-video__slate-50);
+  --str-video__chrome-100: var(--str-video__slate-100);
+  --str-video__chrome-150: var(--str-video__slate-150);
+  --str-video__chrome-200: var(--str-video__slate-200);
+  --str-video__chrome-300: var(--str-video__slate-300);
+  --str-video__chrome-400: var(--str-video__slate-400);
+  --str-video__chrome-500: var(--str-video__slate-500);
+  --str-video__chrome-600: var(--str-video__slate-600);
+  --str-video__chrome-700: var(--str-video__slate-700);
+  --str-video__chrome-800: var(--str-video__slate-800);
+  --str-video__chrome-900: var(--str-video__slate-900);
+  --str-video__chrome-1000: var(--str-video__base-black);
+  --str-video__device-radius: var(--str-video__radius-md);
+  --str-video__button-primary-bg-liquid-glass: var(
+    --str-video__base-transparent-0
+  );
+  --str-video__button-primary-border: var(--str-video__brand-200);
+  --str-video__button-destructive-bg: var(--str-video__accent-error);
+  --str-video__button-destructive-text: var(--str-video__accent-error);
+  --str-video__button-destructive-border: var(--str-video__accent-error);
+  --str-video__emoji-sm: var(--str-video__typography-font-size-md);
+  --str-video__input-radius-text-input: var(--str-video__radius-lg);
+  --str-video__input-radius-select-input: var(--str-video__radius-lg);
+  --str-video__input-radius-option-card: var(--str-video__radius-lg);
+  --str-video__background-core-app: var(
+    --str-video__chrome-0
+  ); /** The outermost application background. Sits behind all surfaces and is generally not overridden directly. */
+  --str-video__background-core-elevation-0: var(
+    --str-video__chrome-0
+  ); /** The base layer. Always white, used as the reference point for the elevation scale. Steps above this gain depth in dark mode through progressively lighter backgrounds. */
+  --str-video__background-core-elevation-1: var(
+    --str-video__chrome-0
+  ); /** Slightly raised surfaces. Used for content containers that sit directly on the base layer, such as the message list and channel list. */
+  --str-video__background-core-elevation-2: var(
+    --str-video__chrome-0
+  ); /** Floating and modal surfaces. Used for popovers, dropdowns, dialogs, and any element that interrupts the content flow. */
+  --str-video__background-core-elevation-3: var(
+    --str-video__chrome-0
+  ); /** Used for badge counts that float above other UI elements. */
+  --str-video__background-core-inverse: var(
+    --str-video__chrome-1000
+  ); /** The opposite of the primary surface. Used for tooltips, snackbars, and high-contrast floating elements. */
+  --str-video__background-core-on-accent: var(
+    --str-video__chrome-0
+  ); /** Background for elements placed on an accent-colored surface. Ensures legibility against brand colors. */
+  --str-video__background-core-on-elevation: var(
+    --str-video__chrome-100
+  ); /** Background for controls and elements inside a floating surface, such as a menu, dialog, or popover. Steps up in dark mode, where the elevated surface has already lightened and a plain surface background would disappear into it. */
+  --str-video__background-core-surface-card: var(
+    --str-video__chrome-50
+  ); /** Background for contained, card-style elements. Matches the surface in light mode but lifts slightly in dark mode to maintain visual separation. */
+  --str-video__background-core-surface-default: var(
+    --str-video__chrome-100
+  ); /** Background for sectioned content areas. Used for grouped containers, and distinct content regions. */
+  --str-video__background-core-surface-strong: var(
+    --str-video__chrome-150
+  ); /** A more prominent background. Used for elements that need to stand out from the main surface. */
+  --str-video__background-core-surface-subtle: var(
+    --str-video__chrome-50
+  ); /** A slightly receded background. Used for secondary containers or to create soft visual separation. */
+  --str-video__background-utility-disabled: var(
+    --str-video__chrome-100
+  ); /** Background for non-interactive elements. Flattens the element visually to signal unavailability. */
+  --str-video__background-utility-skeleton-loading-base: var(
+    --str-video__base-transparent-0
+  ); /** Base color for the default skeleton loading gradient. Used as the background tone for placeholder surfaces. */
+  --str-video__border-utility-focused: var(
+    --str-video__brand-150
+  ); /** Focus ring for keyboard and accessibility navigation. Uses the brand color to signal input focus. */
+  --str-video__border-utility-success: var(
+    --str-video__accent-success
+  ); /** Border for positive or confirmed states. Used on validated inputs and success indicators. */
+  --str-video__border-utility-warning: var(
+    --str-video__accent-warning
+  ); /** Border for cautionary states. Used on inputs or elements requiring attention. */
+  --str-video__border-utility-error: var(
+    --str-video__accent-error
+  ); /** Border for failure or invalid states. Used on failed inputs and destructive confirmations. */
+  --str-video__border-utility-disabled: var(
+    --str-video__chrome-100
+  ); /** Border for non-interactive elements. Matches the disabled surface to visually flatten the element. */
+  --str-video__border-utility-disabled-on-surface: var(
+    --str-video__chrome-150
+  ); /** Border for disabled elements on elevated surfaces. Stays visually distinct from the surface without drawing attention to a non-interactive element. */
+  --str-video__border-core-default: var(
+    --str-video__chrome-150
+  ); /** Standard border for surfaces and containers. Used for input fields, cards, and dividers on neutral backgrounds. */
+  --str-video__border-core-on-accent: var(
+    --str-video__chrome-0
+  ); /** Border on accent-colored surfaces. Stays white in both modes since the accent background doesn't invert. */
+  --str-video__border-core-on-elevation: var(
+    --str-video__chrome-150
+  ); /** Border for controls and elements inside a floating surface, such as a menu, dialog, or popover. Steps up in dark mode to keep the edge visible once the elevated surface has lightened. Use border/core/on-surface instead for elements on a plain surface. */
+  --str-video__border-core-on-inverse: var(
+    --str-video__chrome-0
+  ); /** Border on inverse-colored surfaces. Stays legible when the background flips between light and dark mode. */
+  --str-video__border-core-on-surface: var(
+    --str-video__chrome-300
+  ); /** Border for elements sitting on elevated surfaces. Uses a stronger value than default to maintain visible separation when the background is darker. */
+  --str-video__border-core-strong: var(
+    --str-video__chrome-300
+  ); /** An emphatic border for elements that need clear definition. Used for focused containers and prominent dividers. */
+  --str-video__border-core-subtle: var(
+    --str-video__chrome-100
+  ); /** A lighter border for minimal separation. Used where a full-strength border would feel too heavy. */
+  --str-video__avatar-presence-bg-online: var(
+    --str-video__accent-success
+  ); /** The green online indicator. Uses success accent in normal themes. In high-contrast, color is dropped and replaced with strong black for maximum clarity. */
+  --str-video__avatar-bg-default: var(--str-video__brand-150);
+  --str-video__avatar-bg-placeholder: var(--str-video__chrome-150);
+  --str-video__avatar-text-default: var(--str-video__brand-900);
+  --str-video__avatar-text-placeholder: var(--str-video__chrome-500);
+  --str-video__system-text: var(--str-video__chrome-1000);
+  --str-video__badge-bg-error: var(--str-video__accent-error);
+  --str-video__badge-bg-inverse: var(--str-video__chrome-1000);
+  --str-video__control-checkbox-bg: var(--str-video__base-transparent-0);
+  --str-video__control-radio-button-bg: var(--str-video__base-transparent-0);
+  --str-video__control-radio-check-bg: var(--str-video__base-transparent-0);
+  --str-video__control-accept-call-button-bg: var(
+    --str-video__accent-success
+  ); /** Background for the accept call action. Green rather than the primary accent, so accept and decline read as opposites rather than as two primary actions. */
+  --str-video__control-call-control-error-badge-bg: var(
+    --str-video__accent-warning
+  ); /** Background for the error badge on a call control button. Yellow rather than red, so it stays legible on a red button and over video. */
+  --str-video__control-decline-call-button-bg: var(
+    --str-video__accent-error
+  ); /** Background for the decline call action. Red rather than the destructive button token, so accept and decline read as a matched pair. */
+  --str-video__text-primary: var(
+    --str-video__chrome-900
+  ); /** Main body text. Used for message content, titles, and any text that carries primary meaning. */
+  --str-video__text-secondary: var(
+    --str-video__chrome-700
+  ); /** Supporting metadata text. Used for timestamps, subtitles, and secondary labels. */
+  --str-video__text-tertiary: var(
+    --str-video__chrome-500
+  ); /** De-emphasized text. Used for hints, placeholders, and lowest-priority supporting information. */
+  --str-video__text-on-inverse: var(
+    --str-video__chrome-0
+  ); /** Text on inverse-colored surfaces. Flips between light and dark to maintain legibility when the background inverts. */
+  --str-video__text-on-accent: var(
+    --str-video__chrome-0
+  ); /** Text on accent-colored surfaces. Stays white in both light and dark mode since the accent background doesn't invert. */
+  --str-video__text-disabled: var(
+    --str-video__chrome-300
+  ); /** Text for non-interactive or unavailable states. Communicates that an element can't be interacted with. */
+  --str-video__text-link: var(
+    --str-video__brand-500
+  ); /** Hyperlinks and inline actions. Uses the brand color to signal interactivity within text content. */
+  --str-video__accent-primary: var(
+    --str-video__brand-500
+  ); /** The main brand color. Used for interactive elements, buttons, links, and primary actions. Override this to apply your brand color across the SDK. */
+  --str-video__accent-neutral: var(
+    --str-video__chrome-500
+  ); /** A mid-tone gray for de-emphasized UI elements. */
+  --str-video__label-bg-neutral: var(
+    --str-video__chrome-150
+  ); /** Background for a neutral label. */
+  --str-video__label-bg-primary: var(
+    --str-video__brand-150
+  ); /** Background for a primary label. */
+  --str-video__label-text-primary: var(
+    --str-video__brand-900
+  ); /** Text on a primary label. */
+  --str-video__indicator-connection-quality-fair: var(
+    --str-video__accent-warning
+  ); /** Reduced connection. Fills two bars on the connection quality indicator. */
+  --str-video__indicator-connection-quality-great: var(
+    --str-video__accent-success
+  ); /** Strongest connection. Fills all three bars on the connection quality indicator. */
+  --str-video__indicator-connection-quality-poor: var(
+    --str-video__accent-error
+  ); /** Weak connection. Fills one bar, and is the only quality state worth interrupting the user for. */
+  --str-video__indicator-microphone-level-bar-active: var(
+    --str-video__brand-400
+  ); /** A filled bar in the microphone level meter. The number filled tracks the live input level from the selected device. */
+  --str-video__indicator-microphone-level-bar-inactive: var(
+    --str-video__chrome-200
+  ); /** An unfilled bar in the microphone level meter. Always drawn, so the meter keeps a constant width as the level moves. */
+  --str-video__indicator-sound-indicator-speaking: var(
+    --str-video__brand-400
+  ); /** Shown while a remote participant is talking. Only meaningful once the call is connected, since speaking state arrives from SFU events. */
+  --str-video__button-primary-bg: var(--str-video__accent-primary);
+  --str-video__button-primary-text: var(--str-video__accent-primary);
+  --str-video__button-primary-text-on-accent: var(--str-video__text-on-accent);
+  --str-video__button-primary-text-on-dark: var(--str-video__text-on-inverse);
+  --str-video__button-primary-border-on-dark: var(
+    --str-video__border-core-on-inverse
+  );
+  --str-video__button-secondary-bg: var(
+    --str-video__background-core-surface-default
+  );
+  --str-video__button-secondary-bg-liquid-glass: var(
+    --str-video__background-core-elevation-0
+  );
+  --str-video__button-secondary-text: var(--str-video__text-primary);
+  --str-video__button-secondary-text-on-accent: var(--str-video__text-primary);
+  --str-video__button-secondary-text-on-dark: var(--str-video__text-on-inverse);
+  --str-video__button-secondary-border: var(--str-video__border-core-default);
+  --str-video__button-secondary-border-on-dark: var(
+    --str-video__border-core-on-inverse
+  );
+  --str-video__button-destructive-bg-liquid-glass: var(
+    --str-video__background-core-elevation-0
+  );
+  --str-video__button-destructive-text-on-accent: var(
+    --str-video__text-on-accent
+  );
+  --str-video__button-destructive-text-on-dark: var(
+    --str-video__text-on-inverse
+  );
+  --str-video__button-destructive-border-on-dark: var(
+    --str-video__text-on-inverse
+  );
+  --str-video__input-text-default: var(
+    --str-video__text-primary
+  ); /** Main text inside the chat input. */
+  --str-video__input-text-placeholder: var(
+    --str-video__text-tertiary
+  ); /** Placeholder text for the input. Lower emphasis than main text. */
+  --str-video__input-text-disabled: var(
+    --str-video__text-disabled
+  ); /** Placeholder text for the input. Lower emphasis than main text. */
+  --str-video__input-text-icon: var(
+    --str-video__text-tertiary
+  ); /** Icons inside the input area (attach, emoji, camera, send when idle). Matches secondary text strength. */
+  --str-video__input-text-icon-active: var(
+    --str-video__text-primary
+  ); /** Icons inside the input area in their active state. Steps up from the resting icon colour to primary text. */
+  --str-video__border-utility-active: var(
+    --str-video__accent-primary
+  ); /** Active input border. Used for focused text fields and selected form elements. */
+  --str-video__avatar-presence-border: var(
+    --str-video__border-core-on-inverse
+  ); /** The thin outline around the presence dot. Matches the local surface behind the avatar. In high-contrast it uses the base surface. */
+  --str-video__avatar-presence-bg-offline: var(
+    --str-video__accent-neutral
+  ); /** The green online indicator. Uses success accent in normal themes. In high-contrast, color is dropped and replaced with strong black for maximum clarity. */
+  --str-video__system-caret: var(--str-video__accent-primary);
+  --str-video__badge-bg-default: var(--str-video__background-core-elevation-3);
+  --str-video__badge-bg-primary: var(--str-video__accent-primary);
+  --str-video__badge-bg-neutral: var(--str-video__accent-neutral);
+  --str-video__badge-text: var(--str-video__text-primary);
+  --str-video__badge-text-on-inverse: var(--str-video__text-on-inverse);
+  --str-video__badge-text-on-accent: var(--str-video__text-on-accent);
+  --str-video__badge-border: var(--str-video__border-core-on-inverse);
+  --str-video__control-progress-bar-fill: var(--str-video__accent-neutral);
+  --str-video__control-progress-bar-track: var(
+    --str-video__background-core-surface-strong
+  );
+  --str-video__control-progress-bar-fill-audio: var(
+    --str-video__accent-primary
+  ); /** Progress fill for audio playback, distinct from the neutral fill used elsewhere. */
+  --str-video__control-toggle-switch-bg: var(--str-video__accent-neutral);
+  --str-video__control-toggle-switch-bg-selected: var(
+    --str-video__accent-primary
+  );
+  --str-video__control-toggle-switch-bg-disabled: var(
+    --str-video__background-utility-disabled
+  );
+  --str-video__control-toggle-switch-knob: var(
+    --str-video__background-core-on-accent
+  );
+  --str-video__control-checkbox-border: var(--str-video__border-core-default);
+  --str-video__control-checkbox-bg-selected: var(--str-video__accent-primary);
+  --str-video__control-checkbox-icon: var(--str-video__text-on-accent);
+  --str-video__control-radio-button-border: var(
+    --str-video__border-core-default
+  );
+  --str-video__control-radio-button-bg-selected: var(
+    --str-video__accent-primary
+  );
+  --str-video__control-radio-button-indicator: var(--str-video__text-on-accent);
+  --str-video__control-radio-check-border: var(
+    --str-video__border-core-default
+  );
+  --str-video__control-radio-check-bg-selected: var(
+    --str-video__accent-primary
+  );
+  --str-video__control-radio-check-icon: var(--str-video__text-on-accent);
+  --str-video__control-chip-border: var(--str-video__border-core-default);
+  --str-video__control-chip-text: var(--str-video__text-primary);
+  --str-video__control-accept-call-button-text: var(
+    --str-video__text-on-accent
+  ); /** Icon or label on the accept call action, sitting on the success background. */
+  --str-video__control-decline-call-button-text: var(
+    --str-video__text-on-accent
+  ); /** Icon or label on the decline call action, sitting on the error background. */
+  --str-video__label-text-neutral: var(
+    --str-video__text-primary
+  ); /** Text on a neutral label. */
+  --str-video__tab-indicator: var(
+    --str-video__accent-primary
+  ); /** The underline on the selected tab. */
+  --str-video__tab-text: var(
+    --str-video__text-secondary
+  ); /** Label colour of an unselected tab. */
+  --str-video__tab-text-selected: var(
+    --str-video__accent-primary
+  ); /** Label colour of the selected tab. */
+  --str-video__tab-track: var(
+    --str-video__border-core-default
+  ); /** The line running under the tab bar. */
+}
+
+.str-video__theme-dark {
+  --str-video__background-core-overlay-dark: rgba(
+    0,
+    0,
+    0,
+    0.5
+  ); /** A dark semi-transparent layer. Used for image overlays. */
+  --str-video__background-core-overlay-dark-strong: rgba(
+    0,
+    0,
+    0,
+    0.75
+  ); /** A dark semi-transparent layer. Used for image overlays. */
+  --str-video__background-core-overlay-light: rgba(
+    0,
+    0,
+    0,
+    0.75
+  ); /** A light semi-transparent layer. Used to lighten surfaces and for hover states on dark backgrounds. */
+  --str-video__background-core-scrim: rgba(
+    0,
+    0,
+    0,
+    0.75
+  ); /** A heavy semi-transparent layer. Used behind sheets, drawers, and modals to separate them from content. */
+  --str-video__background-utility-hover: rgba(
+    255,
+    255,
+    255,
+    0.15
+  ); /** A semi-transparent overlay applied on pointer hover. Sits on top of any surface without replacing it. */
+  --str-video__background-utility-pressed: rgba(
+    255,
+    255,
+    255,
+    0.2
+  ); /** A slightly stronger overlay applied during an active press or tap. Provides tactile feedback on interactive elements. */
+  --str-video__background-utility-selected: rgba(
+    255,
+    255,
+    255,
+    0.25
+  ); /** Indicates an active or selected state. Used for selected messages, active list items, and toggled controls. */
+  --str-video__border-utility-selected: rgba(
+    255,
+    255,
+    255,
+    0.15
+  ); /** Border for selected or active items. Used for highlighted list items and active controls. */
+  --str-video__border-utility-hover: rgba(
+    255,
+    255,
+    255,
+    0.1
+  ); /** Applied on pointer hover over bordered interactive elements. */
+  --str-video__border-utility-pressed: rgba(
+    255,
+    255,
+    255,
+    0.2
+  ); /** Applied during an active press on bordered interactive elements. */
+  --str-video__border-core-opacity-strong: rgba(
+    255,
+    255,
+    255,
+    0.25
+  ); /** A stronger transparent border for elements on colored or dark backgrounds. Used for waveform bars and similar treatments. */
+  --str-video__border-core-opacity-subtle: rgba(
+    255,
+    255,
+    255,
+    0.2
+  ); /** A very light transparent border. Used as a frame treatment on images and media attachments. */
+  --str-video__system-bg-blur: rgba(0, 0, 0, 0.01);
+  --str-video__system-scrollbar: rgba(255, 255, 255, 0.5);
+  /**
+   * Minimum interactive hit target size.
+   *
+   * iOS / Android: enforce minimum touch target.
+   * Web: do not apply a min-width or min-height; size to content.
+   *
+   * Note: Web uses a placeholder value in Figma due to variable mode constraints.
+   */
+  /**
+   * Minimum interactive hit target size.
+   *
+   * iOS / Android: enforce minimum touch target.
+   * Web: do not apply a min-width or min-height; size to content.
+   *
+   * Note: Web uses a placeholder value in Figma due to variable mode constraints.
+   */
+  --str-video__background-core-highlight: var(
+    --str-video__yellow-800
+  ); /** A tint for drawing attention to content. Used for highlights and pinned messages. */
+  --str-video__accent-success: var(
+    --str-video__green-300
+  ); /** Indicates a positive or completed state. Used for confirmations, sent indicators, and success feedback. */
+  --str-video__accent-warning: var(
+    --str-video__yellow-150
+  ); /** Indicates a cautionary state that requires attention. Used for moderation flags and non-critical alerts. */
+  --str-video__accent-error: var(
+    --str-video__red-400
+  ); /** Indicates a failure or destructive state. Used for failed messages, validation errors, and deletions. */
+  --str-video__brand-50: var(--str-video__blue-900);
+  --str-video__brand-100: var(--str-video__blue-800);
+  --str-video__brand-150: var(--str-video__blue-700);
+  --str-video__brand-200: var(--str-video__blue-600);
+  --str-video__brand-300: var(--str-video__blue-500);
+  --str-video__brand-500: var(--str-video__blue-300);
+  --str-video__brand-600: var(--str-video__blue-200);
+  --str-video__brand-700: var(--str-video__blue-150);
+  --str-video__brand-800: var(--str-video__blue-100);
+  --str-video__brand-900: var(--str-video__blue-50);
+  --str-video__chrome-0: var(--str-video__base-black);
+  --str-video__chrome-50: var(--str-video__neutral-900);
+  --str-video__chrome-100: var(--str-video__neutral-800);
+  --str-video__chrome-150: var(--str-video__neutral-700);
+  --str-video__chrome-200: var(--str-video__neutral-600);
+  --str-video__chrome-300: var(--str-video__neutral-500);
+  --str-video__chrome-400: var(--str-video__neutral-400);
+  --str-video__chrome-500: var(--str-video__neutral-300);
+  --str-video__chrome-600: var(--str-video__neutral-200);
+  --str-video__chrome-700: var(--str-video__neutral-150);
+  --str-video__chrome-800: var(--str-video__neutral-100);
+  --str-video__chrome-900: var(--str-video__neutral-50);
+  --str-video__chrome-1000: var(--str-video__base-white);
+  --str-video__background-core-elevation-1: var(
+    --str-video__chrome-50
+  ); /** Slightly raised surfaces. Used for content containers that sit directly on the base layer, such as the message list and channel list. */
+  --str-video__background-core-elevation-2: var(
+    --str-video__chrome-100
+  ); /** Floating and modal surfaces. Used for popovers, dropdowns, dialogs, and any element that interrupts the content flow. */
+  --str-video__background-core-elevation-3: var(
+    --str-video__chrome-200
+  ); /** Used for badge counts that float above other UI elements. */
+  --str-video__background-core-on-accent: var(
+    --str-video__chrome-1000
+  ); /** Background for elements placed on an accent-colored surface. Ensures legibility against brand colors. */
+  --str-video__background-core-on-elevation: var(
+    --str-video__chrome-150
+  ); /** Background for controls and elements inside a floating surface, such as a menu, dialog, or popover. Steps up in dark mode, where the elevated surface has already lightened and a plain surface background would disappear into it. */
+  --str-video__background-core-surface-card: var(
+    --str-video__chrome-100
+  ); /** Background for contained, card-style elements. Matches the surface in light mode but lifts slightly in dark mode to maintain visual separation. */
+  --str-video__border-core-default: var(
+    --str-video__chrome-200
+  ); /** Standard border for surfaces and containers. Used for input fields, cards, and dividers on neutral backgrounds. */
+  --str-video__border-core-on-accent: var(
+    --str-video__chrome-1000
+  ); /** Border on accent-colored surfaces. Stays white in both modes since the accent background doesn't invert. */
+  --str-video__border-core-on-elevation: var(
+    --str-video__chrome-300
+  ); /** Border for controls and elements inside a floating surface, such as a menu, dialog, or popover. Steps up in dark mode to keep the edge visible once the elevated surface has lightened. Use border/core/on-surface instead for elements on a plain surface. */
+  --str-video__text-on-accent: var(
+    --str-video__chrome-1000
+  ); /** Text on accent-colored surfaces. Stays white in both light and dark mode since the accent background doesn't invert. */
+  --str-video__text-link: var(
+    --str-video__brand-600
+  ); /** Hyperlinks and inline actions. Uses the brand color to signal interactivity within text content. */
+  --str-video__accent-primary: var(
+    --str-video__brand-400
+  ); /** The main brand color. Used for interactive elements, buttons, links, and primary actions. Override this to apply your brand color across the SDK. */
+}
+
+.str-video {
+  --str-video__box-shadow-1: var(--str-video__light-elevation-1);
+  --str-video__box-shadow-2: var(--str-video__light-elevation-2);
+  --str-video__box-shadow-3: var(--str-video__light-elevation-3);
+  --str-video__box-shadow-4: var(--str-video__light-elevation-4);
+}
+
+.str-video__theme-dark {
+  --str-video__box-shadow-1: var(--str-video__dark-elevation-1);
+  --str-video__box-shadow-2: var(--str-video__dark-elevation-2);
+  --str-video__box-shadow-3: var(--str-video__dark-elevation-3);
+  --str-video__box-shadow-4: var(--str-video__dark-elevation-4);
+}
+
+.str-video {
+  --str-video__icon--chevron-down: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M16.25 7.5L10 13.75L3.75 7.5%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--chevron-right: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M7.5 3.75L13.75 10L7.5 16.25%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--chevron-up: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M3.75 12.5L10 6.25L16.25 12.5%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--download: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M10 11.25V2.5M6.875 8.125L10 11.25L13.125 8.125M16.875 11.25V16.25H3.125V11.25%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--loading: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M17.5 10C17.5 14.1422 14.1422 17.5 10 17.5C5.85787 17.5 2.5 14.1422 2.5 10C2.5 5.85787 5.85787 2.5 10 2.5C14.1422 2.5 17.5 5.85787 17.5 10Z%22 stroke=%22black%22 stroke-opacity=%220.3%22 stroke-width=%221.5%22/%3E %3Cpath d=%22M17.4542 10.8333C17.0698 14.3096 14.3096 17.0698 10.8333 17.4542%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--refresh: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M16.875 3.75002V7.50002H13.125M16.875 7.50002L14.6656 5.29065C13.3861 4.01119 11.6538 3.28775 9.84437 3.27722C8.03494 3.26669 6.29431 3.96992 5 5.2344M3.125 16.25V12.5H6.875M3.125 12.5L5.33437 14.7094C6.61388 15.9889 8.34621 16.7123 10.1556 16.7228C11.9651 16.7334 13.7057 16.0301 15 14.7656%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--settings: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M9.99995 13.125C11.7258 13.125 13.125 11.7258 13.125 9.99995C13.125 8.27406 11.7258 6.87495 9.99995 6.87495C8.27406 6.87495 6.87495 8.27406 6.87495 9.99995C6.87495 11.7258 8.27406 13.125 9.99995 13.125Z%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3Cpath d=%22M3.23667 13.9132C2.89134 13.3184 2.62677 12.6803 2.44995 12.0156L3.76089 10.375C3.74605 10.1241 3.74605 9.87265 3.76089 9.62183L2.45073 7.9812C2.62725 7.31642 2.89127 6.67802 3.23589 6.08276L5.32261 5.84839C5.48924 5.66065 5.6669 5.48299 5.85464 5.31636L6.08901 3.23042C6.68342 2.88745 7.32077 2.62499 7.98433 2.44995L9.62495 3.76089C9.87577 3.74605 10.1273 3.74605 10.3781 3.76089L12.0187 2.45073C12.6835 2.62725 13.3219 2.89127 13.9171 3.23589L14.1515 5.32261C14.3393 5.48924 14.5169 5.6669 14.6835 5.85464L16.7695 6.08901C17.1148 6.68383 17.3794 7.32199 17.5562 7.98667L16.2453 9.6273C16.2601 9.87812 16.2601 10.1296 16.2453 10.3804L17.5554 12.021C17.3801 12.6856 17.1174 13.324 16.7742 13.9195L14.6875 14.1539C14.5208 14.3416 14.3432 14.5193 14.1554 14.6859L13.921 16.7718C13.3262 17.1172 12.6881 17.3817 12.0234 17.5585L10.3828 16.2476C10.1319 16.2625 9.88046 16.2625 9.62964 16.2476L7.98901 17.5578C7.32443 17.3825 6.68604 17.1198 6.09058 16.7765L5.8562 14.6898C5.66846 14.5232 5.4908 14.3455 5.32417 14.1578L3.23667 13.9132Z%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--settings-fill: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2Ljg3NSAxMC4xNjg4QzE2Ljg3ODIgMTAuMDU2MyAxNi44NzgyIDkuOTQzNzkgMTYuODc1IDkuODMxMjlMMTguMDQwNyA4LjM3NTA0QzE4LjEwMTggOC4yOTg1OCAxOC4xNDQxIDguMjA4ODMgMTguMTY0MiA4LjExMzAzQzE4LjE4NDIgOC4wMTcyMiAxOC4xODE2IDcuOTE4MDQgMTguMTU2MyA3LjgyMzQ3QzE3Ljk2NDkgNy4xMDUzMSAxNy42NzkgNi40MTU3IDE3LjMwNjMgNS43NzI2OUMxNy4yNTc0IDUuNjg4NTcgMTcuMTg5NiA1LjYxNyAxNy4xMDgyIDUuNTYzN0MxNy4wMjY5IDUuNTEwNCAxNi45MzQyIDUuNDc2ODMgMTYuODM3NSA1LjQ2NTY2TDE0Ljk4NDQgNS4yNTk0MUMxNC45MDczIDUuMTc4MTYgMTQuODI5MiA1LjEwMDA0IDE0Ljc1IDUuMDI1MDRMMTQuNTMxMyAzLjE2NzIyQzE0LjUyIDMuMDcwNTEgMTQuNDg2MyAyLjk3Nzc3IDE0LjQzMjkgMi44OTYzOUMxNC4zNzk1IDIuODE1IDE0LjMwNzcgMi43NDcyMyAxNC4yMjM1IDIuNjk4NDdDMTMuNTgwNSAyLjMyNjAxIDEyLjg5MDkgMi4wNDA3IDEyLjE3MjcgMS44NTAwNEMxMi4wNzgxIDEuODI0NzcgMTEuOTc4OSAxLjgyMjA3IDExLjg4MzEgMS44NDIxNUMxMS43ODczIDEuODYyMjQgMTEuNjk3NiAxLjkwNDU0IDExLjYyMTEgMS45NjU2NkwxMC4xNjg4IDMuMTI1MDRDMTAuMDU2MyAzLjEyNTA0IDkuOTQzNzkgMy4xMjUwNCA5LjgzMTI5IDMuMTI1MDRMOC4zNzUwNCAxLjk2MTc1QzguMjk4NTggMS45MDA2NCA4LjIwODgzIDEuODU4MzMgOC4xMTMwMyAxLjgzODI1QzguMDE3MjIgMS44MTgxNiA3LjkxODA0IDEuODIwODYgNy44MjM0NyAxLjg0NjEzQzcuMTA1MzEgMi4wMzc1NiA2LjQxNTcgMi4zMjMzOCA1Ljc3MjY5IDIuNjk2MTNDNS42ODg1NyAyLjc0NDk4IDUuNjE3IDIuODEyNzkgNS41NjM3IDIuODk0MTdDNS41MTA0IDIuOTc1NTUgNS40NzY4MyAzLjA2ODI0IDUuNDY1NjYgMy4xNjQ4OEw1LjI1OTQxIDUuMDIxMTNDNS4xNzgxNiA1LjA5ODczIDUuMTAwMDQgNS4xNzY4NiA1LjAyNTA0IDUuMjU1NUwzLjE2NzIyIDUuNDY4NzlDMy4wNzA1MSA1LjQ4MDA0IDIuOTc3NzcgNS41MTM3MyAyLjg5NjM5IDUuNTY3MTdDMi44MTUgNS42MjA2MSAyLjc0NzIzIDUuNjkyMzMgMi42OTg0NyA1Ljc3NjZDMi4zMjYwOSA2LjQxOTcgMi4wNDA1MyA3LjEwOTI5IDEuODQ5MjUgNy44MjczOEMxLjgyNDEgNy45MjIwMSAxLjgyMTUyIDguMDIxMjIgMS44NDE3NCA4LjExNzAzQzEuODYxOTYgOC4yMTI4NCAxLjkwNDQxIDguMzAyNTUgMS45NjU2NiA4LjM3ODk0TDMuMTI1MDQgOS44MzEyOUMzLjEyNTA0IDkuOTQzNzkgMy4xMjUwNCAxMC4wNTYzIDMuMTI1MDQgMTAuMTY4OEwxLjk2MTc1IDExLjYyNUMxLjkwMDY0IDExLjcwMTUgMS44NTgzMyAxMS43OTEyIDEuODM4MjUgMTEuODg3QzEuODE4MTYgMTEuOTgyOCAxLjgyMDg2IDEyLjA4MiAxLjg0NjEzIDEyLjE3NjZDMi4wMzc1NiAxMi44OTQ4IDIuMzIzMzggMTMuNTg0NCAyLjY5NjEzIDE0LjIyNzRDMi43NDQ5OCAxNC4zMTE1IDIuODEyNzkgMTQuMzgzMSAyLjg5NDE3IDE0LjQzNjRDMi45NzU1NSAxNC40ODk3IDMuMDY4MjQgMTQuNTIzMiAzLjE2NDg4IDE0LjUzNDRMNS4wMTggMTQuNzQwN0M1LjA5NTYxIDE0LjgyMTkgNS4xNzM3MyAxNC45IDUuMjUyMzggMTQuOTc1TDUuNDY4NzkgMTYuODMyOEM1LjQ4MDA0IDE2LjkyOTYgNS41MTM3MyAxNy4wMjIzIDUuNTY3MTcgMTcuMTAzN0M1LjYyMDYxIDE3LjE4NTEgNS42OTIzMyAxNy4yNTI4IDUuNzc2NiAxNy4zMDE2QzYuNDE5NyAxNy42NzQgNy4xMDkyOSAxNy45NTk1IDcuODI3MzggMTguMTUwOEM3LjkyMjAxIDE4LjE3NiA4LjAyMTIyIDE4LjE3ODUgOC4xMTcwMyAxOC4xNTgzQzguMjEyODQgMTguMTM4MSA4LjMwMjU1IDE4LjA5NTcgOC4zNzg5NCAxOC4wMzQ0TDkuODMxMjkgMTYuODc1QzkuOTQzNzkgMTYuODc4MiAxMC4wNTYzIDE2Ljg3ODIgMTAuMTY4OCAxNi44NzVMMTEuNjI1IDE4LjA0MDdDMTEuNzAxNSAxOC4xMDE4IDExLjc5MTIgMTguMTQ0MSAxMS44ODcgMTguMTY0MkMxMS45ODI4IDE4LjE4NDIgMTIuMDgyIDE4LjE4MTYgMTIuMTc2NiAxOC4xNTYzQzEyLjg5NDkgMTcuOTY1MiAxMy41ODQ1IDE3LjY3OTQgMTQuMjI3NCAxNy4zMDYzQzE0LjMxMTUgMTcuMjU3NCAxNC4zODMxIDE3LjE4OTYgMTQuNDM2NCAxNy4xMDgyQzE0LjQ4OTcgMTcuMDI2OSAxNC41MjMyIDE2LjkzNDIgMTQuNTM0NCAxNi44Mzc1TDE0Ljc0MDcgMTQuOTg0NEMxNC44MjE5IDE0LjkwNzMgMTQuOSAxNC44MjkyIDE0Ljk3NSAxNC43NUwxNi44MzI4IDE0LjUzMTNDMTYuOTI5NiAxNC41MiAxNy4wMjIzIDE0LjQ4NjMgMTcuMTAzNyAxNC40MzI5QzE3LjE4NTEgMTQuMzc5NSAxNy4yNTI4IDE0LjMwNzcgMTcuMzAxNiAxNC4yMjM1QzE3LjY3NCAxMy41ODA0IDE3Ljk1OTUgMTIuODkwOCAxOC4xNTA4IDEyLjE3MjdDMTguMTc2IDEyLjA3ODEgMTguMTc4NSAxMS45Nzg4IDE4LjE1ODMgMTEuODgzQzE4LjEzODEgMTEuNzg3MiAxOC4wOTU3IDExLjY5NzUgMTguMDM0NCAxMS42MjExTDE2Ljg3NSAxMC4xNjg4Wk0xMCAxMy4xMjVDOS4zODE5NyAxMy4xMjUgOC43Nzc3OCAxMi45NDE4IDguMjYzODggMTIuNTk4NEM3Ljc0OTk4IDEyLjI1NSA3LjM0OTQ0IDExLjc2NjkgNy4xMTI5MSAxMS4xOTU5QzYuODc2MzkgMTAuNjI0OSA2LjgxNDUgOS45OTY1NyA2LjkzNTA4IDkuMzkwMzhDNy4wNTU2NiA4Ljc4NDE5IDcuMzUzMjkgOC4yMjczNyA3Ljc5MDMzIDcuNzkwMzNDOC4yMjczNyA3LjM1MzI5IDguNzg0MTkgNy4wNTU2NiA5LjM5MDM4IDYuOTM1MDhDOS45OTY1NyA2LjgxNDUgMTAuNjI0OSA2Ljg3NjM5IDExLjE5NTkgNy4xMTI5MUMxMS43NjY5IDcuMzQ5NDQgMTIuMjU1IDcuNzQ5OTggMTIuNTk4NCA4LjI2Mzg4QzEyLjk0MTggOC43Nzc3OCAxMy4xMjUgOS4zODE5NyAxMy4xMjUgMTBDMTMuMTI1IDEwLjgyODggMTIuNzk1OCAxMS42MjM3IDEyLjIwOTcgMTIuMjA5N0MxMS42MjM3IDEyLjc5NTggMTAuODI4OCAxMy4xMjUgMTAgMTMuMTI1WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==');
+  --str-video__icon--caret: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M15.7994 11.6999L10.3831 6.28361C10.3328 6.23325 10.273 6.1933 10.2073 6.16604C10.1415 6.13879 10.0711 6.12476 9.99987 6.12476C9.92869 6.12476 9.85821 6.13879 9.79246 6.16604C9.72671 6.1933 9.66697 6.23325 9.61667 6.28361L4.20036 11.6999C4.12452 11.7757 4.07287 11.8722 4.05193 11.9773C4.031 12.0825 4.04173 12.1914 4.08276 12.2905C4.12379 12.3895 4.19328 12.4741 4.28242 12.5336C4.37157 12.5931 4.47638 12.6248 4.58356 12.6248H15.4162C15.5234 12.6248 15.6282 12.5931 15.7173 12.5336C15.8065 12.4741 15.876 12.3895 15.917 12.2905C15.958 12.1914 15.9687 12.0825 15.9478 11.9773C15.9269 11.8722 15.8752 11.7757 15.7994 11.6999Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--call-accept: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE4LjExNTYgMTMuNjc4MUMxNy45NzYzIDE0LjczNjcgMTcuNDU2NCAxNS43MDg0IDE2LjY1MzEgMTYuNDExN0MxNS44NDk3IDE3LjExNTEgMTQuODE3NyAxNy41MDE5IDEzLjc1IDE3LjVDNy41NDY4OCAxNy41IDIuNTAwMDEgMTIuNDUzMSAyLjUwMDAxIDYuMjQ5OTZDMi40OTgwOSA1LjE4MjIyIDIuODg0OTIgNC4xNTAyOSAzLjU4ODI0IDMuMzQ2OTFDNC4yOTE1NSAyLjU0MzUzIDUuMjYzMjYgMi4wMjM2NCA2LjMyMTg4IDEuODg0MzRDNi41ODk1OCAxLjg1MTY1IDYuODYwNjcgMS45MDY0MiA3LjA5NDY4IDIuMDQwNDZDNy4zMjg3IDIuMTc0NTEgNy41MTMwOSAyLjM4MDY0IDcuNjIwMzIgMi42MjgwOUw5LjI3MDMyIDYuMzExNjhWNi4zMjEwNkM5LjM1MjQyIDYuNTEwNDcgOS4zODYzMyA2LjcxNzI4IDkuMzY5MDEgNi45MjI5OUM5LjM1MTcgNy4xMjg3MSA5LjI4MzcgNy4zMjY5MyA5LjE3MTEgNy40OTk5NkM5LjE1NzA0IDcuNTIxMDYgOS4xNDIxOSA3LjU0MDU5IDkuMTI2NTcgNy41NjAxMkw3LjUwMDAxIDkuNDg4MjVDOC4wODUxNiAxMC42NzczIDkuMzI4OTEgMTEuOTEwMSAxMC41MzM2IDEyLjQ5NjhMMTIuNDM1MiAxMC44Nzg5QzEyLjQ1MzggMTAuODYzMiAxMi40NzM0IDEwLjg0ODYgMTIuNDkzOCAxMC44MzUxQzEyLjY2NjYgMTAuNzE5OCAxMi44NjU1IDEwLjY0OTQgMTMuMDcyNSAxMC42MzAzQzEzLjI3OTQgMTAuNjExMiAxMy40ODc4IDEwLjY0NCAxMy42Nzg5IDEwLjcyNTdMMTMuNjg5MSAxMC43MzA0TDE3LjM2OTUgMTIuMzc5N0MxNy42MTc0IDEyLjQ4NjUgMTcuODI0MSAxMi42NzA3IDE3Ljk1ODUgMTIuOTA0OEMxOC4wOTMgMTMuMTM4OCAxOC4xNDgxIDEzLjQxMDEgMTguMTE1NiAxMy42NzgxWiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==');
+  --str-video__icon--call-end: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE4LjQ1OTMgMTQuMzkyQzE4LjI5NDEgMTQuNjAzMiAxOC4wNjUzIDE0Ljc1NTcgMTcuODA2NyAxNC44MjY5QzE3LjU0ODEgMTQuODk4IDE3LjI3MzUgMTQuODg0MiAxNy4wMjM0IDE0Ljc4NzNMMTMuMTk1MyAxMy40Mjg3TDEzLjE3MjYgMTMuNDIwMUMxMi45ODEyIDEzLjM0MzUgMTIuODExNyAxMy4yMjA4IDEyLjY3OTIgMTMuMDYyOEMxMi41NDY3IDEyLjkwNDggMTIuNDU1MyAxMi43MTY1IDEyLjQxMzMgMTIuNTE0NkwxMS45MjgxIDEwLjE5MDRDMTAuNjY5NCA5Ljc2MTU1IDkuMzAzNjQgOS43NjQ1NyA4LjA0Njg1IDEwLjE5OUw3LjU4NTkxIDEyLjUwNTNDNy41NDUyNiAxMi43MDk0IDcuNDU0MyAxMi45MDAxIDcuMzIxMjggMTMuMDYwMUM3LjE4ODI3IDEzLjIyMDEgNy4wMTc0IDEzLjM0NDQgNi44MjQxOSAxMy40MjE3TDYuODAxNTQgMTMuNDMwM0wyLjk3MzQxIDE0Ljc4NzNDMi44MzEzMSAxNC44NDMzIDIuNjgwMDUgMTQuODcyNCAyLjUyNzMyIDE0Ljg3MzJDMi4zMzcyIDE0Ljg3MzYgMi4xNDk1IDE0LjgzMDYgMS45Nzg1MiAxNC43NDc0QzEuODA3NTMgMTQuNjY0MyAxLjY1Nzc2IDE0LjU0MzMgMS41NDA2IDE0LjM5MzZDMC4xOTQ1MDUgMTIuNjU3NiAwLjM0NTI4NiAxMC4zNTM3IDEuOTA3IDguNzkxMjFDNi4yOTM3MiA0LjQwMjkzIDEzLjcwMzkgNC40MDI5MyAxOC4wOTI5IDguNzkxMjFDMTkuNjU0NyAxMC4zNTIxIDE5LjgwNTQgMTIuNjU2MSAxOC40NTkzIDE0LjM5MloiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--camera: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE0MDY0XzQ2NzI4MSkiPgo8cGF0aCBkPSJNMTUgNS42MjVWMTQuMzc1QzE1IDE0LjcwNjUgMTQuODY4MyAxNS4wMjQ1IDE0LjYzMzkgMTUuMjU4OUMxNC4zOTk1IDE1LjQ5MzMgMTQuMDgxNSAxNS42MjUgMTMuNzUgMTUuNjI1SDIuNUMyLjE2ODQ4IDE1LjYyNSAxLjg1MDU0IDE1LjQ5MzMgMS42MTYxMiAxNS4yNTg5QzEuMzgxNyAxNS4wMjQ1IDEuMjUgMTQuNzA2NSAxLjI1IDE0LjM3NVY1LjYyNUMxLjI1IDUuMjkzNDggMS4zODE3IDQuOTc1NTQgMS42MTYxMiA0Ljc0MTEyQzEuODUwNTQgNC41MDY3IDIuMTY4NDggNC4zNzUgMi41IDQuMzc1SDEzLjc1QzE0LjA4MTUgNC4zNzUgMTQuMzk5NSA0LjUwNjcgMTQuNjMzOSA0Ljc0MTEyQzE0Ljg2ODMgNC45NzU1NCAxNSA1LjI5MzQ4IDE1IDUuNjI1Wk0xOS41MzEyIDUuNjQ0NTNDMTkuNDQzMSA1LjYyMjk1IDE5LjM1MTMgNS42MjAyOSAxOS4yNjIxIDUuNjM2NzJDMTkuMTcyOCA1LjY1MzE1IDE5LjA4OCA1LjY4ODI5IDE5LjAxMzMgNS43Mzk4NEwxNi4zODkxIDcuNDg5MDZDMTYuMzQ2MyA3LjUxNzYyIDE2LjMxMTIgNy41NTYzMSAxNi4yODY5IDcuNjAxN0MxNi4yNjI2IDcuNjQ3MDggMTYuMjUgNy42OTc3NiAxNi4yNSA3Ljc0OTIyVjEyLjI1MDhDMTYuMjUgMTIuMzAyMiAxNi4yNjI2IDEyLjM1MjkgMTYuMjg2OSAxMi4zOTgzQzE2LjMxMTIgMTIuNDQzNyAxNi4zNDYzIDEyLjQ4MjQgMTYuMzg5MSAxMi41MTA5TDE5LjAyODEgMTQuMjcwM0MxOS4xMjY5IDE0LjMzNjIgMTkuMjQyNCAxNC4zNzI2IDE5LjM2MTEgMTQuMzc1MkMxOS40Nzk4IDE0LjM3NzkgMTkuNTk2OCAxNC4zNDY2IDE5LjY5ODQgMTQuMjg1MkMxOS43OTI0IDE0LjIyNTQgMTkuODY5NSAxNC4xNDI1IDE5LjkyMjMgMTQuMDQ0NEMxOS45NzUxIDEzLjk0NjQgMjAuMDAxOSAxMy44MzY0IDIwIDEzLjcyNVY2LjI1QzIwLjAwMDEgNi4xMTEzOSAxOS45NTQxIDUuOTc2NjggMTkuODY5MiA1Ljg2NzA4QzE5Ljc4NDMgNS43NTc0NyAxOS42NjU1IDUuNjc5MTggMTkuNTMxMiA1LjY0NDUzWiIgZmlsbD0iYmxhY2siLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8xNDA2NF80NjcyODEiPgo8cmVjdCB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9IndoaXRlIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg==');
+  --str-video__icon--camera-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzI0MTgzXzExOTApIj4KPHBhdGggZD0iTTIwIDYuMjY4MDJWMTMuNzI1MUMyMC4wMDE5IDEzLjgzNjQgMTkuOTc1MSAxMy45NDY0IDE5LjkyMjMgMTQuMDQ0NUMxOS44Njk1IDE0LjE0MjYgMTkuNzkyNCAxNC4yMjU1IDE5LjY5ODQgMTQuMjg1MkMxOS41OTY4IDE0LjM0NjcgMTkuNDc5OCAxNC4zNzc5IDE5LjM2MTEgMTQuMzc1M0MxOS4yNDI0IDE0LjM3MjYgMTkuMTI2OSAxNC4zMzYzIDE5LjAyODEgMTQuMjcwNEwxNi4zODkxIDEyLjUxMUMxNi4zNDYzIDEyLjQ4MjQgMTYuMzExMiAxMi40NDM3IDE2LjI4NjkgMTIuMzk4NEMxNi4yNjI2IDEyLjM1MyAxNi4yNSAxMi4zMDIzIDE2LjI1IDEyLjI1MDhWNy43NDkyN0MxNi4yNTAxIDcuNjk3OTQgMTYuMjYyOCA3LjY0NzQzIDE2LjI4NzEgNy42MDIxOUMxNi4zMTEzIDcuNTU2OTUgMTYuMzQ2NCA3LjUxODM4IDE2LjM4OTEgNy40ODk5TDE5LjAyODEgNS43Mjk3NEMxOS4xNDI4IDUuNjUzMzQgMTkuMjc5NSA1LjYxNjk3IDE5LjQxNyA1LjYyNjNDMTkuNTU0NCA1LjYzNTYyIDE5LjY4NSA1LjY5MDEyIDE5Ljc4ODMgNS43ODEzQzE5Ljg1NjIgNS44NDI2OSAxOS45MTAyIDUuOTE3ODYgMTkuOTQ2NyA2LjAwMThDMTkuOTgzMiA2LjA4NTczIDIwLjAwMTQgNi4xNzY1IDIwIDYuMjY4MDJaTTQuMjEyNSAyLjcwNDc0QzQuMTU3NjEgMi42NDI4NyA0LjA5MDk5IDIuNTkyNTEgNC4wMTY1IDIuNTU2NThDMy45NDIwMSAyLjUyMDY0IDMuODYxMTIgMi40OTk4NSAzLjc3ODU0IDIuNDk1NDFDMy42OTU5NSAyLjQ5MDk3IDMuNjEzMyAyLjUwMjk2IDMuNTM1MzggMi41MzA2OUMzLjQ1NzQ2IDIuNTU4NDMgMy4zODU4MiAyLjYwMTM1IDMuMzI0NjIgMi42NTY5N0MzLjI2MzQxIDIuNzEyNiAzLjIxMzg1IDIuNzc5ODIgMy4xNzg4MSAyLjg1NDc0QzMuMTQzNzggMi45Mjk2NSAzLjEyMzk2IDMuMDEwNzggMy4xMjA1IDMuMDkzNDJDMy4xMTcwNSAzLjE3NjA1IDMuMTMwMDQgMy4yNTg1NSAzLjE1ODcgMy4zMzYxM0MzLjE4NzM3IDMuNDEzNzEgMy4yMzExNSAzLjQ4NDgzIDMuMjg3NSAzLjU0NTM2TDQuMDQxNDEgNC4zNzUwNUgyLjVDMi4xNjg0OCA0LjM3NTA1IDEuODUwNTQgNC41MDY3NSAxLjYxNjEyIDQuNzQxMTdDMS4zODE3IDQuOTc1NTkgMS4yNSA1LjI5MzUzIDEuMjUgNS42MjUwNVYxNC4zNzUxQzEuMjUgMTQuNzA2NiAxLjM4MTcgMTUuMDI0NSAxLjYxNjEyIDE1LjI1ODlDMS44NTA1NCAxNS40OTM0IDIuMTY4NDggMTUuNjI1MSAyLjUgMTUuNjI1MUgxNC4yNjg4TDE1Ljc4NzUgMTcuMjk1NEMxNS44NDI0IDE3LjM1NzIgMTUuOTA5IDE3LjQwNzYgMTUuOTgzNSAxNy40NDM1QzE2LjA1OCAxNy40Nzk1IDE2LjEzODkgMTcuNTAwMyAxNi4yMjE1IDE3LjUwNDdDMTYuMzA0MSAxNy41MDkxIDE2LjM4NjcgMTcuNDk3MSAxNi40NjQ2IDE3LjQ2OTRDMTYuNTQyNSAxNy40NDE3IDE2LjYxNDIgMTcuMzk4OCAxNi42NzU0IDE3LjM0MzFDMTYuNzM2NiAxNy4yODc1IDE2Ljc4NjEgMTcuMjIwMyAxNi44MjEyIDE3LjE0NTRDMTYuODU2MiAxNy4wNzA1IDE2Ljg3NiAxNi45ODkzIDE2Ljg3OTUgMTYuOTA2N0MxNi44ODI5IDE2LjgyNDEgMTYuODcgMTYuNzQxNiAxNi44NDEzIDE2LjY2NEMxNi44MTI2IDE2LjU4NjQgMTYuNzY4OSAxNi41MTUzIDE2LjcxMjUgMTYuNDU0N0w0LjIxMjUgMi43MDQ3NFpNMTQuNDUzMSAxMi4xMTQ5QzE0LjQ5NTMgMTIuMTYyOCAxNC41NTEyIDEyLjE5NjYgMTQuNjEzMiAxMi4yMTE4QzE0LjY3NTIgMTIuMjI2OSAxNC43NDA0IDEyLjIyMjggMTQuOCAxMi4xOTk4QzE0Ljg1OTYgMTIuMTc2OCAxNC45MTA3IDEyLjEzNjEgMTQuOTQ2NCAxMi4wODMzQzE0Ljk4MjIgMTIuMDMwNCAxNS4wMDA5IDExLjk2NzggMTUgMTEuOTA0VjUuNjI1MDVDMTUgNS4yOTM1MyAxNC44NjgzIDQuOTc1NTkgMTQuNjMzOSA0Ljc0MTE3QzE0LjM5OTUgNC41MDY3NSAxNC4wODE1IDQuMzc1MDUgMTMuNzUgNC4zNzUwNUg4LjEyNUM4LjA2NDIgNC4zNzQ0NSA4LjAwNDU1IDQuMzkxNTkgNy45NTMzNSA0LjQyNDM4QzcuOTAyMTUgNC40NTcxOCA3Ljg2MTYzIDQuNTA0MTkgNy44MzY3NSA0LjU1OTY3QzcuODExODcgNC42MTUxNSA3LjgwMzcyIDQuNjc2NjggNy44MTMyOSA0LjczNjcyQzcuODIyODYgNC43OTY3NyA3Ljg0OTczIDQuODUyNzEgNy44OTA2MiA0Ljg5NzcxTDE0LjQ1MzEgMTIuMTE0OVoiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMjQxODNfMTE5MCI+CjxyZWN0IHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K');
+  --str-video__icon--camera-off-outline: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cg clip-path=%22url(%23clip0_24183_1190)%22%3E %3Cpath d=%22M20 6.26802V13.7251C20.0019 13.8364 19.9751 13.9464 19.9223 14.0445C19.8695 14.1426 19.7924 14.2255 19.6984 14.2852C19.5968 14.3467 19.4798 14.3779 19.3611 14.3753C19.2424 14.3726 19.1269 14.3363 19.0281 14.2704L16.3891 12.511C16.3463 12.4824 16.3112 12.4437 16.2869 12.3984C16.2626 12.353 16.25 12.3023 16.25 12.2508V7.74927C16.2501 7.69794 16.2628 7.64743 16.2871 7.60219C16.3113 7.55695 16.3464 7.51838 16.3891 7.4899L19.0281 5.72974C19.1428 5.65334 19.2795 5.61697 19.417 5.6263C19.5544 5.63562 19.685 5.69012 19.7883 5.7813C19.8562 5.84269 19.9102 5.91786 19.9467 6.0018C19.9832 6.08573 20.0014 6.1765 20 6.26802ZM4.2125 2.70474C4.15761 2.64287 4.09099 2.59251 4.0165 2.55658C3.94201 2.52064 3.86112 2.49985 3.77854 2.49541C3.69595 2.49097 3.6133 2.50296 3.53538 2.53069C3.45746 2.55843 3.38582 2.60135 3.32462 2.65697C3.26341 2.7126 3.21385 2.77982 3.17881 2.85474C3.14378 2.92965 3.12396 3.01078 3.1205 3.09342C3.11705 3.17605 3.13004 3.25855 3.1587 3.33613C3.18737 3.41371 3.23115 3.48483 3.2875 3.54536L4.04141 4.37505H2.5C2.16848 4.37505 1.85054 4.50675 1.61612 4.74117C1.3817 4.97559 1.25 5.29353 1.25 5.62505V14.3751C1.25 14.7066 1.3817 15.0245 1.61612 15.2589C1.85054 15.4934 2.16848 15.6251 2.5 15.6251H14.2688L15.7875 17.2954C15.8424 17.3572 15.909 17.4076 15.9835 17.4435C16.058 17.4795 16.1389 17.5003 16.2215 17.5047C16.3041 17.5091 16.3867 17.4971 16.4646 17.4694C16.5425 17.4417 16.6142 17.3988 16.6754 17.3431C16.7366 17.2875 16.7861 17.2203 16.8212 17.1454C16.8562 17.0705 16.876 16.9893 16.8795 16.9067C16.8829 16.8241 16.87 16.7416 16.8413 16.664C16.8126 16.5864 16.7689 16.5153 16.7125 16.4547L4.2125 2.70474ZM14.4531 12.1149C14.4953 12.1628 14.5512 12.1966 14.6132 12.2118C14.6752 12.2269 14.7404 12.2228 14.8 12.1998C14.8596 12.1768 14.9107 12.1361 14.9464 12.0833C14.9822 12.0304 15.0009 11.9678 15 11.904V5.62505C15 5.29353 14.8683 4.97559 14.6339 4.74117C14.3995 4.50675 14.0815 4.37505 13.75 4.37505H8.125C8.0642 4.37445 8.00455 4.39159 7.95335 4.42438C7.90215 4.45718 7.86163 4.50419 7.83675 4.55967C7.81187 4.61515 7.80372 4.67668 7.81329 4.73672C7.82286 4.79677 7.84973 4.85271 7.89062 4.89771L14.4531 12.1149Z%22 fill=%22black%22/%3E %3C/g%3E %3Cdefs%3E %3CclipPath id=%22clip0_24183_1190%22%3E %3Crect width=%2220%22 height=%2220%22 fill=%22white%22/%3E %3C/clipPath%3E %3C/defs%3E %3C/svg%3E');
+  --str-video__icon--close: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M15.625 4.375L4.375 15.625M15.625 15.625L4.375 4.375%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--x-circle: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M12.5 7.5L7.5 12.5M7.5 7.5L12.5 12.5M17.5 10C17.5 14.1421 14.1421 17.5 10 17.5C5.85786 17.5 2.5 14.1421 2.5 10C2.5 5.85786 5.85786 2.5 10 2.5C14.1421 2.5 17.5 5.85786 17.5 10Z%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--ellipsis: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M10 11.25C10.6904 11.25 11.25 10.6904 11.25 10C11.25 9.30964 10.6904 8.75 10 8.75C9.30964 8.75 8.75 9.30964 8.75 10C8.75 10.6904 9.30964 11.25 10 11.25Z%22 fill=%22black%22/%3E %3Cpath d=%22M4.6875 11.25C5.37786 11.25 5.9375 10.6904 5.9375 10C5.9375 9.30964 5.37786 8.75 4.6875 8.75C3.99714 8.75 3.4375 9.30964 3.4375 10C3.4375 10.6904 3.99714 11.25 4.6875 11.25Z%22 fill=%22black%22/%3E %3Cpath d=%22M15.3125 11.25C16.0029 11.25 16.5625 10.6904 16.5625 10C16.5625 9.30964 16.0029 8.75 15.3125 8.75C14.6221 8.75 14.0625 9.30964 14.0625 10C14.0625 10.6904 14.6221 11.25 15.3125 11.25Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--film-roll: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M14.375 5.625C15.0654 5.625 15.625 6.18464 15.625 6.875V15.625C15.625 16.3154 15.0654 16.875 14.375 16.875H3.125C2.43464 16.875 1.875 16.3154 1.875 15.625V6.875C1.875 6.18464 2.43464 5.625 3.125 5.625H14.375ZM7.54089 8.43872C7.42685 8.43124 7.31269 8.45555 7.2113 8.5083C7.11 8.56107 7.02522 8.64077 6.96594 8.7384C6.90665 8.8361 6.87503 8.94821 6.875 9.0625V13.4375C6.87506 13.5518 6.90663 13.6639 6.96594 13.7616C7.02525 13.8592 7.10999 13.939 7.2113 13.9917C7.3127 14.0444 7.42685 14.0681 7.54089 14.0607C7.65498 14.0532 7.76524 14.0146 7.85889 13.949L10.9839 11.7615C11.066 11.7039 11.1329 11.6271 11.1792 11.5381C11.2255 11.4491 11.2499 11.3503 11.25 11.25C11.25 11.1496 11.2256 11.0504 11.1792 10.9613C11.1328 10.8723 11.066 10.7955 10.9839 10.7379L7.85889 8.55042C7.76524 8.48482 7.65498 8.44622 7.54089 8.43872Z%22 fill=%22black%22/%3E %3Cpath d=%22M16.875 3.125H5C4.83424 3.125 4.67527 3.19085 4.55806 3.30806C4.44085 3.42527 4.375 3.58424 4.375 3.75C4.375 3.91576 4.44085 4.07473 4.55806 4.19194C4.67527 4.30915 4.83424 4.375 5 4.375H16.875V13.75C16.875 13.9158 16.9408 14.0747 17.0581 14.1919C17.1753 14.3092 17.3342 14.375 17.5 14.375C17.6658 14.375 17.8247 14.3092 17.9419 14.1919C18.0592 14.0747 18.125 13.9158 18.125 13.75V4.375C18.125 4.04348 17.9933 3.72554 17.7589 3.49112C17.5245 3.2567 17.2065 3.125 16.875 3.125Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--filter: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M6.24976 9C6.60141 9 6.93831 9.06313 7.24976 9.17869C8.34458 9.58488 9.12476 10.6388 9.12476 11.875C9.12476 13.1112 8.34458 14.1651 7.24976 14.5713C6.93831 14.6869 6.60141 14.75 6.24976 14.75C5.8981 14.75 5.5612 14.6869 5.24976 14.5713C4.15493 14.1651 3.37476 13.1112 3.37476 11.875C3.37476 10.6388 4.15493 9.58488 5.24976 9.17869C5.5612 9.06313 5.8981 9 6.24976 9Z%22 fill=%22black%22/%3E %3Cpath d=%22M13.7498 4C14.1014 4 14.4383 4.06313 14.7498 4.17868C15.8446 4.58488 16.6248 5.63883 16.6248 6.875C16.6248 8.11117 15.8446 9.16511 14.7498 9.57131C14.4383 9.68687 14.1014 9.75 13.7498 9.75C13.3981 9.75 13.0612 9.68687 12.7498 9.57131C11.6549 9.16511 10.8748 8.11117 10.8748 6.875C10.8748 5.63883 11.6549 4.58488 12.7498 4.17868C13.0612 4.06313 13.3981 4 13.7498 4Z%22 fill=%22black%22/%3E %3Cpath d=%22M7.24976 14.5713C6.93831 14.6869 6.60141 14.75 6.24976 14.75C5.8981 14.75 5.5612 14.6869 5.24976 14.5713L5.24976 16.875C5.24976 17.4273 5.69747 17.875 6.24976 17.875C6.80204 17.875 7.24976 17.4273 7.24976 16.875L7.24976 14.5713Z%22 fill=%22black%22/%3E %3Cpath d=%22M6.24976 9C6.60141 9 6.93831 9.06313 7.24976 9.17869L7.24976 3.125C7.24976 2.57272 6.80204 2.125 6.24976 2.125C5.69747 2.125 5.24976 2.57272 5.24976 3.125L5.24976 9.17869C5.5612 9.06313 5.8981 9 6.24976 9Z%22 fill=%22black%22/%3E %3Cpath d=%22M14.7498 9.57131C14.4383 9.68687 14.1014 9.75 13.7498 9.75C13.3981 9.75 13.0612 9.68687 12.7498 9.57131L12.7498 16.875C12.7498 17.4273 13.1975 17.875 13.7498 17.875C14.302 17.875 14.7498 17.4273 14.7498 16.875L14.7498 9.57131Z%22 fill=%22black%22/%3E %3Cpath d=%22M13.7498 4C14.1014 4 14.4383 4.06313 14.7498 4.17868L14.7498 3.125C14.7498 2.57272 14.302 2.125 13.7498 2.125C13.1975 2.125 12.7498 2.57272 12.7498 3.125L12.7498 4.17868C13.0612 4.06313 13.3981 4 13.7498 4Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--exclamation-mark-fill: url('data:image/svg+xml;base64,PHN2ZyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgc3R5bGU9ImRpc3BsYXk6IGJsb2NrOyIgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiB2aWV3Qm94PSIwIDAgMjAgMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGlkPSJJY29uL2V4Y2xhbWF0aW9uLW1hcmstZmlsbCI+CjxnIGlkPSJWZWN0b3IiPgo8cGF0aCBkPSJNMTAgMTYuODc1QzEwLjY5MDQgMTYuODc1IDExLjI1IDE2LjMxNTQgMTEuMjUgMTUuNjI1QzExLjI1IDE0LjkzNDYgMTAuNjkwNCAxNC4zNzUgMTAgMTQuMzc1QzkuMzA5NjQgMTQuMzc1IDguNzUgMTQuOTM0NiA4Ljc1IDE1LjYyNUM4Ljc1IDE2LjMxNTQgOS4zMDk2NCAxNi44NzUgMTAgMTYuODc1WiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZD0iTTkgMTEuODc1VjMuNzVDOSAzLjE5NzcyIDkuNDQ3NzIgMi43NSAxMCAyLjc1QzEwLjU1MjMgMi43NSAxMSAzLjE5NzcyIDExIDMuNzVWMTEuODc1QzExIDEyLjQyNzMgMTAuNTUyMyAxMi44NzUgMTAgMTIuODc1QzkuNDQ3NzIgMTIuODc1IDkgMTIuNDI3MyA5IDExLjg3NVoiIGZpbGw9IndoaXRlIi8+CjwvZz4KPC9nPgo8L3N2Zz4K');
+  --str-video__icon--question-mark-fill: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9Ikljb24vcXVlc3Rpb24tbWFyay1maWxsIj4KPHBhdGggZD0iTTYuNzUgN0EzLjI1IDMuMjUgMCAxIDEgMTAgMTAuMjVWMTEuODc1IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMTAgMTYuODc1QzEwLjY5MDQgMTYuODc1IDExLjI1IDE2LjMxNTQgMTEuMjUgMTUuNjI1QzExLjI1IDE0LjkzNDYgMTAuNjkwNCAxNC4zNzUgMTAgMTQuMzc1QzkuMzA5NjQgMTQuMzc1IDguNzUgMTQuOTM0NiA4Ljc1IDE1LjYyNUM4Ljc1IDE2LjMxNTQgOS4zMDk2NCAxNi44NzUgMTAgMTYuODc1WiIgZmlsbD0id2hpdGUiLz4KPC9nPgo8L3N2Zz4K');
+  --str-video__icon--sliders-fill: url('data:image/svg+xml;base64,PHN2ZyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgc3R5bGU9ImRpc3BsYXk6IGJsb2NrOyIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGlkPSJJY29uL3NsaWRlcnMtZmlsbCI+CjxnIGlkPSJWZWN0b3IiPgo8cGF0aCBkPSJNNC45OTk4OCA3LjE5OTk0QzUuMjgxMiA3LjE5OTk0IDUuNTUwNzIgNy4yNTA0NSA1Ljc5OTg4IDcuMzQyODlDNi42NzU3NCA3LjY2Nzg1IDcuMjk5ODggOC41MTEgNy4yOTk4OCA5LjQ5OTk0QzcuMjk5ODggMTAuNDg4OSA2LjY3NTc0IDExLjMzMiA1Ljc5OTg4IDExLjY1N0M1LjU1MDcyIDExLjc0OTQgNS4yODEyIDExLjc5OTkgNC45OTk4OCAxMS43OTk5QzQuNzE4NTYgMTEuNzk5OSA0LjQ0OTAzIDExLjc0OTQgNC4xOTk4OCAxMS42NTdDMy4zMjQwMiAxMS4zMzIgMi42OTk4OCAxMC40ODg5IDIuNjk5ODggOS40OTk5NEMyLjY5OTg4IDguNTExMDEgMy4zMjQwMiA3LjY2Nzg1IDQuMTk5ODggNy4zNDI4OUM0LjQ0OTAzIDcuMjUwNDUgNC43MTg1NiA3LjE5OTk0IDQuOTk5ODggNy4xOTk5NFoiIGZpbGw9IiMxQTFCMjUiLz4KPHBhdGggZD0iTTEwLjk5OTkgMy4xOTk5NEMxMS4yODEyIDMuMTk5OTQgMTEuNTUwNyAzLjI1MDQ1IDExLjc5OTkgMy4zNDI4OUMxMi42NzU3IDMuNjY3ODUgMTMuMjk5OSA0LjUxMSAxMy4yOTk5IDUuNDk5OTRDMTMuMjk5OSA2LjQ4ODg3IDEyLjY3NTcgNy4zMzIwMyAxMS43OTk5IDcuNjU2OTlDMTEuNTUwNyA3Ljc0OTQzIDExLjI4MTIgNy43OTk5NCAxMC45OTk5IDcuNzk5OTRDMTAuNzE4NiA3Ljc5OTk0IDEwLjQ0OSA3Ljc0OTQzIDEwLjE5OTkgNy42NTY5OUM5LjMyNDAyIDcuMzMyMDMgOC42OTk4OCA2LjQ4ODg3IDguNjk5ODggNS40OTk5NEM4LjY5OTg4IDQuNTExIDkuMzI0MDIgMy42Njc4NSAxMC4xOTk5IDMuMzQyODlDMTAuNDQ5IDMuMjUwNDUgMTAuNzE4NiAzLjE5OTk0IDEwLjk5OTkgMy4xOTk5NFoiIGZpbGw9IiMxQTFCMjUiLz4KPHBhdGggZD0iTTUuNzk5ODggMTEuNjU3QzUuNTUwNzIgMTEuNzQ5NCA1LjI4MTIgMTEuNzk5OSA0Ljk5OTg4IDExLjc5OTlDNC43MTg1NiAxMS43OTk5IDQuNDQ5MDMgMTEuNzQ5NCA0LjE5OTg4IDExLjY1N0w0LjE5OTg4IDEzLjQ5OTlDNC4xOTk4OCAxMy45NDE4IDQuNTU4MDUgMTQuMjk5OSA0Ljk5OTg4IDE0LjI5OTlDNS40NDE3IDE0LjI5OTkgNS43OTk4OCAxMy45NDE4IDUuNzk5ODggMTMuNDk5OUw1Ljc5OTg4IDExLjY1N1oiIGZpbGw9IiMxQTFCMjUiLz4KPHBhdGggZD0iTTQuOTk5ODggNy4xOTk5NEM1LjI4MTIgNy4xOTk5NCA1LjU1MDcyIDcuMjUwNDUgNS43OTk4OCA3LjM0Mjg5TDUuNzk5ODggMi40OTk5NEM1Ljc5OTg4IDIuMDU4MTEgNS40NDE3IDEuNjk5OTQgNC45OTk4OCAxLjY5OTk0QzQuNTU4MDUgMS42OTk5NCA0LjE5OTg4IDIuMDU4MTEgNC4xOTk4OCAyLjQ5OTk0TDQuMTk5ODggNy4zNDI4OUM0LjQ0OTAzIDcuMjUwNDUgNC43MTg1NiA3LjE5OTk0IDQuOTk5ODggNy4xOTk5NFoiIGZpbGw9IiMxQTFCMjUiLz4KPHBhdGggZD0iTTExLjc5OTkgNy42NTY5OUMxMS41NTA3IDcuNzQ5NDMgMTEuMjgxMiA3Ljc5OTk0IDEwLjk5OTkgNy43OTk5NEMxMC43MTg2IDcuNzk5OTQgMTAuNDQ5IDcuNzQ5NDMgMTAuMTk5OSA3LjY1Njk5TDEwLjE5OTkgMTMuNDk5OUMxMC4xOTk5IDEzLjk0MTggMTAuNTU4IDE0LjI5OTkgMTAuOTk5OSAxNC4yOTk5QzExLjQ0MTcgMTQuMjk5OSAxMS43OTk5IDEzLjk0MTggMTEuNzk5OSAxMy40OTk5TDExLjc5OTkgNy42NTY5OVoiIGZpbGw9IiMxQTFCMjUiLz4KPHBhdGggZD0iTTEwLjk5OTkgMy4xOTk5NEMxMS4yODEyIDMuMTk5OTQgMTEuNTUwNyAzLjI1MDQ1IDExLjc5OTkgMy4zNDI4OUwxMS43OTk5IDIuNDk5OTRDMTEuNzk5OSAyLjA1ODExIDExLjQ0MTcgMS42OTk5NCAxMC45OTk5IDEuNjk5OTRDMTAuNTU4IDEuNjk5OTQgMTAuMTk5OSAyLjA1ODExIDEwLjE5OTkgMi40OTk5NEwxMC4xOTk5IDMuMzQyODlDMTAuNDQ5IDMuMjUwNDUgMTAuNzE4NiAzLjE5OTk0IDEwLjk5OTkgMy4xOTk5NFoiIGZpbGw9IiMxQTFCMjUiLz4KPC9nPgo8L2c+Cjwvc3ZnPgo=');
+  --str-video__icon--info-icon: url('data:image/svg+xml;utf8,%3Csvg width=%2216%22 height=%2216%22 viewBox=%220 0 16 16%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M13.25 8C13.25 5.10051 10.8995 2.75 8 2.75C5.10051 2.75 2.75 5.10051 2.75 8C2.75 10.8995 5.10051 13.25 8 13.25C10.8995 13.25 13.25 10.8995 13.25 8ZM14.75 8C14.75 11.7279 11.7279 14.75 8 14.75C4.27208 14.75 1.25 11.7279 1.25 8C1.25 4.27208 4.27208 1.25 8 1.25C11.7279 1.25 14.75 4.27208 14.75 8Z%22 fill=%22black%22/%3E %3Cpath d=%22M8.75 10.2949C9.04093 10.3981 9.25 10.6737 9.25 11C9.25 11.4142 8.91421 11.75 8.5 11.75C8.16848 11.75 7.85063 11.6182 7.61621 11.3838C7.38179 11.1494 7.25 10.8315 7.25 10.5V8.2041C6.95923 8.10086 6.75 7.82617 6.75 7.5C6.75 7.08579 7.08579 6.75 7.5 6.75C7.83152 6.75 8.14937 6.88179 8.38379 7.11621C8.61821 7.35063 8.75 7.66848 8.75 8V10.2949Z%22 fill=%22black%22/%3E %3Cpath d=%22M7.75 6C8.16421 6 8.5 5.66421 8.5 5.25C8.5 4.83579 8.16421 4.5 7.75 4.5C7.33579 4.5 7 4.83579 7 5.25C7 5.66421 7.33579 6 7.75 6Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--exclamation-circle-fill: url('data:image/svg+xml;utf8,%3Csvg width=%2216%22 height=%2216%22 viewBox=%220 0 16 16%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M8 1.5C6.71442 1.5 5.45772 1.88122 4.3888 2.59545C3.31988 3.30968 2.48676 4.32484 1.99479 5.51256C1.50282 6.70028 1.37409 8.00721 1.6249 9.26809C1.8757 10.529 2.49477 11.6872 3.40381 12.5962C4.31285 13.5052 5.47104 14.1243 6.73192 14.3751C7.99279 14.6259 9.29973 14.4972 10.4874 14.0052C11.6752 13.5132 12.6903 12.6801 13.4046 11.6112C14.1188 10.5423 14.5 9.28558 14.5 8C14.4982 6.27665 13.8128 4.62441 12.5942 3.40582C11.3756 2.18722 9.72335 1.50182 8 1.5ZM7.5 5C7.5 4.86739 7.55268 4.74021 7.64645 4.64645C7.74022 4.55268 7.86739 4.5 8 4.5C8.13261 4.5 8.25979 4.55268 8.35356 4.64645C8.44732 4.74021 8.5 4.86739 8.5 5V8.5C8.5 8.63261 8.44732 8.75979 8.35356 8.85355C8.25979 8.94732 8.13261 9 8 9C7.86739 9 7.74022 8.94732 7.64645 8.85355C7.55268 8.75979 7.5 8.63261 7.5 8.5V5ZM8 11.5C7.85167 11.5 7.70666 11.456 7.58333 11.3736C7.45999 11.2912 7.36386 11.1741 7.30709 11.037C7.25033 10.9 7.23548 10.7492 7.26441 10.6037C7.29335 10.4582 7.36478 10.3246 7.46967 10.2197C7.57456 10.1148 7.7082 10.0434 7.85368 10.0144C7.99917 9.98547 8.14997 10.0003 8.28701 10.0571C8.42406 10.1139 8.54119 10.21 8.6236 10.3333C8.70602 10.4567 8.75 10.6017 8.75 10.75C8.75 10.9489 8.67098 11.1397 8.53033 11.2803C8.38968 11.421 8.19892 11.5 8 11.5Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--kick-user: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M15.4789 15.2226C15.5555 15.3137 15.6046 15.4249 15.6202 15.5429C15.6358 15.661 15.6174 15.7811 15.5671 15.889C15.5168 15.997 15.4367 16.0883 15.3362 16.1522C15.2357 16.2162 15.1191 16.2501 15 16.25H1.87497C1.75595 16.2499 1.63941 16.2159 1.53905 16.1519C1.4387 16.0879 1.35871 15.9966 1.30848 15.8887C1.25826 15.7808 1.2399 15.6607 1.25555 15.5428C1.27121 15.4248 1.32023 15.3137 1.39685 15.2226C2.56404 13.8335 4.0156 12.8468 5.62888 12.3187C4.64912 11.7085 3.89476 10.7957 3.47992 9.7186C3.06509 8.64146 3.01236 7.45852 3.3297 6.34874C3.64705 5.23897 4.3172 4.26273 5.23878 3.56775C6.16036 2.87276 7.28322 2.49683 8.43747 2.49683C9.59173 2.49683 10.7146 2.87276 11.6362 3.56775C12.5578 4.26273 13.2279 5.23897 13.5452 6.34874C13.8626 7.45852 13.8099 8.64146 13.395 9.7186C12.9802 10.7957 12.2258 11.7085 11.2461 12.3187C12.8593 12.8468 14.3109 13.8335 15.4789 15.2226ZM19.375 9.99995H15.625C15.4592 9.99995 15.3002 10.0658 15.183 10.183C15.0658 10.3002 15 10.4592 15 10.625C15 10.7907 15.0658 10.9497 15.183 11.0669C15.3002 11.1841 15.4592 11.25 15.625 11.25H19.375C19.5407 11.25 19.6997 11.1841 19.8169 11.0669C19.9341 10.9497 20 10.7907 20 10.625C20 10.4592 19.9341 10.3002 19.8169 10.183C19.6997 10.0658 19.5407 9.99995 19.375 9.99995Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--magnifier-glass: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M13.1695 13.1695L17.5 17.5M15 8.75C15 12.2018 12.2018 15 8.75 15C5.29822 15 2.5 12.2018 2.5 8.75C2.5 5.29822 5.29822 2.5 8.75 2.5C12.2018 2.5 15 5.29822 15 8.75Z%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--mic: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuMjUgMTBWNUM2LjI1IDQuMDA1NDQgNi42NDUwOSAzLjA1MTYxIDcuMzQ4MzUgMi4zNDgzNUM4LjA1MTYxIDEuNjQ1MDkgOS4wMDU0NCAxLjI1IDEwIDEuMjVDMTAuOTk0NiAxLjI1IDExLjk0ODQgMS42NDUwOSAxMi42NTE3IDIuMzQ4MzVDMTMuMzU0OSAzLjA1MTYxIDEzLjc1IDQuMDA1NDQgMTMuNzUgNVYxMEMxMy43NSAxMC45OTQ2IDEzLjM1NDkgMTEuOTQ4NCAxMi42NTE3IDEyLjY1MTdDMTEuOTQ4NCAxMy4zNTQ5IDEwLjk5NDYgMTMuNzUgMTAgMTMuNzVDOS4wMDU0NCAxMy43NSA4LjA1MTYxIDEzLjM1NDkgNy4zNDgzNSAxMi42NTE3QzYuNjQ1MDkgMTEuOTQ4NCA2LjI1IDEwLjk5NDYgNi4yNSAxMFpNMTYuMjUgMTBDMTYuMjUgOS44MzQyNCAxNi4xODQyIDkuNjc1MjcgMTYuMDY2OSA5LjU1ODA2QzE1Ljk0OTcgOS40NDA4NSAxNS43OTA4IDkuMzc1IDE1LjYyNSA5LjM3NUMxNS40NTkyIDkuMzc1IDE1LjMwMDMgOS40NDA4NSAxNS4xODMxIDkuNTU4MDZDMTUuMDY1OCA5LjY3NTI3IDE1IDkuODM0MjQgMTUgMTBDMTUgMTEuMzI2MSAxNC40NzMyIDEyLjU5NzkgMTMuNTM1NSAxMy41MzU1QzEyLjU5NzkgMTQuNDczMiAxMS4zMjYxIDE1IDEwIDE1QzguNjczOTIgMTUgNy40MDIxNSAxNC40NzMyIDYuNDY0NDcgMTMuNTM1NUM1LjUyNjc4IDEyLjU5NzkgNSAxMS4zMjYxIDUgMTBDNSA5LjgzNDI0IDQuOTM0MTUgOS42NzUyNyA0LjgxNjk0IDkuNTU4MDZDNC42OTk3MyA5LjQ0MDg1IDQuNTQwNzYgOS4zNzUgNC4zNzUgOS4zNzVDNC4yMDkyNCA5LjM3NSA0LjA1MDI3IDkuNDQwODUgMy45MzMwNiA5LjU1ODA2QzMuODE1ODUgOS42NzUyNyAzLjc1IDkuODM0MjQgMy43NSAxMEMzLjc1MTkgMTEuNTQ4OSA0LjMyODA2IDEzLjA0MiA1LjM2NzA3IDE0LjE5MDdDNi40MDYwNyAxNS4zMzkzIDcuODM0MSAxNi4wNjIgOS4zNzUgMTYuMjE4OFYxOC43NUM5LjM3NSAxOC45MTU4IDkuNDQwODUgMTkuMDc0NyA5LjU1ODA2IDE5LjE5MTlDOS42NzUyNyAxOS4zMDkyIDkuODM0MjQgMTkuMzc1IDEwIDE5LjM3NUMxMC4xNjU4IDE5LjM3NSAxMC4zMjQ3IDE5LjMwOTIgMTAuNDQxOSAxOS4xOTE5QzEwLjU1OTIgMTkuMDc0NyAxMC42MjUgMTguOTE1OCAxMC42MjUgMTguNzVWMTYuMjE4OEMxMi4xNjU5IDE2LjA2MiAxMy41OTM5IDE1LjMzOTMgMTQuNjMyOSAxNC4xOTA3QzE1LjY3MTkgMTMuMDQyIDE2LjI0ODEgMTEuNTQ4OSAxNi4yNSAxMFoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--mic-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2LjY3MDQgMTcuOTYyNUMxNi41NDc3IDE4LjA3NCAxNi4zODU4IDE4LjEzMjEgMTYuMjIwMyAxOC4xMjQyQzE2LjA1NDcgMTguMTE2MyAxNS44OTkxIDE4LjA0MyAxNS43ODc2IDE3LjkyMDNMMTMuMzcyIDE1LjI2NDFDMTIuNTQ1NiAxNS43OTY3IDExLjYwMzcgMTYuMTIzOCAxMC42MjUxIDE2LjIxOFYxOC43NUMxMC42MjUxIDE4LjkxNTggMTAuNTU5MiAxOS4wNzQ3IDEwLjQ0MiAxOS4xOTE5QzEwLjMyNDggMTkuMzA5MSAxMC4xNjU4IDE5LjM3NSAxMC4wMDAxIDE5LjM3NUM5LjgzNDMzIDE5LjM3NSA5LjY3NTM2IDE5LjMwOTEgOS41NTgxNSAxOS4xOTE5QzkuNDQwOTQgMTkuMDc0NyA5LjM3NTA5IDE4LjkxNTggOS4zNzUwOSAxOC43NVYxNi4yMTg3QzcuODM0MTggMTYuMDYxOSA2LjQwNjE1IDE1LjMzOTMgNS4zNjcxNSAxNC4xOTA3QzQuMzI4MTUgMTMuMDQyIDMuNzUxOTkgMTEuNTQ4OSAzLjc1MDA5IDkuOTk5OTlDMy43NTAwOSA5LjgzNDIzIDMuODE1OTQgOS42NzUyNiAzLjkzMzE1IDkuNTU4MDVDNC4wNTAzNiA5LjQ0MDg0IDQuMjA5MzMgOS4zNzQ5OSA0LjM3NTA5IDkuMzc0OTlDNC41NDA4NSA5LjM3NDk5IDQuNjk5ODIgOS40NDA4NCA0LjgxNzAzIDkuNTU4MDVDNC45MzQyNCA5LjY3NTI2IDUuMDAwMDkgOS44MzQyMyA1LjAwMDA5IDkuOTk5OTlDNS4wMDE1NCAxMS4zMjU2IDUuNTI4NzggMTIuNTk2NiA2LjQ2NjE1IDEzLjUzMzlDNy40MDM1MiAxNC40NzEzIDguNjc0NDUgMTQuOTk4NSAxMC4wMDAxIDE1QzEwLjg4NDQgMTUuMDAyNiAxMS43NTMzIDE0Ljc2ODUgMTIuNTE2NSAxNC4zMjE5TDExLjY0OTMgMTMuMzY4N0MxMS4wNzc1IDEzLjY0ODcgMTAuNDQzOSAxMy43Nzg2IDkuODA4MDUgMTMuNzQ1OUM5LjE3MjIzIDEzLjcxMzMgOC41NTUxOCAxMy41MTk0IDguMDE1MDMgMTMuMTgyNEM3LjQ3NDg5IDEyLjg0NTQgNy4wMjk0NCAxMi4zNzY0IDYuNzIwNjYgMTEuODE5NkM2LjQxMTg4IDExLjI2MjkgNi4yNDk5NCAxMC42MzY3IDYuMjUwMDkgOS45OTk5OVY3LjQyODlMMy4yODc1OSA0LjE3MDMxQzMuMTc4NDUgNC4wNDcyOCAzLjEyMjIgMy44ODYxOSAzLjEzMTAzIDMuNzIxOTdDMy4xMzk4NyAzLjU1Nzc0IDMuMjEzMDcgMy40MDM2MiAzLjMzNDc4IDMuMjkzMDFDMy40NTY1IDMuMTgyNCAzLjYxNjkgMy4xMjQyMiAzLjc4MTIyIDMuMTMxMDlDMy45NDU1NCAzLjEzNzk1IDQuMTAwNTMgMy4yMDkzMSA0LjIxMjU5IDMuMzI5NjhMMTYuNzEyNiAxNy4wNzk3QzE2LjgyNCAxNy4yMDIzIDE2Ljg4MjIgMTcuMzY0MyAxNi44NzQzIDE3LjUyOThDMTYuODY2NCAxNy42OTU0IDE2Ljc5MzEgMTcuODUxIDE2LjY3MDQgMTcuOTYyNVpNMTQuNzgwNiAxMy4wMzA1QzE0Ljg2NTggMTMuMDcyNyAxNC45NTk2IDEzLjA5NDYgMTUuMDU0OCAxMy4wOTQ1QzE1LjE3MTkgMTMuMDk0NSAxNS4yODY2IDEzLjA2MTcgMTUuMzg1OSAxMi45OTk3QzE1LjQ4NTIgMTIuOTM3NiAxNS41NjUxIDEyLjg0OSAxNS42MTY1IDEyLjc0MzdDMTYuMDM1OSAxMS44OTAxIDE2LjI1MjcgMTAuOTUxMSAxNi4yNTAxIDkuOTk5OTlDMTYuMjUwMSA5LjgzNDIzIDE2LjE4NDIgOS42NzUyNiAxNi4wNjcgOS41NTgwNUMxNS45NDk4IDkuNDQwODQgMTUuNzkwOCA5LjM3NDk5IDE1LjYyNTEgOS4zNzQ5OUMxNS40NTkzIDkuMzc0OTkgMTUuMzAwNCA5LjQ0MDg0IDE1LjE4MzEgOS41NTgwNUMxNS4wNjU5IDkuNjc1MjYgMTUuMDAwMSA5LjgzNDIzIDE1LjAwMDEgOS45OTk5OUMxNS4wMDIzIDEwLjc2MDcgMTQuODI5MSAxMS41MTE3IDE0LjQ5MzggMTIuMTk0NUMxNC40MjEgMTIuMzQzNCAxNC40MTAzIDEyLjUxNTEgMTQuNDY0MSAxMi42NzE5QzE0LjUxNzkgMTIuODI4NiAxNC42MzE3IDEyLjk1NzYgMTQuNzgwNiAxMy4wMzA1Wk0xMi42NDU0IDEwLjc0NzdDMTIuNzI2NiAxMC44MzcgMTIuODMyIDEwLjkwMSAxMi45NDg4IDEwLjkzMTdDMTMuMDY1NSAxMC45NjI1IDEzLjE4ODcgMTAuOTU4OCAxMy4zMDM0IDEwLjkyMUMxMy40MTgyIDEwLjg4MzIgMTMuNTE5NSAxMC44MTMxIDEzLjU5NTEgMTAuNzE4OUMxMy42NzA4IDEwLjYyNDggMTMuNzE3NiAxMC41MTA4IDEzLjcyOTggMTAuMzkwNkMxMy43NDMxIDEwLjI2MDggMTMuNzQ5OSAxMC4xMzA1IDEzLjc1MDEgOS45OTk5OVY0Ljk5OTk5QzEzLjc0OTEgNC4xMzg3IDEzLjQ1MTcgMy4zMDM5OSAxMi45MDc4IDIuNjM2MTVDMTIuMzY0IDEuOTY4MyAxMS42MDY4IDEuNTA4MDMgMTAuNzYzNSAxLjMzMjY5QzkuOTIwMjYgMS4xNTczNSA5LjA0MjM1IDEuMjc3NjIgOC4yNzczMyAxLjY3MzNDNy41MTIzIDIuMDY4OTggNi45MDY4IDIuNzE1OTUgNi41NjI1OSAzLjUwNTQ2QzYuNTE0NTMgMy42MTU4MiA2LjQ5OTM2IDMuNzM3NzEgNi41MTg5IDMuODU2NDhDNi41Mzg0NCAzLjk3NTI1IDYuNTkxODYgNC4wODU4NSA2LjY3Mjc0IDQuMTc0OTlMMTIuNjQ1NCAxMC43NDc3WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==');
+  --str-video__icon--low-bandwidth-fill: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuNzI0OTcgMy40MjQ5Nkw1Ljg3NDk3IDMuNDY2NjNMNi4wMjQ5NyAzLjU0OTk2TDYuMDMzMyAzLjU1ODI5TDYuMTQxNjMgMy42NTgyOUw2LjIxNjYzIDMuNzQ5OTZMNi4yMzMzIDMuNzc0OTZMNi4yNTgzIDMuODMzMjlMNi4yODMzIDMuODc0OTZMNi4yOTE2MyAzLjg5OTk2TDYuMzI0OTcgMy45NjY2M0w2LjMzMzMgMy45NzQ5Nkw2LjM2NjYzIDQuMDU4MjlWNC4wNjY2M0w2LjQxNjYzIDQuMTY2NjNWNC4xNzQ5Nkw2LjQ3NDk3IDQuMjk5OTZMNi41MzMzIDQuNDQxNjNWNC40NDk5Nkw2LjU5OTk3IDQuNjA4MjlMMTAuNDU4MyAxNC4xSDEwLjQ2NjZMMTAuNjQxNiAxNC4xNUwxMC43IDE0LjE3NUwxMC44MTY2IDE0LjIxNjZMMTAuODY2NiAxNC4yMzMzTDEwLjk3NSAxNC4yOTE2TDExLjAzMzMgMTQuMzI1TDExLjE0MTYgMTQuMzgzM0wxMS4xOTE2IDE0LjQxNjZMMTEuMjkxNiAxNC40OTE2TDExLjM0MTYgMTQuNTI1TDExLjQzMzMgMTQuNjA4M0wxMS41NTgzIDE0LjczMzNMMTEuNiAxNC43ODMzTDExLjY3NSAxNC44NzVMMTEuNzE2NiAxNC45MjVMMTEuNzgzMyAxNS4wMjVMMTEuODE2NiAxNS4wODMzTDExLjg3NSAxNS4xOTE2TDExLjkgMTUuMjQxNkwxMS45NSAxNS4zNUwxMS45NzUgMTUuNDA4M0wxMi4wMTY2IDE1LjUyNUwxMi4wNjY2IDE1LjdMMTIuMDc1IDE1Ljc1ODNMMTIuMSAxNS44ODMzTDEyLjEwODMgMTUuOTQxNkwxMi4xMTY2IDE2LjA2NjZWMTYuMjVMMTIuMTA4MyAxNi4zMDgzTDEyLjEgMTYuNDMzM0wxMi4wOTE2IDE2LjQ5MTZMMTIuMDY2NiAxNi42MDgzTDEyLjA1ODMgMTYuNjY2NkwxMi4wMjUgMTYuNzkxNkwxMi4wMDgzIDE2Ljg0MTZMMTEuOTU4MyAxNi45NTgzTDExLjkzMzMgMTcuMDI1TDExLjg4MzMgMTcuMTMzM0wxMS44NTgzIDE3LjE4MzNMMTEuNzkxNiAxNy4yODMzTDExLjc1ODMgMTcuMzQxNkwxMS42OTE2IDE3LjQ0MTZMMTEuNjU4MyAxNy40ODMzTDExLjU3NSAxNy41ODMzTDExLjQ0MTYgMTcuNzE2NkwxMS40IDE3Ljc1TDExLjMwODMgMTcuODMzM0wxMS4yNTgzIDE3Ljg2NjZMMTEuMTU4MyAxNy45NDE2TDExLjEwODMgMTcuOTc1TDExIDE4LjAzMzNMMTAuOTUgMTguMDU4M0wxMC43NzUgMTguMTMzM0wxMC42NTgzIDE4LjE3NUwxMC42MDgzIDE4LjE5MTZMMTAuNDgzMyAxOC4yMjVMMTAuNDMzMyAxOC4yNDE2TDEwLjMwODMgMTguMjU4M0wxMC4yNSAxOC4yNjY2TDEwLjEyNSAxOC4yODMzSDkuODc0OTdMOS42OTk5NyAxOC4yNTgzTDkuNTc0OTcgMTguMjQxNkw5LjUxNjYzIDE4LjIyNUw5LjM5OTk3IDE4LjJMOS4zNDE2MyAxOC4xNzVMOS4yMjQ5NyAxOC4xMzMzTDkuMTY2NjMgMTguMTE2Nkw5LjA1ODMgMTguMDU4M0w5LjAwODMgMTguMDMzM0w4Ljg5OTk3IDE3Ljk3NUw4Ljg0MTYzIDE3Ljk0MTZMOC43NDE2MyAxNy44NjY2TDguNjk5OTcgMTcuODMzM0w4LjU5OTk3IDE3Ljc1ODNMOC40MjQ5NyAxNy41ODMzTDguMzQ5OTcgMTcuNDkxNkw4LjMxNjYzIDE3LjQ0MTZMOC4yNDE2MyAxNy4zNDE2TDguMjA4MyAxNy4yOTE2TDguMTQ5OTcgMTcuMTkxNkw4LjExNjYzIDE3LjEzMzNMOC4wNjY2MyAxNy4wMjVMOC4wNDE2MyAxNi45NjY2TDcuOTk5OTcgMTYuODVMNy45NzQ5NyAxNi43OTE2TDcuOTQxNjMgMTYuNjc1TDcuOTMzMyAxNi42MTY2TDcuOTA4MyAxNi40OTE2TDcuODk5OTcgMTYuNDQxNkw3Ljg5MTYzIDE2LjMxNjZMNy44ODMzIDE2LjI1ODNWMTYuMDY2Nkw3Ljg5MTYzIDE1Ljk1TDcuODk5OTcgMTUuODgzM0w3LjkyNDk3IDE1Ljc2NjZMNy45MzMzIDE1LjcwODNMNy45ODMzIDE1LjUzMzNMOC4wMjQ5NyAxNS40MTY2TDguMDQxNjMgMTUuMzVMOC4wOTk5NyAxNS4yNDE2TDguMTE2NjMgMTUuMTkxNkw4LjE4MzMgMTUuMDgzM0w4LjMxNjYzIDE0Ljg4MzNMOC4zMjQ5NyAxNC44NzVMNS4xNzQ5NyA1LjEzMzI5TDUuMTI0OTcgNC45NjY2M0w1LjA3NDk3IDQuODE2NjNMNS4wMzMzIDQuNjgzMjlWNC42NzQ5Nkw0Ljk5OTk3IDQuNTY2NjNMNC45NjY2MyA0LjQ3NDk2VjQuNDU4MjlMNC45NDk5NyA0LjM4MzI5TDQuOTQxNjMgNC4zNjY2M0w0LjkzMzMgNC4zMTY2M0w0LjkxNjYzIDQuMjQ5OTZWNC4yMTY2M0w0LjkwODMgNC4wNjY2M0w0LjkyNDk3IDMuOTgzMjlWMy45NjY2M0w0Ljk3NDk3IDMuODI0OTZMNS4wNDk5NyAzLjY5MTYzTDUuMTU4MyAzLjU4MzI5TDUuMjgzMyAzLjQ5OTk2TDUuNDI0OTcgMy40NDE2M0w1LjU3NDk3IDMuNDE2NjNMNS43MjQ5NyAzLjQyNDk2Wk0xMi4xNDE2IDExLjU1ODNMMTIuMzQxNiAxMS42MzMzTDEyLjQ0MTYgMTEuNjgzM0wxMi41MjUgMTEuNzMzM0wxMi41MzMzIDExLjc0MTZMMTIuNjE2NiAxMS43OTE2TDEyLjYyNSAxMS44TDEyLjcwODMgMTEuODVMMTIuNzI1IDExLjg2NjZMMTIuOCAxMS45MTY2TDEyLjgwODMgMTEuOTI1TDEyLjkwODMgMTEuOTkxNkwxMi45ODMzIDEyLjA1TDEyLjk5MTYgMTIuMDU4M0wxMy4wNjY2IDEyLjExNjZMMTMuMDgzMyAxMi4xMjVMMTMuMjMzMyAxMi4yNTgzTDEzLjI1IDEyLjI2NjZMMTMuMzE2NiAxMi4zMzMzTDEzLjMzMzMgMTIuMzQxNkwxMy40IDEyLjQwODNMMTMuNSAxMi41MjVMMTMuNTY2NiAxMi42NTgzTDEzLjYwODMgMTIuODA4M0wxMy42MTY2IDEyLjk1ODNMMTMuNTkxNiAxMy4xMDgzTDEzLjUzMzMgMTMuMjVMMTMuNDQxNiAxMy4zNzVMMTMuMzMzMyAxMy40ODMzTDEzLjIgMTMuNTU4M0wxMy4wNTgzIDEzLjZMMTIuOSAxMy42MTY2TDEyLjc1IDEzLjZMMTIuNjA4MyAxMy41NDE2TDEyLjQzMzMgMTMuNDI1TDEyLjM3NSAxMy4zNjY2TDEyLjMwODMgMTMuMzA4M0wxMi4yNSAxMy4yNTgzTDEyLjE4MzMgMTMuMkwxMi4xMzMzIDEzLjE2NjZMMTIuMDY2NiAxMy4xMDgzTDExLjk1IDEzLjAyNUwxMS44NjY2IDEyLjk3NUwxMS44MDgzIDEyLjk0MTZMMTEuNzI1IDEyLjg5MTZMMTEuNjU4MyAxMi44NUwxMS41MzMzIDEyLjc2NjZMMTEuNDMzMyAxMi42NUwxMS4zNTgzIDEyLjUxNjZMMTEuMzE2NiAxMi4zNzVMMTEuMyAxMi4yMTY2TDExLjMyNSAxMi4wNjY2TDExLjM3NSAxMS45MjVMMTEuNDU4MyAxMS44TDExLjU2NjYgMTEuNjkxNkwxMS43IDExLjYwODNMMTEuODQxNiAxMS41NTgzTDExLjk5MTYgMTEuNTQxNkwxMi4xNDE2IDExLjU1ODNaTTEwLjc5MTYgNy4zNDE2M0gxMC44MzMzTDExLjMgNy4zOTk5NkgxMS4zMzMzTDExLjggNy40ODMyOUwxMS44MzMzIDcuNDkxNjNMMTIuMjkxNiA3LjU5OTk2TDEyLjMyNSA3LjYwODI5TDEyLjc3NSA3Ljc0MTYzTDEyLjgxNjYgNy43NDk5NkwxMy4yNTgzIDcuOTA4MjlMMTMuMjkxNiA3LjkyNDk2TDEzLjcyNSA4LjA5OTk2TDE0LjIwODMgOC4zNDE2M0wxNC42MTY2IDguNTc0OTZMMTQuNjU4MyA4LjU5MTYzTDE1LjA1IDguODQxNjNMMTUuMDgzMyA4Ljg2NjYzTDE1LjQ1ODMgOS4xNDE2M0wxNS40OTE2IDkuMTU4MjlMMTUuODU4MyA5LjQ1ODI5TDE1Ljk2NjYgOS41NjY2M0wxNi4wNDE2IDkuNjkxNjNMMTYuMSA5LjgzMzI5TDE2LjExNjYgOS45ODMyOUwxNi4xIDEwLjE0MTZMMTYuMDU4MyAxMC4yODMzTDE1Ljk4MzMgMTAuNDE2NkwxNS44NzUgMTAuNTI1TDE1Ljc1IDEwLjYxNjZMMTUuNjA4MyAxMC42NzVMMTUuNDU4MyAxMC43TDE1LjMwODMgMTAuNjkxNkwxNS4xNTgzIDEwLjY1TDE0Ljk3NSAxMC41NDE2TDE0LjYzMzMgMTAuMjY2NkwxNC4yNzUgMTAuMDA4M0wxMy45MTY2IDkuNzgzMjlMMTMuNTUgOS41NzQ5NkwxMy4xNjY2IDkuMzkxNjNMMTIuNzU4MyA5LjIxNjYzTDEyLjM1ODMgOS4wNzQ5NkwxMS45NTgzIDguOTU4MjlMMTEuNTI1IDguODU4MjlMMTEuMTE2NiA4Ljc4MzI5TDEwLjY4MzMgOC43MzMyOUwxMC4yNDE2IDguNzA4MjlMMTAuMDkxNiA4LjY4MzI5TDkuOTQ5OTcgOC42MjQ5Nkw5LjgyNDk3IDguNTMzMjlMOS43MjQ5NyA4LjQyNDk2TDkuNjQxNjMgOC4yOTE2M0w5LjU5OTk3IDguMTQ5OTZMOS41ODMzIDcuOTk5OTZMOS41OTk5NyA3Ljg0MTYzTDkuNjU4MyA3LjY5OTk2TDkuNzMzMyA3LjU3NDk2TDkuODQxNjMgNy40NjY2M0w5Ljk3NDk3IDcuMzgzMjlMMTAuMTE2NiA3LjMzMzI5TDEwLjMyNSA3LjMwODI5TDEwLjc5MTYgNy4zNDE2M1pNMy40ODMzIDUuNTQ5OTZMMy42MjQ5NyA1LjYwODI5TDMuNzQ5OTcgNS42OTk5NkwzLjg0OTk3IDUuODE2NjNMMy45MjQ5NyA1Ljk0OTk2TDMuOTY2NjMgNi4wOTE2M0wzLjk3NDk3IDYuMjQxNjNMMy45NDk5NyA2LjM5MTYzTDMuODk5OTcgNi41NDE2M0wzLjgxNjYzIDYuNjY2NjNMMy42NTgzIDYuODA4MjlMMy41NTgzIDYuODY2NjNMMy4zNTgzIDYuOTk5OTZMMy4yNjY2MyA3LjA2NjYzTDMuMTc0OTcgNy4xMjQ5NkwzLjA3NDk3IDcuMTk5OTZMMi45OTE2MyA3LjI2NjYzTDIuODkxNjMgNy4zNDE2M0wyLjc5OTk3IDcuNDA4MjlMMi42MTY2MyA3LjU1ODI5TDIuNTI0OTcgNy42MjQ5NkwyLjM5OTk3IDcuNzA4MjlMMi4yNTgzIDcuNzU4MjlMMi4xMDgzIDcuNzgzMjlMMS45NDk5NyA3Ljc2NjYzTDEuODA4MyA3LjcyNDk2TDEuNjc0OTcgNy42NDk5NkwxLjU1ODMgNy41NDk5NkwxLjQ3NDk3IDcuNDI0OTZMMS40MTY2MyA3LjI4MzI5TDEuMzgzMyA3LjEzMzI5TDEuMzkxNjMgNi45ODMyOUwxLjQzMzMgNi44MzMyOUwxLjQ5OTk3IDYuNjk5OTZMMS42NDE2MyA2LjU0MTYzTDEuNzMzMyA2LjQ2NjYzTDEuNzQxNjMgNi40NTgyOUwxLjg0MTYzIDYuMzgzMjlWNi4zNzQ5NkwxLjk0MTYzIDYuMjk5OTZIMS45NDk5N0wyLjA0MTYzIDYuMjI0OTZMMi4wNDk5NyA2LjIxNjYzTDIuMTQ5OTcgNi4xNDk5NkwyLjE1ODMgNi4xNDE2M0wyLjI0OTk3IDYuMDY2NjNIMi4yNTgzTDIuMzU4MyA1Ljk5MTYzSDIuMzY2NjNMMi41NjY2MyA1Ljg0MTYzSDIuNTc0OTdMMi42NzQ5NyA1Ljc3NDk2TDIuNzgzMyA1LjY5OTk2TDIuNzkxNjMgNS42OTE2M0wyLjg5OTk3IDUuNjI0OTZMMy4wMzMzIDUuNTU4MjlMMy4xODMzIDUuNTI0OTZMMy4zMzMzIDUuNTE2NjNMMy40ODMzIDUuNTQ5OTZaTTEwLjQ2NjYgMy41NjY2M0wxMS4yODMzIDMuNjI0OTZIMTEuMzI1TDEyLjEzMzMgMy43MzMyOUwxMi4xNzUgMy43NDE2M0wxMi45NzUgMy44OTk5NkwxMy4wMjUgMy45MDgyOUwxMy44MDgzIDQuMTE2NjNMMTMuODUgNC4xMzMyOUwxNC42MjUgNC4zOTE2M0wxNC42NjY2IDQuNDA4MjlMMTUuNDI1IDQuNzI0OTZMMTUuNDY2NiA0Ljc0MTYzTDE2LjE5MTYgNS4wOTk5NkwxNi4yMzMzIDUuMTI0OTZMMTYuOTQxNiA1LjUzMzI5TDE2Ljk4MzMgNS41NDk5NkwxNy42NTgzIDYuMDA4MjlMMTcuNjkxNiA2LjAzMzI5TDE4LjM0MTYgNi41MjQ5NkwxOC40NSA2LjYzMzI5TDE4LjU0MTYgNi43NTgyOUwxOC41OTE2IDYuODk5OTZMMTguNjE2NiA3LjA0OTk2TDE4LjYwODMgNy4yMDgyOUwxOC41NjY2IDcuMzQ5OTZMMTguNDkxNiA3LjQ4MzI5TDE4LjM5MTYgNy41OTk5NkwxOC4yNjY2IDcuNjkxNjNMMTguMTI1IDcuNzQ5OTZMMTcuOTc1IDcuNzgzMjlMMTcuODI1IDcuNzc0OTZMMTcuNjc1IDcuNzQxNjNMMTcuNDkxNiA3LjY0MTYzTDE2Ljg2NjYgNy4xNTgyOUwxNi4yMTY2IDYuNzMzMjlMMTUuNTU4MyA2LjM0OTk2TDE0Ljg1ODMgNi4wMDgyOUwxNC4xNjY2IDUuNzE2NjNMMTMuNDE2NiA1LjQ2NjYzTDEyLjY5MTYgNS4yNjY2M0wxMS45MjUgNS4xMTY2M0wxMS4xNTgzIDUuMDE2NjNMMTAuNCA0Ljk2NjYzSDkuNjI0OTdMOC44MzMzIDUuMDE2NjNMOC42ODMzIDUuMDA4MjlMOC41NDE2MyA0Ljk2NjYzTDguMzk5OTcgNC44OTk5Nkw4LjI4MzMgNC43OTk5Nkw4LjE5MTYzIDQuNjc0OTZMOC4xMjQ5NyA0LjU0MTYzTDguMDk5OTcgNC4zOTE2M1Y0LjI0MTYzTDguMTMzMyA0LjA5MTYzTDguMTkxNjMgMy45NDk5Nkw4LjI5MTYzIDMuODMzMjlMOC40MDgzIDMuNzMzMjlMOC41NDE2MyAzLjY2NjYzTDguNzQ5OTcgMy42MTY2M0w5LjU1ODMgMy41NjY2M0gxMC40NjY2WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==');
   --str-video__icon--network-quality: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuNCA5LjJINi42QzcuMzcgOS4yIDggOS44MyA4IDEwLjZWMTcuNkM4IDE4LjM3IDcuMzcgMTkgNi42IDE5SDYuNEM1LjYzIDE5IDUgMTguMzcgNSAxNy42VjEwLjZDNSA5LjgzIDUuNjMgOS4yIDYuNCA5LjJaTTEyIDVDMTIuNzcgNSAxMy40IDUuNjMgMTMuNCA2LjRWMTcuNkMxMy40IDE4LjM3IDEyLjc3IDE5IDEyIDE5QzExLjIzIDE5IDEwLjYgMTguMzcgMTAuNiAxNy42VjYuNEMxMC42IDUuNjMgMTEuMjMgNSAxMiA1Wk0xNy42IDEzQzE4LjM3IDEzIDE5IDEzLjYzIDE5IDE0LjRWMTcuNkMxOSAxOC4zNyAxOC4zNyAxOSAxNy42IDE5QzE2LjgzIDE5IDE2LjIgMTguMzcgMTYuMiAxNy42VjE0LjRDMTYuMiAxMy42MyAxNi44MyAxMyAxNy42IDEzWiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K');
-  --str-video__icon--reactions: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTIzIDQuNUMyMyA1LjA1IDIyLjU1IDUuNSAyMiA1LjVIMjFWNi41QzIxIDcuMDUgMjAuNTUgNy41IDIwIDcuNUMxOS40NSA3LjUgMTkgNy4wNSAxOSA2LjVWNS41SDE4QzE3LjQ1IDUuNSAxNyA1LjA1IDE3IDQuNUMxNyAzLjk1IDE3LjQ1IDMuNSAxOCAzLjVIMTlWMi41QzE5IDEuOTUgMTkuNDUgMS41IDIwIDEuNUMyMC41NSAxLjUgMjEgMS45NSAyMSAyLjVWMy41SDIyQzIyLjU1IDMuNSAyMyAzLjk1IDIzIDQuNVpNMjAuNTIgOS40NUMyMC44MyAxMC40MSAyMSAxMS40NCAyMSAxMi41QzIxIDE4LjAyIDE2LjUyIDIyLjUgMTEgMjIuNUM1LjQ4IDIyLjUgMSAxOC4wMiAxIDEyLjVDMSA2Ljk4IDUuNDggMi41IDExIDIuNUMxMi41IDIuNSAxMy45MiAyLjg0IDE1LjIgMy40NEMxNS4wOCAzLjc3IDE1IDQuMTIgMTUgNC41QzE1IDUuODUgMTUuOSA3IDE3LjEzIDcuMzdDMTcuNSA4LjYgMTguNjUgOS41IDIwIDkuNUMyMC4xOCA5LjUgMjAuMzUgOS40OCAyMC41MiA5LjQ1Wk02IDEwQzYgMTAuODMgNi42NyAxMS41IDcuNSAxMS41QzguMzMgMTEuNSA5IDEwLjgzIDkgMTBDOSA5LjE3IDguMzMgOC41IDcuNSA4LjVDNi42NyA4LjUgNiA5LjE3IDYgMTBaTTE1LjMxIDE0LjVINi42OUM2LjMxIDE0LjUgNi4wNiAxNC45MiA2LjI1IDE1LjI1QzcuMiAxNi44OSA4Ljk3IDE4IDExIDE4QzEzLjAzIDE4IDE0LjggMTYuODkgMTUuNzUgMTUuMjVDMTUuOTQgMTQuOTIgMTUuNyAxNC41IDE1LjMxIDE0LjVaTTE2IDEwQzE2IDkuMTcgMTUuMzMgOC41IDE0LjUgOC41QzEzLjY3IDguNSAxMyA5LjE3IDEzIDEwQzEzIDEwLjgzIDEzLjY3IDExLjUgMTQuNSAxMS41QzE1LjMzIDExLjUgMTYgMTAuODMgMTYgMTBaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==');
-  --str-video__icon--recording-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPGcgaWQ9IlZlY3RvciI+CjxwYXRoIGQ9Ik0xMiAyQzYuNDggMiAyIDYuNDggMiAxMkMyIDE3LjUyIDYuNDggMjIgMTIgMjJDMTcuNTIgMjIgMjIgMTcuNTIgMjIgMTJDMjIgNi40OCAxNy41MiAyIDEyIDJaTTEyIDIwQzcuNTggMjAgNCAxNi40MiA0IDEyQzQgNy41OCA3LjU4IDQgMTIgNEMxNi40MiA0IDIwIDcuNTggMjAgMTJDMjAgMTYuNDIgMTYuNDIgMjAgMTIgMjBaIiBmaWxsPSIjQjBCNEI3Ii8+CjxwYXRoIGQ9Ik0xMiAxN0MxNC43NjE0IDE3IDE3IDE0Ljc2MTQgMTcgMTJDMTcgOS4yMzg1OCAxNC43NjE0IDcgMTIgN0M5LjIzODU4IDcgNyA5LjIzODU4IDcgMTJDNyAxNC43NjE0IDkuMjM4NTggMTcgMTIgMTdaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9nPgo8L3N2Zz4K');
-  --str-video__icon--recording-on: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwIDBDNC40OCAwIDAgNC40OCAwIDEwQzAgMTUuNTIgNC40OCAyMCAxMCAyMEMxNS41MiAyMCAyMCAxNS41MiAyMCAxMEMyMCA0LjQ4IDE1LjUyIDAgMTAgMFpNMTMgMTRIN0M2LjQ1IDE0IDYgMTMuNTUgNiAxM1Y3QzYgNi40NSA2LjQ1IDYgNyA2SDEzQzEzLjU1IDYgMTQgNi40NSAxNCA3VjEzQzE0IDEzLjU1IDEzLjU1IDE0IDEzIDE0WiIgZmlsbD0iI0UzRTRFNSIvPgo8L3N2Zz4K');
-  --str-video__icon--refresh: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOTIwIDE5MjAiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTk2MCAwdjIxMy4zMzNjNDExLjYyNyAwIDc0Ni42NjcgMzM0LjkzNCA3NDYuNjY3IDc0Ni42NjdTMTM3MS42MjcgMTcwNi42NjcgOTYwIDE3MDYuNjY3IDIxMy4zMzMgMTM3MS43MzMgMjEzLjMzMyA5NjBjMC0xOTcuMDEzIDc4LjQtMzgyLjUwNyAyMTMuMzM0LTUyMC43NDd2MjU0LjA4SDY0MFYxMDYuNjY3SDUzLjMzM1YzMjBoMTkxLjA0Qzg4LjY0IDQ5NC4wOCAwIDcyMC45NiAwIDk2MGMwIDUyOS4yOCA0MzAuNjEzIDk2MCA5NjAgOTYwczk2MC00MzAuNzIgOTYwLTk2MFMxNDg5LjM4NyAwIDk2MCAwIi8+PC9zdmc+Cg==');
-  --str-video__icon--screen-share-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTIwIDE4QzIxLjEgMTggMjIgMTcuMSAyMiAxNlY2QzIyIDQuOSAyMS4xIDQgMjAgNEg0QzIuOSA0IDIgNC45IDIgNlYxNkMyIDE3LjEgMi44OSAxOCA0IDE4SDFDMC40NSAxOCAwIDE4LjQ1IDAgMTlDMCAxOS41NSAwLjQ1IDIwIDEgMjBIMjNDMjMuNTUgMjAgMjQgMTkuNTUgMjQgMTlDMjQgMTguNDUgMjMuNTUgMTggMjMgMThIMjBaTTEzIDE0LjQ3VjEyLjI4QzEwLjIyIDEyLjI4IDguMzkgMTMuMTMgNyAxNUM3LjU2IDEyLjMzIDkuMTEgOS42NyAxMyA5LjEzVjdMMTYuNjEgMTAuMzZDMTYuODIgMTAuNTYgMTYuODIgMTAuODkgMTYuNjEgMTEuMDlMMTMgMTQuNDdaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==');
-  --str-video__icon--screen-share-on: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPU91dGxpbmVkIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTIwIDE4QzIxLjEgMTggMjEuOTkgMTcuMSAyMS45OSAxNkwyMiA2QzIyIDQuODkgMjEuMSA0IDIwIDRINEMyLjg5IDQgMiA0Ljg5IDIgNlYxNkMyIDE3LjEgMi44OSAxOCA0IDE4SDBWMjBIMjRWMThIMjBaTTQgMTZWNkgyMFYxNi4wMUw0IDE2Wk0xMyA5LjEzQzkuMTEgOS42NyA3LjU2IDEyLjMzIDcgMTVDOC4zOSAxMy4xMyAxMC4yMiAxMi4yOCAxMyAxMi4yOFYxNC40N0wxNyAxMC43M0wxMyA3VjkuMTNaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==');
-  --str-video__icon--settings: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTE5LjQ5OTcgMTJDMTkuNDk5NyAxMS43NyAxOS40ODk3IDExLjU1IDE5LjQ2OTcgMTEuMzJMMjEuMzI5NyA5LjkxQzIxLjcyOTcgOS42MSAyMS44Mzk3IDkuMDUgMjEuNTg5NyA4LjYxTDE5LjcxOTcgNS4zOEMxOS40Njk3IDQuOTQgMTguOTI5NyA0Ljc2IDE4LjQ2OTcgNC45NkwxNi4zMTk3IDUuODdDMTUuOTQ5NyA1LjYxIDE1LjU1OTcgNS4zOCAxNS4xNDk3IDUuMTlMMTQuODU5NyAyLjg4QzE0Ljc5OTcgMi4zOCAxNC4zNjk3IDIgMTMuODY5NyAySDEwLjEzOTdDOS42Mjk2NyAyIDkuMTk5NjcgMi4zOCA5LjEzOTY3IDIuODhMOC44NDk2NyA1LjE5QzguNDM5NjcgNS4zOCA4LjA0OTY2IDUuNjEgNy42Nzk2NyA1Ljg3TDUuNTI5NjcgNC45NkM1LjA2OTY3IDQuNzYgNC41Mjk2NyA0Ljk0IDQuMjc5NjcgNS4zOEwyLjQwOTY3IDguNjJDMi4xNTk2NyA5LjA2IDIuMjY5NjcgOS42MSAyLjY2OTY3IDkuOTJMNC41Mjk2NyAxMS4zM0M0LjUwOTY3IDExLjU1IDQuNDk5NjcgMTEuNzcgNC40OTk2NyAxMkM0LjQ5OTY3IDEyLjIzIDQuNTA5NjcgMTIuNDUgNC41Mjk2NyAxMi42OEwyLjY2OTY3IDE0LjA5QzIuMjY5NjcgMTQuMzkgMi4xNTk2NyAxNC45NSAyLjQwOTY3IDE1LjM5TDQuMjc5NjcgMTguNjJDNC41Mjk2NyAxOS4wNiA1LjA2OTY3IDE5LjI0IDUuNTI5NjcgMTkuMDRMNy42Nzk2NyAxOC4xM0M4LjA0OTY2IDE4LjM5IDguNDM5NjcgMTguNjIgOC44NDk2NyAxOC44MUw5LjEzOTY3IDIxLjEyQzkuMTk5NjcgMjEuNjIgOS42Mjk2NyAyMiAxMC4xMjk3IDIySDEzLjg1OTdDMTQuMzU5NyAyMiAxNC43ODk3IDIxLjYyIDE0Ljg0OTcgMjEuMTJMMTUuMTM5NyAxOC44MUMxNS41NDk3IDE4LjYyIDE1LjkzOTcgMTguMzkgMTYuMzA5NyAxOC4xM0wxOC40NTk3IDE5LjA0QzE4LjkxOTcgMTkuMjQgMTkuNDU5NyAxOS4wNiAxOS43MDk3IDE4LjYyTDIxLjU3OTcgMTUuMzlDMjEuODI5NyAxNC45NSAyMS43MTk3IDE0LjQgMjEuMzE5NyAxNC4wOUwxOS40NTk3IDEyLjY4QzE5LjQ4OTcgMTIuNDUgMTkuNDk5NyAxMi4yMyAxOS40OTk3IDEyWk0xMi4wMzk3IDE1LjVDMTAuMTA5NyAxNS41IDguNTM5NjcgMTMuOTMgOC41Mzk2NyAxMkM4LjUzOTY3IDEwLjA3IDEwLjEwOTcgOC41IDEyLjAzOTcgOC41QzEzLjk2OTcgOC41IDE1LjUzOTcgMTAuMDcgMTUuNTM5NyAxMkMxNS41Mzk3IDEzLjkzIDEzLjk2OTcgMTUuNSAxMi4wMzk3IDE1LjVaIiBmaWxsPSIjQjBCNEI3Ii8+CjwvZz4KPC9zdmc+Cg==');
-  --str-video__icon--speaker: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTMgMTAuMDAxOFYxNC4wMDE4QzMgMTQuNTUxOCAzLjQ1IDE1LjAwMTggNCAxNS4wMDE4SDdMMTAuMjkgMTguMjkxOEMxMC45MiAxOC45MjE4IDEyIDE4LjQ3MTggMTIgMTcuNTgxOFY2LjQxMTc5QzEyIDUuNTIxNzkgMTAuOTIgNS4wNzE3OSAxMC4yOSA1LjcwMTc5TDcgOS4wMDE3OUg0QzMuNDUgOS4wMDE3OSAzIDkuNDUxNzkgMyAxMC4wMDE4Wk0xNi41IDEyLjAwMThDMTYuNSAxMC4yMzE4IDE1LjQ4IDguNzExNzkgMTQgNy45NzE3OVYxNi4wMjE4QzE1LjQ4IDE1LjI5MTggMTYuNSAxMy43NzE4IDE2LjUgMTIuMDAxOFpNMTQgNC40NTE3OVY0LjY1MTc5QzE0IDUuMDMxNzkgMTQuMjUgNS4zNjE3OSAxNC42IDUuNTAxNzlDMTcuMTggNi41MzE3OSAxOSA5LjA2MTc5IDE5IDEyLjAwMThDMTkgMTQuOTQxOCAxNy4xOCAxNy40NzE4IDE0LjYgMTguNTAxOEMxNC4yNCAxOC42NDE4IDE0IDE4Ljk3MTggMTQgMTkuMzUxOFYxOS41NTE4QzE0IDIwLjE4MTggMTQuNjMgMjAuNjIxOCAxNS4yMSAyMC40MDE4QzE4LjYgMTkuMTExOCAyMSAxNS44NDE4IDIxIDEyLjAwMThDMjEgOC4xNjE3OSAxOC42IDQuODkxNzkgMTUuMjEgMy42MDE3OUMxNC42MyAzLjM3MTc5IDE0IDMuODIxNzkgMTQgNC40NTE3OVoiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K');
-  --str-video__icon--speaker-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Zz48cGF0aCBkPSJNMyAxMC4wMDE4VjE0LjAwMThDMyAxNC41NTE4IDMuNDUgMTUuMDAxOCA0IDE1LjAwMThIN0wxMC4yOSAxOC4yOTE4QzEwLjkyIDE4LjkyMTggMTIgMTguNDcxOCAxMiAxNy41ODE4VjYuNDExNzlDMTIgNS41MjE3OSAxMC45MiA1LjA3MTc5IDEwLjI5IDUuNzAxNzlMNyA5LjAwMTc5SDRDMy40NSA5LjAwMTc5IDMgOS40NTE3OSAzIDEwLjAwMThaTTE2LjUgMTIuMDAxOEMxNi41IDEwLjIzMTggMTUuNDggOC43MTE3OSAxNCA3Ljk3MTc5VjE2LjAyMThDMTUuNDggMTUuMjkxOCAxNi41IDEzLjc3MTggMTYuNSAxMi4wMDE4Wk0xNCA0LjQ1MTc5VjQuNjUxNzlDMTQgNS4wMzE3OSAxNC4yNSA1LjM2MTc5IDE0LjYgNS41MDE3OUMxNy4xOCA2LjUzMTc5IDE5IDkuMDYxNzkgMTkgMTIuMDAxOEMxOSAxNC45NDE4IDE3LjE4IDE3LjQ3MTggMTQuNiAxOC41MDE4QzE0LjI0IDE4LjY0MTggMTQgMTguOTcxOCAxNCAxOS4zNTE4VjE5LjU1MThDMTQgMjAuMTgxOCAxNC42MyAyMC42MjE4IDE1LjIxIDIwLjQwMThDMTguNiAxOS4xMTE4IDIxIDE1Ljg0MTggMjEgMTIuMDAxOEMyMSA4LjE2MTc5IDE4LjYgNC44OTE3OSAxNS4yMSAzLjYwMTc5QzE0LjYzIDMuMzcxNzkgMTQgMy44MjE3OSAxNCA0LjQ1MTc5WiIgZmlsbD0iI0IwQjRCNyIvPjxwYXRoIGQ9Ik00LjUgNC41TDE5LjUgMTkuNSIgc3Ryb2tlPSIjQjBCNEI3IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPjwvZz48L3N2Zz4=');
-  --str-video__icon--stats: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IlN0eWxlPVJvdW5kIj4KPHBhdGggaWQ9IlZlY3RvciIgZD0iTTEzLjg5MTEgMTAuNTQ3NUwxMi44MzExIDEwLjA1NzVDMTIuNDQxMSA5Ljg3NzQ2IDEyLjQ0MTEgOS4zMjc0NiAxMi44MzExIDkuMTQ3NDZMMTMuODkxMSA4LjY1NzQ2TDE0LjM4MTEgNy42MDc0NkMxNC41NjExIDcuMjE3NDYgMTUuMTExMSA3LjIxNzQ2IDE1LjI5MTEgNy42MDc0NkwxNS43ODExIDguNjY3NDZMMTYuODMxMSA5LjE1NzQ2QzE3LjIyMTEgOS4zMzc0NiAxNy4yMjExIDkuODg3NDYgMTYuODMxMSAxMC4wNjc1TDE1Ljc3MTEgMTAuNTU3NUwxNS4yODExIDExLjYwNzVDMTUuMTAxMSAxMS45OTc1IDE0LjU1MTEgMTEuOTk3NSAxNC4zNzExIDExLjYwNzVMMTMuODkxMSAxMC41NDc1Wk00LjI4MTA3IDEzLjYwNzVMNC43NzEwNyAxMi41NDc1TDUuODMxMDcgMTIuMDU3NUM2LjIyMTA3IDExLjg3NzUgNi4yMjEwNyAxMS4zMjc1IDUuODMxMDcgMTEuMTQ3NUw0Ljc3MTA3IDEwLjY1NzVMNC4yODEwNyA5LjYwNzQ2QzQuMTExMDcgOS4yMTc0NiAzLjU1MTA3IDkuMjE3NDYgMy4zODEwNyA5LjYwNzQ2TDIuODkxMDcgMTAuNjY3NUwxLjgzMTA3IDExLjE1NzVDMS40NDEwNyAxMS4zMzc1IDEuNDQxMDcgMTEuODg3NSAxLjgzMTA3IDEyLjA2NzVMMi44OTEwNyAxMi41NTc1TDMuMzgxMDcgMTMuNjA3NUMzLjU1MTA3IDEzLjk5NzUgNC4xMTEwNyAxMy45OTc1IDQuMjgxMDcgMTMuNjA3NVpNOC43OTEwNyA4LjU5NzQ2TDkuNDIxMDcgNy4xOTc0NkwxMC44MjExIDYuNTY3NDZDMTEuMjExMSA2LjM4NzQ2IDExLjIxMTEgNS44Mzc0NiAxMC44MjExIDUuNjU3NDZMOS40MjEwNyA1LjAyNzQ2TDguNzkxMDcgMy42Mjc0NkM4LjYxMTA3IDMuMjM3NDYgOC4wNjEwNyAzLjIzNzQ2IDcuODgxMDcgMy42Mjc0Nkw3LjI1MTA3IDUuMDI3NDZMNS44NTEwNyA1LjY1NzQ2QzUuNDYxMDcgNS44Mzc0NiA1LjQ2MTA3IDYuMzg3NDYgNS44NTEwNyA2LjU2NzQ2TDcuMjUxMDcgNy4xOTc0Nkw3Ljg4MTA3IDguNTk3NDZDOC4wNTEwNyA4Ljk4NzQ2IDguNjExMDcgOC45ODc0NiA4Ljc5MTA3IDguNTk3NDZaTTIyLjE3MTEgOC44Nzc0NkMyMS43NzExIDguNDc3NDYgMjEuMTAxMSA4LjQ4NzQ2IDIwLjcyMTEgOC45MTc0NkwxNC4zMzExIDE2LjA5NzVMMTEuMDQxMSAxMi44MDc1QzEwLjY1MTEgMTIuNDE3NSAxMC4wMjExIDEyLjQxNzUgOS42MzEwNyAxMi44MDc1TDMuNTkxMDcgMTguODU3NUMzLjE4MTA3IDE5LjI2NzUgMy4xODEwNyAxOS45NDc1IDMuNTkxMDcgMjAuMzU3NUM0LjAwMTA3IDIwLjc2NzUgNC42ODEwNyAyMC43Njc1IDUuMDkxMDcgMjAuMzU3NUwxMC4zNDExIDE1LjA5NzVMMTMuNTkxMSAxOC4zNDc1QzE0LjAwMTEgMTguNzU3NSAxNC42NjExIDE4LjczNzUgMTUuMDQxMSAxOC4zMDc1TDIyLjIxMTEgMTAuMjM3NUMyMi41NjExIDkuODQ3NDYgMjIuNTQxMSA5LjI0NzQ2IDIyLjE3MTEgOC44Nzc0NloiIGZpbGw9IiNCMEI0QjciLz4KPC9nPgo8L3N2Zz4K');
-  --str-video__icon--pin: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xOSAxMi44N0MxOSAxMi40IDE4LjY2IDEyLjAyIDE4LjIgMTEuODlDMTYuOTMgMTEuNTQgMTYgMTAuMzggMTYgOVY0SDE3QzE3LjU1IDQgMTggMy41NSAxOCAzQzE4IDIuNDUgMTcuNTUgMiAxNyAySDdDNi40NSAyIDYgMi40NSA2IDNDNiAzLjU1IDYuNDUgNCA3IDRIOFY5QzggMTAuMzggNy4wNyAxMS41NCA1LjggMTEuODlDNS4zNCAxMi4wMiA1IDEyLjQgNSAxMi44N1YxM0M1IDEzLjU1IDUuNDUgMTQgNiAxNEgxMC45OEwxMSAyMUMxMSAyMS41NSAxMS40NSAyMiAxMiAyMkMxMi41NSAyMiAxMyAyMS41NSAxMyAyMUwxMi45OCAxNEgxOEMxOC41NSAxNCAxOSAxMy41NSAxOSAxM1YxMi44N1oiIGZpbGw9IiNFM0U0RTUiLz4KPC9zdmc+Cg==');
-  --str-video__icon--no-audio: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAyMCAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjMzNjI5IDAuNzcyNzA5TDkuNzQ5MjQgMC40NDI2MTNDOS45MzYxNCAwLjI5MjkyOSAxMC4yMTE5IDAuMzE5NTk2IDEwLjM2NTEgMC41MDIxNzZDMTAuNDI5MyAwLjU3ODY3NyAxMC40NjQ0IDAuNjc0NTYzIDEwLjQ2NDMgMC43NzM0ODdWMS4zMzU0NlYxLjMzNzE1VjEuODY0NDdWMS45MjUyM1YxMy4yMDcyVjEzLjI2ODFWMTMuNzk1NVYxMy43OTcxVjE0LjM1OUMxMC40NjQ0IDE0LjU5NTEgMTAuMjY4NiAxNC43ODY2IDEwLjAyNjkgMTQuNzg2OEM5LjkyNTY4IDE0Ljc4NjggOS44Mjc1MyAxNC43NTI2IDkuNzQ5MjIgMTQuNjg5OUw5LjMzNjI2IDE0LjM1OTdMOS4zMzUzOSAxNC4zNTlMOC45MDg2MSAxNC4wMTc4TDguODU5NzMgMTMuOTc4N0w1LjExNjcyIDEwLjk4NjFMNS4xMTU4NSAxMC45ODYxSDEuNzEyMTNDMS4yMjg3NiAxMC45ODYxIDAuODM2OTE0IDEwLjYwMzMgMC44MzY5MTQgMTAuMTMxMlY1LjAwMTMzQzAuODM2OTE0IDQuNTI5MTQgMS4yMjg3NiA0LjE0NjM1IDEuNzEyMTMgNC4xNDYzNUg1LjExNTg1TDguODU5NzMgMS4xNTM2NUw4LjkwOTY0IDEuMTEzNzVMOS4zMzUzMiAwLjc3MzQ4N0w5LjMzNjI5IDAuNzcyNzA5Wk02LjExNzcyIDUuMzk5N0w4Ljg1OTczIDMuMjA3ODVWMTEuOTI0M0w2LjExODcxIDkuNzMyODhMNS42Nzg2NSA5LjM4MTA1TDUuMTE1ODUgOS4zODE1N0g1LjExNTIzTDUuMTE0MzYgOS4zODE1N0wyLjQ0MTQ4IDkuMzgxNTdWNS43NTA5Mkg1LjExNTg1SDUuNjc4MzRMNi4xMTc3MiA1LjM5OTdaTTE5LjUyNDQgOS44NjQ0NkwxNy4yMjYyIDcuNTY2MjRMMTkuNTI0NCA1LjI2ODAxQzE5LjgzNzcgNC45NTQ3IDE5LjgzMiA0LjQ0MTA4IDE5LjUxODcgNC4xMjc3N0MxOS4yMDU0IDMuODE0NDYgMTguNjkxOCAzLjgwODgyIDE4LjM3ODUgNC4xMjIxM0wxNi4wODAzIDYuNDIwMzVMMTMuNzgyIDQuMTIyMTNDMTMuNDY4NyAzLjgwODgyIDEyLjk1NTEgMy44MTQ0NiAxMi42NDE4IDQuMTI3NzdDMTIuMzI4NSA0LjQ0MTA4IDEyLjMyMjggNC45NTQ3IDEyLjYzNjIgNS4yNjgwMUwxNC45MzQ0IDcuNTY2MjRMMTIuNjM2MiA5Ljg2NDQ2QzEyLjMyMjggMTAuMTc3OCAxMi4zMjg1IDEwLjY5MTQgMTIuNjQxOCAxMS4wMDQ3QzEyLjk1NTEgMTEuMzE4IDEzLjQ2ODcgMTEuMzIzNyAxMy43ODIgMTEuMDEwM0wxNi4wODAzIDguNzEyMTJMMTguMzc4NSAxMS4wMTAzQzE4LjY5MTggMTEuMzIzNyAxOS4yMDU0IDExLjMxOCAxOS41MTg3IDExLjAwNDdDMTkuODMyIDEwLjY5MTQgMTkuODM3NyAxMC4xNzc4IDE5LjUyNDQgOS44NjQ0NloiIGZpbGw9IiM3Mjc2N0UiLz4KPC9zdmc+Cg==');
-  --str-video__icon--camera-off-outline: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNyAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTYuODUxMzggNS41MDk5OUw1LjI0NjgyIDMuOTA1NDNMMS45MTczNSAwLjU4Mzk4NEwwLjc4NjEzMyAxLjcxNTJMMi45NzYzNiAzLjkwNTQzSDIuMzkwN0MxLjk0OTQ0IDMuOTA1NDMgMS41ODg0MSA0LjI2NjQ2IDEuNTg4NDEgNC43MDc3MVYxMi43MzA1QzEuNTg4NDEgMTMuMTcxOCAxLjk0OTQ0IDEzLjUzMjggMi4zOTA3IDEzLjUzMjhIMTIuMDE4MUMxMi4xODY2IDEzLjUzMjggMTIuMzMxIDEzLjQ2ODYgMTIuNDU5MyAxMy4zODg0TDE1LjAxMDYgMTUuOTM5N0wxNi4xNDE4IDE0LjgwODRMOS4wMzM1OSA3LjcwMDIyTDYuODUxMzggNS41MDk5OVpNMy4xOTI5OCAxMS45MjgyVjUuNTA5OTlINC41ODA5MkwxMC45OTkyIDExLjkyODJIMy4xOTI5OFpNMTEuMjE1OCA1LjUwOTk5VjcuNjAzOTVMMTYuMDI5NSAxMi40MTc2VjQuMzA2NTdMMTIuODIwNCA3LjUxNTdWNC43MDc3MUMxMi44MjA0IDQuMjY2NDYgMTIuNDU5MyAzLjkwNTQzIDEyLjAxODEgMy45MDU0M0g3LjUxNzI4TDkuMTIxODQgNS41MDk5OUgxMS4yMTU4WiIgZmlsbD0iIzcyNzY3RSIvPgo8L3N2Zz4K');
-  --str-video__icon--not-allowed: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNyAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguNDY0MjIgMC45MzU1NDdDNC4wMzU2MyAwLjkzNTU0NyAwLjQ0MTQwNiA0LjUyOTc3IDAuNDQxNDA2IDguOTU4MzZDMC40NDE0MDYgMTMuMzg3IDQuMDM1NjMgMTYuOTgxMiA4LjQ2NDIyIDE2Ljk4MTJDMTIuODkyOCAxNi45ODEyIDE2LjQ4NyAxMy4zODcgMTYuNDg3IDguOTU4MzZDMTYuNDg3IDQuNTI5NzcgMTIuODkyOCAwLjkzNTU0NyA4LjQ2NDIyIDAuOTM1NTQ3Wk0yLjA0NTk3IDguOTU4MzZDMi4wNDU5NyA1LjQxMjI4IDQuOTE4MTQgMi41NDAxMSA4LjQ2NDIyIDIuNTQwMTFDOS45NDg0NCAyLjU0MDExIDExLjMxMjMgMy4wNDU1NSAxMi4zOTU0IDMuODk1OTdMMy40MDE4MyAxMi44ODk1QzIuNTUxNDEgMTEuODA2NSAyLjA0NTk3IDEwLjQ0MjYgMi4wNDU5NyA4Ljk1ODM2Wk04LjQ2NDIyIDE1LjM3NjZDNi45OCAxNS4zNzY2IDUuNjE2MTIgMTQuODcxMiA0LjUzMzA0IDE0LjAyMDhMMTMuNTI2NiA1LjAyNzE4QzE0LjM3NyA2LjExMDI2IDE0Ljg4MjUgNy40NzQxNCAxNC44ODI1IDguOTU4MzZDMTQuODgyNSAxMi41MDQ0IDEyLjAxMDMgMTUuMzc2NiA4LjQ2NDIyIDE1LjM3NjZaIiBmaWxsPSIjNzI3NjdFIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--no-audio: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M15.625 8.125V11.875M18.125 6.875V13.125M4.375 3.125L16.875 16.875M9.38672 4.92109L12.5 2.5V8.34609M12.5 12.0625V17.5L6.875 13.125H3.125C2.95924 13.125 2.80027 13.0592 2.68306 12.9419C2.56585 12.8247 2.5 12.6658 2.5 12.5V7.5C2.5 7.33424 2.56585 7.17527 2.68306 7.05806C2.80027 6.94085 2.95924 6.875 3.125 6.875H7.78437%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--not-allowed: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M16.5 10C16.5 6.41015 13.5899 3.5 10 3.5C8.56592 3.5 7.24096 3.96531 6.16602 4.75195L15.2471 13.833C16.0336 12.7581 16.5 11.434 16.5 10ZM3.5 10C3.5 13.5899 6.41015 16.5 10 16.5C11.434 16.5 12.7581 16.0336 13.833 15.2471L4.75195 6.16602C3.96531 7.24096 3.5 8.56592 3.5 10ZM18.5 10C18.5 14.6944 14.6944 18.5 10 18.5C5.30558 18.5 1.5 14.6944 1.5 10C1.5 5.30558 5.30558 1.5 10 1.5C14.6944 1.5 18.5 5.30558 18.5 10Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--pip: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2Ljg3NSAzLjc1SDMuMTI1QzIuNzkzNDggMy43NSAyLjQ3NTU0IDMuODgxNyAyLjI0MTEyIDQuMTE2MTJDMi4wMDY3IDQuMzUwNTQgMS44NzUgNC42Njg0OCAxLjg3NSA1VjE1QzEuODc1IDE1LjMzMTUgMi4wMDY3IDE1LjY0OTUgMi4yNDExMiAxNS44ODM5QzIuNDc1NTQgMTYuMTE4MyAyLjc5MzQ4IDE2LjI1IDMuMTI1IDE2LjI1SDE2Ljg3NUMxNy4yMDY1IDE2LjI1IDE3LjUyNDUgMTYuMTE4MyAxNy43NTg5IDE1Ljg4MzlDMTcuOTkzMyAxNS42NDk1IDE4LjEyNSAxNS4zMzE1IDE4LjEyNSAxNVY1QzE4LjEyNSA0LjY2ODQ4IDE3Ljk5MzMgNC4zNTA1NCAxNy43NTg5IDQuMTE2MTJDMTcuNTI0NSAzLjg4MTcgMTcuMjA2NSAzLjc1IDE2Ljg3NSAzLjc1Wk0xNi44NzUgMTVIMTAuNjI1VjEwSDE2Ljg3NVYxNVoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--pin: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M18.3852 8.12501L14.2079 12.3164C14.5641 13.3063 14.7118 14.9641 13.1774 17.0039C13.0701 17.1473 12.9331 17.2659 12.7758 17.3515C12.6184 17.4372 12.4444 17.4878 12.2657 17.5C12.236 17.5 12.2071 17.5 12.1774 17.5C12.0132 17.5 11.8505 17.4677 11.6988 17.4048C11.547 17.3419 11.4092 17.2498 11.2931 17.1336L7.52274 13.3594L4.19227 16.6922C4.075 16.8095 3.91594 16.8754 3.75009 16.8754C3.58423 16.8754 3.42518 16.8095 3.3079 16.6922C3.19062 16.5749 3.12474 16.4159 3.12474 16.25C3.12474 16.0842 3.19062 15.9251 3.3079 15.8078L6.64071 12.4774L2.86727 8.70391C2.74324 8.57973 2.64675 8.43081 2.58409 8.26686C2.52143 8.10291 2.49399 7.9276 2.50357 7.75235C2.51315 7.57709 2.55953 7.40582 2.6397 7.24968C2.71986 7.09354 2.83201 6.95603 2.96884 6.8461C4.95477 5.24376 6.85556 5.5586 7.68759 5.81954L11.8751 1.61719C11.9912 1.50109 12.129 1.40899 12.2807 1.34615C12.4323 1.28332 12.5949 1.25098 12.7591 1.25098C12.9232 1.25098 13.0858 1.28332 13.2375 1.34615C13.3892 1.40899 13.527 1.50109 13.6431 1.61719L18.3845 6.35782C18.6188 6.59211 18.7505 6.90987 18.7507 7.24125C18.7508 7.57263 18.6194 7.89051 18.3852 8.12501Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--reactions: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzI2Mzg4XzM3MDApIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05Ljk5OTk3IDEuODc1QzEwLjc3MzIgMS44NzU4MiAxMS41MzQzIDEuOTg4ODggMTIuMjYzNiAyLjIwMTE3QzEyLjEyODUgMi40NTA0NSAxMi4wMzg5IDIuNzI4MDUgMTIuMDA4OCAzLjAyMzQ0TDExLjk5NyAzLjI0OTAyQzExLjk5NzMgNC40NjY0OCAxMi45ODQ2IDUuNDU0MSAxNC4yMDIxIDUuNDU0MUgxNC41NDJWNS43OTU5QzE0LjU0MjUgNy4wMTI4MSAxNS41MjkxIDcuOTk5NDkgMTYuNzQ2MSA4QzE3LjEyNjkgNy45OTk5MiAxNy40ODU0IDcuOTAyMzYgMTcuNzk3OCA3LjczMjQyQzE4LjAxMDggOC40NjI5NCAxOC4xMjQxIDkuMjI1NDMgMTguMTI1IDEwQzE4LjEyNSAxMS42MDY4IDE3LjY0ODUgMTMuMTc3NiAxNi43NTU4IDE0LjUxMzdDMTUuODYzIDE1Ljg0OTggMTQuNTk0IDE2Ljg5MTkgMTMuMTA5MyAxNy41MDY4QzExLjYyNDcgMTguMTIxOCA5Ljk5MTA1IDE4LjI4MjIgOC40MTUwMSAxNy45Njg4QzYuODM4OTIgMTcuNjU1MiA1LjM5MTE1IDE2Ljg4MTQgNC4yNTQ4NSAxNS43NDUxQzMuMTE4NTUgMTQuNjA4OCAyLjM0NDcyIDEzLjE2MTEgMi4wMzEyMiAxMS41ODVDMS43MTc3NSAxMC4wMDg5IDEuODc4MiA4LjM3NTIzIDIuNDkzMTMgNi44OTA2MkMzLjEwODA5IDUuNDA1OTggNC4xNTAxNSA0LjEzNjkzIDUuNDg2MyAzLjI0NDE0QzYuODIyMzcgMi4zNTE1IDguMzkzMTMgMS44NzUgOS45OTk5NyAxLjg3NVpNMTIuOTYzOCAxMS4yNTJDMTIuODgyOSAxMS4yNzU0IDEyLjgwNzQgMTEuMzE0OCAxMi43NDIyIDExLjM2ODJDMTIuNjc2OSAxMS40MjE1IDEyLjYyMyAxMS40ODc4IDEyLjU4NCAxMS41NjI1QzEyLjAwMDQgMTIuNTcwMiAxMS4wODM1IDEzLjEyNSA5Ljk5OTk3IDEzLjEyNUM4LjkxNjQ0IDEzLjEyNSA3Ljk5OTU4IDEyLjU3MSA3LjQxNTk4IDExLjU2MjVDNy4zNzY5MiAxMS40ODc4IDcuMzIzIDExLjQyMTUgNy4yNTc3OCAxMS4zNjgyQzcuMTkyNTggMTEuMzE0OCA3LjExNjk4IDExLjI3NTQgNy4wMzYxIDExLjI1MkM2Ljk1NTE1IDExLjIyODUgNi44Njk3OCAxMS4yMjEzIDYuNzg2MSAxMS4yMzE0QzYuNzAyNTEgMTEuMjQxNiA2LjYyMTcgMTEuMjY5NCA2LjU0ODggMTEuMzExNUM2LjQ3NTk1IDExLjM1MzcgNi40MTE3OSAxMS40MTAyIDYuMzYxMyAxMS40Nzc1QzYuMzEwOTcgMTEuNTQ0OCA2LjI3NDg4IDExLjYyMTYgNi4yNTQ4NSAxMS43MDMxQzYuMjM0OCAxMS43ODUgNi4yMzE0IDExLjg3MDkgNi4yNDUwOCAxMS45NTQxQzYuMjU4NzkgMTIuMDM3IDYuMjg4ODcgMTIuMTE2NSA2LjMzMzk1IDEyLjE4NzVDNy4xMzc4NiAxMy41NzgxIDguNDc0MTkgMTQuMzc1IDkuOTk5OTcgMTQuMzc1QzExLjUyNTcgMTQuMzc1IDEyLjg2MjEgMTMuNTc3MyAxMy42NjYgMTIuMTg3NUMxMy43MTExIDEyLjExNjUgMTMuNzQxMSAxMi4wMzcgMTMuNzU0OSAxMS45NTQxQzEzLjc2ODUgMTEuODcwOSAxMy43NjUxIDExLjc4NSAxMy43NDUxIDExLjcwMzFDMTMuNzI1IDExLjYyMTQgMTMuNjg4MiAxMS41NDQ5IDEzLjYzNzcgMTEuNDc3NUMxMy41ODcyIDExLjQxMDIgMTMuNTI0IDExLjM1MzcgMTMuNDUxMSAxMS4zMTE1QzEzLjM3ODMgMTEuMjY5NCAxMy4yOTc0IDExLjI0MTYgMTMuMjEzOCAxMS4yMzE0QzEzLjEzMDIgMTEuMjIxMyAxMy4wNDQ4IDExLjIyODUgMTIuOTYzOCAxMS4yNTJaTTEyLjYyOTkgNy41MTc1OEMxMi40NDggNy41NTM3NSAxMi4yODA1IDcuNjQzMzEgMTIuMTQ5NCA3Ljc3NDQxQzEyLjAxODMgNy45MDU1MyAxMS45Mjg3IDguMDczMDMgMTEuODkyNSA4LjI1NDg4QzExLjg1NjUgOC40MzY1MiAxMS44NzU1IDguNjI0NzkgMTEuOTQ2MyA4Ljc5NTlDMTIuMDE3MiA4Ljk2NzIgMTIuMTM3OCA5LjExMzc4IDEyLjI5MiA5LjIxNjhDMTIuNDQ2MSA5LjMxOTc0IDEyLjYyNzEgOS4zNzUgMTIuODEyNSA5LjM3NUMxMy4wNjExIDkuMzc0OTkgMTMuMjk5NyA5LjI3NjM5IDEzLjQ3NTYgOS4xMDA1OUMxMy42NTE0IDguOTI0NzcgMTMuNzUgOC42ODYxMyAxMy43NSA4LjQzNzVDMTMuNzUgOC4yNTIxNCAxMy42OTQ3IDguMDcxMTMgMTMuNTkxOCA3LjkxNjk5QzEzLjQ4ODggNy43NjI4MiAxMy4zNDIyIDcuNjQyMjUgMTMuMTcwOSA3LjU3MTI5QzEyLjk5OTggNy41MDA0OSAxMi44MTE1IDcuNDgxNTMgMTIuNjI5OSA3LjUxNzU4Wk03LjE4NzQ3IDcuNUM2LjkzODgzIDcuNSA2LjcwMDIgNy41OTg2MSA2LjUyNDM4IDcuNzc0NDFDNi4zNDg1NyA3Ljk1MDIzIDYuMjQ5OTcgOC4xODg4NiA2LjI0OTk3IDguNDM3NUM2LjI0OTk3IDguNjIyODcgNi4zMDUyMSA4LjgwMzg2IDYuNDA4MTcgOC45NTgwMUM2LjUxMTE4IDkuMTEyMTggNi42NTc3NiA5LjIzMjc1IDYuODI5MDcgOS4zMDM3MUM3LjAwMDE4IDkuMzc0NSA3LjE4ODQ2IDkuMzkzNDggNy4zNzAwOCA5LjM1NzQyQzcuNTUxOTQgOS4zMjEyNSA3LjcxOTQ0IDkuMjMxNyA3Ljg1MDU1IDkuMTAwNTlDNy45ODE2NiA4Ljk2OTQ4IDguMDcxMjIgOC44MDE5NyA4LjEwNzM5IDguNjIwMTJDOC4xNDM0NCA4LjQzODQ5IDguMTI0NDcgOC4yNTAyIDguMDUzNjggOC4wNzkxQzcuOTgyNzIgNy45MDc4IDcuODYyMTUgNy43NjEyMiA3LjcwNzk4IDcuNjU4MkM3LjU1Mzg0IDcuNTU1MjUgNy4zNzI4MyA3LjUwMDAxIDcuMTg3NDcgNy41WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTE2LjA0MiA1Ljc5NDkyTDE2LjA0MTggMy45NTQzM0wxNC4yMDIxIDMuOTU0MUMxMy44MTI5IDMuOTU0MSAxMy40OTcgMy42MzkyNCAxMy40OTcgMy4yNUMxMy40OTcyIDIuODYwOSAxMy44MTI2IDIuNTQ0NzUgMTQuMjAxOCAyLjU0NDc1SDE2LjA0MThWMC43MDQ3ODZDMTYuMDQxOCAwLjMxNTY0NSAxNi4zNTc0IDAuMDAwMTY0NjIyIDE2Ljc0NjUgMEMxNy4xMzU4IDAgMTcuNDUxMyAwLjMxNTU0MyAxNy40NTEzIDAuNzA0Nzg2VjIuNTQ0NzVIMTkuMjkyMkMxOS42ODEyIDIuNTQ0OTIgMTkuOTk2OCAyLjg2MDU0IDE5Ljk5NyAzLjI0OTU0QzE5Ljk5NyAzLjYzODY4IDE5LjY4MTMgMy45NTQxNiAxOS4yOTIyIDMuOTU0MzNIMTcuNDUxM1Y1Ljc5NTIxQzE3LjQ1MTIgNi4xODQzMiAxNy4xMzYyIDYuNSAxNi43NDcgNi41QzE2LjM1OCA2LjQ5OTg0IDE2LjA0MjEgNi4xODM5MiAxNi4wNDIgNS43OTQ5MloiIGZpbGw9ImJsYWNrIi8+CjwvZz4KPGRlZnM+CjxjbGlwUGF0aCBpZD0iY2xpcDBfMjYzODhfMzcwMCI+CjxyZWN0IHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K');
+  --str-video__icon--recording-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwIDEuODc1QzguMzkzMDMgMS44NzUgNi44MjIxNCAyLjM1MTUyIDUuNDg2IDMuMjQ0MzFDNC4xNDk4NSA0LjEzNzEgMy4xMDg0NCA1LjQwNjA1IDIuNDkzNDggNi44OTA3QzEuODc4NTIgOC4zNzUzNSAxLjcxNzYyIDEwLjAwOSAyLjAzMTEyIDExLjU4NTFDMi4zNDQ2MyAxMy4xNjEyIDMuMTE4NDYgMTQuNjA4OSA0LjI1NDc2IDE1Ljc0NTJDNS4zOTEwNiAxNi44ODE1IDYuODM4OCAxNy42NTU0IDguNDE0OSAxNy45Njg5QzkuOTkwOTkgMTguMjgyNCAxMS42MjQ3IDE4LjEyMTUgMTMuMTA5MyAxNy41MDY1QzE0LjU5NCAxNi44OTE2IDE1Ljg2MjkgMTUuODUwMiAxNi43NTU3IDE0LjUxNEMxNy42NDg1IDEzLjE3NzkgMTguMTI1IDExLjYwNyAxOC4xMjUgMTBDMTguMTIyNyA3Ljg0NTgxIDE3LjI2NiA1Ljc4MDUxIDE1Ljc0MjcgNC4yNTcyN0MxNC4yMTk1IDIuNzM0MDMgMTIuMTU0MiAxLjg3NzI3IDEwIDEuODc1Wk0xMCAxNi44NzVDOC42NDAyNiAxNi44NzUgNy4zMTEwNSAxNi40NzE4IDYuMTgwNDYgMTUuNzE2NEM1LjA0OTg3IDE0Ljk2MDkgNC4xNjg2OCAxMy44ODcyIDMuNjQ4MzMgMTIuNjMwOUMzLjEyNzk4IDExLjM3NDcgMi45OTE4MyA5Ljk5MjM3IDMuMjU3MSA4LjY1ODc1QzMuNTIyMzggNy4zMjUxNCA0LjE3NzE2IDYuMTAwMTMgNS4xMzg2NCA1LjEzODY0QzYuMTAwMTMgNC4xNzcxNSA3LjMyNTE0IDMuNTIyMzcgOC42NTg3NiAzLjI1NzFDOS45OTIzOCAyLjk5MTgzIDExLjM3NDcgMy4xMjc5OCAxMi42MzEgMy42NDgzM0MxMy44ODcyIDQuMTY4NjggMTQuOTYwOSA1LjA0OTg3IDE1LjcxNjQgNi4xODA0NUMxNi40NzE4IDcuMzExMDQgMTYuODc1IDguNjQwMjUgMTYuODc1IDEwQzE2Ljg3MjkgMTEuODIyNyAxNi4xNDc5IDEzLjU3MDIgMTQuODU5MSAxNC44NTkxQzEzLjU3MDIgMTYuMTQ3OSAxMS44MjI3IDE2Ljg3MjkgMTAgMTYuODc1WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTEwIDE1LjYyNUMxMy4xMDY2IDE1LjYyNSAxNS42MjUgMTMuMTA2NiAxNS42MjUgMTBDMTUuNjI1IDYuODkzNCAxMy4xMDY2IDQuMzc1IDEwIDQuMzc1QzYuODkzNCA0LjM3NSA0LjM3NSA2Ljg5MzQgNC4zNzUgMTBDNC4zNzUgMTMuMTA2NiA2Ljg5MzQgMTUuNjI1IDEwIDE1LjYyNVoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--recording-on: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2LjU2MjUgMTBDMTYuNTYyNSA2LjM3NTYzIDEzLjYyNDQgMy40Mzc1IDEwIDMuNDM3NUM2LjM3NTYzIDMuNDM3NSAzLjQzNzUgNi4zNzU2MyAzLjQzNzUgMTBDMy40Mzc1IDEzLjYyNDQgNi4zNzU2MyAxNi41NjI1IDEwIDE2LjU2MjVDMTMuNjI0NCAxNi41NjI1IDE2LjU2MjUgMTMuNjI0NCAxNi41NjI1IDEwWk0xOC40Mzc1IDEwQzE4LjQzNzUgMTQuNjU5OSAxNC42NTk5IDE4LjQzNzUgMTAgMTguNDM3NUM1LjM0MDEgMTguNDM3NSAxLjU2MjUgMTQuNjU5OSAxLjU2MjUgMTBDMS41NjI1IDUuMzQwMSA1LjM0MDEgMS41NjI1IDEwIDEuNTYyNUMxNC42NTk5IDEuNTYyNSAxOC40Mzc1IDUuMzQwMSAxOC40Mzc1IDEwWiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTEyLjE4NzUgNi44NzVINy44MTI1QzcuMjk0NzMgNi44NzUgNi44NzUgNy4yOTQ3MyA2Ljg3NSA3LjgxMjVWMTIuMTg3NUM2Ljg3NSAxMi43MDUzIDcuMjk0NzMgMTMuMTI1IDcuODEyNSAxMy4xMjVIMTIuMTg3NUMxMi43MDUzIDEzLjEyNSAxMy4xMjUgMTIuNzA1MyAxMy4xMjUgMTIuMTg3NVY3LjgxMjVDMTMuMTI1IDcuMjk0NzMgMTIuNzA1MyA2Ljg3NSAxMi4xODc1IDYuODc1WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==');
+  --str-video__icon--speaker: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M15.625 8.125V11.875M18.125 6.875V13.125M6.875 13.125H3.125C2.95924 13.125 2.80027 13.0592 2.68306 12.9419C2.56585 12.8247 2.5 12.6658 2.5 12.5V7.5C2.5 7.33424 2.56585 7.17527 2.68306 7.05806C2.80027 6.94085 2.95924 6.875 3.125 6.875H6.875L12.5 2.5V17.5L6.875 13.125Z%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--stats: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzI2Mzk3Xzg4MDYpIj4KPHBhdGggZD0iTTE4LjI0NTMgNi40MjU3M0MxOC42NDY3IDYuMDI0MjYgMTkuMjk3NSA2LjAyNDI2IDE5LjY5OSA2LjQyNTczQzIwLjEwMDQgNi44MjcyIDIwLjEwMDQgNy40Nzc5NiAxOS42OTkgNy44Nzk0M0wxMS40NzQ3IDE2LjEwMzdDMTEuMDczMiAxNi41MDUyIDEwLjQyMjUgMTYuNTA1MiAxMC4wMjEgMTYuMTAzN0w3LjMyMTA4IDEzLjQwMzhMMS44Nzk3MyAxOC44NDUxQzEuNDc4MjYgMTkuMjQ2NiAwLjgyNzUwMiAxOS4yNDY2IDAuNDI2MDMxIDE4Ljg0NTFDMC4wMjQ1NTkyIDE4LjQ0MzYgMC4wMjQ1NTkzIDE3Ljc5MjkgMC40MjYwMzEgMTcuMzkxNEw2LjU5NDIzIDExLjIyMzJMNi42NzI1MyAxMS4xNTIzQzcuMDc2MzEgMTAuODIzMiA3LjY3MTY1IDEwLjg0NjkgOC4wNDc5MyAxMS4yMjMyTDEwLjc0NzkgMTMuOTIzMUwxOC4yNDUzIDYuNDI1NzNaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNMTQuODk5NyA0LjI4ODE1QzE0LjkwMDUgNC4zOTkyIDE0Ljg2NjggNC41MDc3NiAxNC44MDMxIDQuNTk4NzNDMTQuNzM5NCA0LjY4OTcxIDE0LjY0ODkgNC43NTg1OSAxNC41NDQzIDQuNzk1NzlMMTIuMzk3MyA1LjU3NjU2TDExLjYxNjkgNy43MjMyM0MxMS41Nzg0IDcuODI2ODYgMTEuNTA5MSA3LjkxNjIzIDExLjQxODQgNy45NzkzNUMxMS4zMjc3IDguMDQyNDYgMTEuMjE5OCA4LjA3NjI5IDExLjEwOTIgOC4wNzYyOUMxMC45OTg3IDguMDc2MjkgMTAuODkwOCA4LjA0MjQ2IDEwLjggNy45NzkzNUMxMC43MDkzIDcuOTE2MjMgMTAuNjQgNy44MjY4NiAxMC42MDE2IDcuNzIzMjNMOS44MjExNSA1LjU3NjIyTDcuNjc0MTQgNC43OTU3OUM3LjU3MDUxIDQuNzU3MzMgNy40ODExMyA0LjY4ODA3IDcuNDE4MDIgNC41OTczMkM3LjM1NDkxIDQuNTA2NTcgNy4zMjEwOCA0LjM5ODY4IDcuMzIxMDggNC4yODgxNUM3LjMyMTA4IDQuMTc3NjEgNy4zNTQ5MSA0LjA2OTcyIDcuNDE4MDIgMy45Nzg5N0M3LjQ4MTEzIDMuODg4MjIgNy41NzA1MSAzLjgxODk2IDcuNjc0MTQgMy43ODA1TDkuODIxMTUgMy4wMDAwN0wxMC42MDE2IDAuODUzMDZDMTAuNjQgMC43NDk0MzEgMTAuNzA5MyAwLjY2MDA1NyAxMC44IDAuNTk2OTQzQzEwLjg5MDggMC41MzM4MjkgMTAuOTk4NyAwLjUgMTEuMTA5MiAwLjVDMTEuMjE5OCAwLjUgMTEuMzI3NyAwLjUzMzgyOSAxMS40MTg0IDAuNTk2OTQzQzExLjUwOTEgMC42NjAwNTcgMTEuNTc4NCAwLjc0OTQzMSAxMS42MTY5IDAuODUzMDZMMTIuMzk3NiAzLjAwMDA3TDE0LjU0NDMgMy43ODA1QzE0LjY0ODkgMy44MTc3IDE0LjczOTQgMy44ODY1OCAxNC44MDMxIDMuOTc3NTZDMTQuODY2OCA0LjA2ODU0IDE0LjkwMDUgNC4xNzcwOSAxNC44OTk3IDQuMjg4MTVaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNNS40MTU1OCA3LjgyOTMxQzUuNDE2MiA3LjkwODY5IDUuMzkyMDcgNy45ODYyOSA1LjM0NjU3IDguMDUxMzJDNS4zMDEwNiA4LjExNjM1IDUuMjM2NDIgOC4xNjU1OSA1LjE2MTY1IDguMTkyMThMMy42Mjc0MiA4Ljc1MDI4TDMuMDY5NzMgMTAuMjg0N0MzLjA0MjI1IDEwLjM1ODggMi45OTI3NSAxMC40MjI3IDIuOTI3OTEgMTAuNDY3OEMyLjg2MzA2IDEwLjUxMjkgMi43ODU5NiAxMC41MzcxIDIuNzA2OTcgMTAuNTM3MUMyLjYyNzk4IDEwLjUzNzEgMi41NTA4OSAxMC41MTI5IDIuNDg2MDQgMTAuNDY3OEMyLjQyMTE5IDEwLjQyMjcgMi4zNzE3IDEwLjM1ODggMi4zNDQyMSAxMC4yODQ3TDEuNzg2NTMgOC43NTAwM0wwLjI1MjI5MyA4LjE5MjE4QzAuMTc4MjQxIDguMTY0NjkgMC4xMTQzNzUgOC4xMTUxOCAwLjA2OTI3NDQgOC4wNTAzMUMwLjAyNDE3NCA3Ljk4NTQ0IDAgNy45MDgzMiAwIDcuODI5MzFDMCA3Ljc1MDMgMC4wMjQxNzQgNy42NzMxOCAwLjA2OTI3NDQgNy42MDgzMUMwLjExNDM3NSA3LjU0MzQ0IDAuMTc4MjQxIDcuNDkzOTQgMC4yNTIyOTMgNy40NjY0NEwxLjc4NjUzIDYuOTA4NTlMMi4zNDQyMSA1LjM3Mzg4QzIuMzcxNyA1LjI5OTgxIDIuNDIxMTkgNS4yMzU5MiAyLjQ4NjA0IDUuMTkwODFDMi41NTA4OSA1LjE0NTcgMi42Mjc5OCA1LjEyMTUxIDIuNzA2OTcgNS4xMjE1MUMyLjc4NTk2IDUuMTIxNTEgMi44NjMwNiA1LjE0NTcgMi45Mjc5MSA1LjE5MDgxQzIuOTkyNzUgNS4yMzU5MiAzLjA0MjI1IDUuMjk5ODEgMy4wNjk3MyA1LjM3Mzg4TDMuNjI3NjYgNi45MDg1OUw1LjE2MTY1IDcuNDY2NDRDNS4yMzY0MiA3LjQ5MzAzIDUuMzAxMDYgNy41NDIyNyA1LjM0NjU3IDcuNjA3M0M1LjM5MjA3IDcuNjcyMzMgNS40MTYyIDcuNzQ5OTMgNS40MTU1OCA3LjgyOTMxWiIgZmlsbD0iYmxhY2siLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yNjM5N184ODA2Ij4KPHJlY3Qgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=');
+  --str-video__icon--screen-share-on: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M13.125 17.5C13.125 17.6658 13.0592 17.8247 12.9419 17.9419C12.8247 18.0592 12.6658 18.125 12.5 18.125H7.5C7.33424 18.125 7.17527 18.0592 7.05806 17.9419C6.94085 17.8247 6.875 17.6658 6.875 17.5C6.875 17.3342 6.94085 17.1753 7.05806 17.0581C7.17527 16.9408 7.33424 16.875 7.5 16.875H12.5C12.6658 16.875 12.8247 16.9408 12.9419 17.0581C13.0592 17.1753 13.125 17.3342 13.125 17.5ZM18.125 5V13.75C18.125 14.2473 17.9275 14.7242 17.5758 15.0758C17.2242 15.4275 16.7473 15.625 16.25 15.625H3.75C3.25272 15.625 2.77581 15.4275 2.42417 15.0758C2.07254 14.7242 1.875 14.2473 1.875 13.75V5C1.875 4.50272 2.07254 4.02581 2.42417 3.67417C2.77581 3.32254 3.25272 3.125 3.75 3.125H16.25C16.7473 3.125 17.2242 3.32254 17.5758 3.67417C17.9275 4.02581 18.125 4.50272 18.125 5ZM12.3172 8.30781L10.4422 6.43281C10.3841 6.3747 10.3152 6.3286 10.2393 6.29715C10.1635 6.2657 10.0821 6.24951 10 6.24951C9.91787 6.24951 9.83654 6.2657 9.76066 6.29715C9.68479 6.3286 9.61586 6.3747 9.55781 6.43281L7.68281 8.30781C7.56554 8.42509 7.49965 8.58415 7.49965 8.75C7.49965 8.91585 7.56554 9.07491 7.68281 9.19219C7.80009 9.30946 7.95915 9.37535 8.125 9.37535C8.29085 9.37535 8.44991 9.30946 8.56719 9.19219L9.375 8.38359V11.875C9.375 12.0408 9.44085 12.1997 9.55806 12.3169C9.67527 12.4342 9.83424 12.5 10 12.5C10.1658 12.5 10.3247 12.4342 10.4419 12.3169C10.5592 12.1997 10.625 12.0408 10.625 11.875V8.38359L11.4328 9.19219C11.4909 9.25026 11.5598 9.29632 11.6357 9.32775C11.7116 9.35917 11.7929 9.37535 11.875 9.37535C11.9571 9.37535 12.0384 9.35917 12.1143 9.32775C12.1902 9.29632 12.2591 9.25026 12.3172 9.19219C12.3753 9.13412 12.4213 9.06518 12.4527 8.98931C12.4842 8.91344 12.5003 8.83212 12.5003 8.75C12.5003 8.66788 12.4842 8.58656 12.4527 8.51069C12.4213 8.43482 12.3753 8.36588 12.3172 8.30781Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--screen-share-off: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjEyNSAxNy41QzEzLjEyNSAxNy42NjU4IDEzLjA1OTIgMTcuODI0NyAxMi45NDE5IDE3Ljk0MTlDMTIuODI0NyAxOC4wNTkyIDEyLjY2NTggMTguMTI1IDEyLjUgMTguMTI1SDcuNUM3LjMzNDI0IDE4LjEyNSA3LjE3NTI3IDE4LjA1OTIgNy4wNTgwNiAxNy45NDE5QzYuOTQwODUgMTcuODI0NyA2Ljg3NSAxNy42NjU4IDYuODc1IDE3LjVDNi44NzUgMTcuMzM0MiA2Ljk0MDg1IDE3LjE3NTMgNy4wNTgwNiAxNy4wNTgxQzcuMTc1MjcgMTYuOTQwOCA3LjMzNDI0IDE2Ljg3NSA3LjUgMTYuODc1SDEyLjVDMTIuNjY1OCAxNi44NzUgMTIuODI0NyAxNi45NDA4IDEyLjk0MTkgMTcuMDU4MUMxMy4wNTkyIDE3LjE3NTMgMTMuMTI1IDE3LjMzNDIgMTMuMTI1IDE3LjVaTTE4LjEyNSA1VjEzLjc1QzE4LjEyNSAxNC4yNDczIDE3LjkyNzUgMTQuNzI0MiAxNy41NzU4IDE1LjA3NThDMTcuMjI0MiAxNS40Mjc1IDE2Ljc0NzMgMTUuNjI1IDE2LjI1IDE1LjYyNUgzLjc1QzMuMjUyNzIgMTUuNjI1IDIuNzc1ODEgMTUuNDI3NSAyLjQyNDE3IDE1LjA3NThDMi4wNzI1NCAxNC43MjQyIDEuODc1IDE0LjI0NzMgMS44NzUgMTMuNzVWNUMxLjg3NSA0LjUwMjcyIDIuMDcyNTQgNC4wMjU4MSAyLjQyNDE3IDMuNjc0MTdDMi43NzU4MSAzLjMyMjU0IDMuMjUyNzIgMy4xMjUgMy43NSAzLjEyNUgxNi4yNUMxNi43NDczIDMuMTI1IDE3LjIyNDIgMy4zMjI1NCAxNy41NzU4IDMuNjc0MTdDMTcuOTI3NSA0LjAyNTgxIDE4LjEyNSA0LjUwMjcyIDE4LjEyNSA1Wk0xMi4zMTcyIDguMzA3ODFMMTAuNDQyMiA2LjQzMjgxQzEwLjM4NDEgNi4zNzQ3IDEwLjMxNTIgNi4zMjg2IDEwLjIzOTMgNi4yOTcxNUMxMC4xNjM1IDYuMjY1NyAxMC4wODIxIDYuMjQ5NTEgMTAgNi4yNDk1MUM5LjkxNzg3IDYuMjQ5NTEgOS44MzY1NCA2LjI2NTcgOS43NjA2NiA2LjI5NzE1QzkuNjg0NzkgNi4zMjg2IDkuNjE1ODYgNi4zNzQ3IDkuNTU3ODEgNi40MzI4MUw3LjY4MjgxIDguMzA3ODFDNy41NjU1NCA4LjQyNTA5IDcuNDk5NjUgOC41ODQxNSA3LjQ5OTY1IDguNzVDNy40OTk2NSA4LjkxNTg1IDcuNTY1NTQgOS4wNzQ5MSA3LjY4MjgxIDkuMTkyMTlDNy44MDAwOSA5LjMwOTQ2IDcuOTU5MTUgOS4zNzUzNSA4LjEyNSA5LjM3NTM1QzguMjkwODUgOS4zNzUzNSA4LjQ0OTkxIDkuMzA5NDYgOC41NjcxOSA5LjE5MjE5TDkuMzc1IDguMzgzNTlWMTEuODc1QzkuMzc1IDEyLjA0MDggOS40NDA4NSAxMi4xOTk3IDkuNTU4MDYgMTIuMzE2OUM5LjY3NTI3IDEyLjQzNDIgOS44MzQyNCAxMi41IDEwIDEyLjVDMTAuMTY1OCAxMi41IDEwLjMyNDcgMTIuNDM0MiAxMC40NDE5IDEyLjMxNjlDMTAuNTU5MiAxMi4xOTk3IDEwLjYyNSAxMi4wNDA4IDEwLjYyNSAxMS44NzVWOC4zODM1OUwxMS40MzI4IDkuMTkyMTlDMTEuNDkwOSA5LjI1MDI2IDExLjU1OTggOS4yOTYzMiAxMS42MzU3IDkuMzI3NzVDMTEuNzExNiA5LjM1OTE3IDExLjc5MjkgOS4zNzUzNSAxMS44NzUgOS4zNzUzNUMxMS45NTcxIDkuMzc1MzUgMTIuMDM4NCA5LjM1OTE3IDEyLjExNDMgOS4zMjc3NUMxMi4xOTAyIDkuMjk2MzIgMTIuMjU5MSA5LjI1MDI2IDEyLjMxNzIgOS4xOTIxOUMxMi4zNzUzIDkuMTM0MTIgMTIuNDIxMyA5LjA2NTE4IDEyLjQ1MjcgOC45ODkzMUMxMi40ODQyIDguOTEzNDQgMTIuNTAwMyA4LjgzMjEyIDEyLjUwMDMgOC43NUMxMi41MDAzIDguNjY3ODggMTIuNDg0MiA4LjU4NjU2IDEyLjQ1MjcgOC41MTA2OUMxMi40MjEzIDguNDM0ODIgMTIuMzc1MyA4LjM2NTg4IDEyLjMxNzIgOC4zMDc4MVoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--blur-icon: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTUuMDAwMDQgMTAuODMzM0M0LjU0MTcxIDEwLjgzMzMgNC4xNjY3MSAxMS4yMDgzIDQuMTY2NzEgMTEuNjY2NkM0LjE2NjcxIDEyLjEyNDkgNC41NDE3MSAxMi40OTk5IDUuMDAwMDQgMTIuNDk5OUM1LjQ1ODM3IDEyLjQ5OTkgNS44MzMzNyAxMi4xMjQ5IDUuODMzMzcgMTEuNjY2NkM1LjgzMzM3IDExLjIwODMgNS40NTgzNyAxMC44MzMzIDUuMDAwMDQgMTAuODMzM1pNNS4wMDAwNCAxNC4xNjY2QzQuNTQxNzEgMTQuMTY2NiA0LjE2NjcxIDE0LjU0MTYgNC4xNjY3MSAxNC45OTk5QzQuMTY2NzEgMTUuNDU4MyA0LjU0MTcxIDE1LjgzMzMgNS4wMDAwNCAxNS44MzMzQzUuNDU4MzcgMTUuODMzMyA1LjgzMzM3IDE1LjQ1ODMgNS44MzMzNyAxNC45OTk5QzUuODMzMzcgMTQuNTQxNiA1LjQ1ODM3IDE0LjE2NjYgNS4wMDAwNCAxNC4xNjY2Wk01LjAwMDA0IDcuNDk5OTJDNC41NDE3MSA3LjQ5OTkyIDQuMTY2NzEgNy44NzQ5MiA0LjE2NjcxIDguMzMzMjVDNC4xNjY3MSA4Ljc5MTU5IDQuNTQxNzEgOS4xNjY1OSA1LjAwMDA0IDkuMTY2NTlDNS40NTgzNyA5LjE2NjU5IDUuODMzMzcgOC43OTE1OSA1LjgzMzM3IDguMzMzMjVDNS44MzMzNyA3Ljg3NDkyIDUuNDU4MzcgNy40OTk5MiA1LjAwMDA0IDcuNDk5OTJaTTIuNTAwMDQgNy45MTY1OUMyLjI2NjcxIDcuOTE2NTkgMi4wODMzNyA4LjA5OTkyIDIuMDgzMzcgOC4zMzMyNUMyLjA4MzM3IDguNTY2NTkgMi4yNjY3MSA4Ljc0OTkyIDIuNTAwMDQgOC43NDk5MkMyLjczMzM3IDguNzQ5OTIgMi45MTY3MSA4LjU2NjU5IDIuOTE2NzEgOC4zMzMyNUMyLjkxNjcxIDguMDk5OTIgMi43MzMzNyA3LjkxNjU5IDIuNTAwMDQgNy45MTY1OVpNNS4wMDAwNCA0LjE2NjU5QzQuNTQxNzEgNC4xNjY1OSA0LjE2NjcxIDQuNTQxNTkgNC4xNjY3MSA0Ljk5OTkyQzQuMTY2NzEgNS40NTgyNSA0LjU0MTcxIDUuODMzMjUgNS4wMDAwNCA1LjgzMzI1QzUuNDU4MzcgNS44MzMyNSA1LjgzMzM3IDUuNDU4MjUgNS44MzMzNyA0Ljk5OTkyQzUuODMzMzcgNC41NDE1OSA1LjQ1ODM3IDQuMTY2NTkgNS4wMDAwNCA0LjE2NjU5Wk0xNy41IDguNzQ5OTJDMTcuNzMzNCA4Ljc0OTkyIDE3LjkxNjcgOC41NjY1OSAxNy45MTY3IDguMzMzMjVDMTcuOTE2NyA4LjA5OTkyIDE3LjczMzQgNy45MTY1OSAxNy41IDcuOTE2NTlDMTcuMjY2NyA3LjkxNjU5IDE3LjA4MzQgOC4wOTk5MiAxNy4wODM0IDguMzMzMjVDMTcuMDgzNCA4LjU2NjU5IDE3LjI2NjcgOC43NDk5MiAxNy41IDguNzQ5OTJaTTExLjY2NjcgNS44MzMyNUMxMi4xMjUgNS44MzMyNSAxMi41IDUuNDU4MjUgMTIuNSA0Ljk5OTkyQzEyLjUgNC41NDE1OSAxMi4xMjUgNC4xNjY1OSAxMS42NjY3IDQuMTY2NTlDMTEuMjA4NCA0LjE2NjU5IDEwLjgzMzQgNC41NDE1OSAxMC44MzM0IDQuOTk5OTJDMTAuODMzNCA1LjQ1ODI1IDExLjIwODQgNS44MzMyNSAxMS42NjY3IDUuODMzMjVaTTExLjY2NjcgMi45MTY1OUMxMS45IDIuOTE2NTkgMTIuMDgzNCAyLjczMzI1IDEyLjA4MzQgMi40OTk5MkMxMi4wODM0IDIuMjY2NTkgMTEuOSAyLjA4MzI1IDExLjY2NjcgMi4wODMyNUMxMS40MzM0IDIuMDgzMjUgMTEuMjUgMi4yNjY1OSAxMS4yNSAyLjQ5OTkyQzExLjI1IDIuNzMzMjUgMTEuNDMzNCAyLjkxNjU5IDExLjY2NjcgMi45MTY1OVpNMi41MDAwNCAxMS4yNDk5QzIuMjY2NzEgMTEuMjQ5OSAyLjA4MzM3IDExLjQzMzMgMi4wODMzNyAxMS42NjY2QzIuMDgzMzcgMTEuODk5OSAyLjI2NjcxIDEyLjA4MzMgMi41MDAwNCAxMi4wODMzQzIuNzMzMzcgMTIuMDgzMyAyLjkxNjcxIDExLjg5OTkgMi45MTY3MSAxMS42NjY2QzIuOTE2NzEgMTEuNDMzMyAyLjczMzM3IDExLjI0OTkgMi41MDAwNCAxMS4yNDk5Wk04LjMzMzM3IDE3LjA4MzNDOC4xMDAwNCAxNy4wODMzIDcuOTE2NzEgMTcuMjY2NiA3LjkxNjcxIDE3LjQ5OTlDNy45MTY3MSAxNy43MzMzIDguMTAwMDQgMTcuOTE2NiA4LjMzMzM3IDE3LjkxNjZDOC41NjY3MSAxNy45MTY2IDguNzUwMDQgMTcuNzMzMyA4Ljc1MDA0IDE3LjQ5OTlDOC43NTAwNCAxNy4yNjY2IDguNTY2NzEgMTcuMDgzMyA4LjMzMzM3IDE3LjA4MzNaTTguMzMzMzcgMi45MTY1OUM4LjU2NjcxIDIuOTE2NTkgOC43NTAwNCAyLjczMzI1IDguNzUwMDQgMi40OTk5MkM4Ljc1MDA0IDIuMjY2NTkgOC41NjY3MSAyLjA4MzI1IDguMzMzMzcgMi4wODMyNUM4LjEwMDA0IDIuMDgzMjUgNy45MTY3MSAyLjI2NjU5IDcuOTE2NzEgMi40OTk5MkM3LjkxNjcxIDIuNzMzMjUgOC4xMDAwNCAyLjkxNjU5IDguMzMzMzcgMi45MTY1OVpNOC4zMzMzNyA1LjgzMzI1QzguNzkxNzEgNS44MzMyNSA5LjE2NjcxIDUuNDU4MjUgOS4xNjY3MSA0Ljk5OTkyQzkuMTY2NzEgNC41NDE1OSA4Ljc5MTcxIDQuMTY2NTkgOC4zMzMzNyA0LjE2NjU5QzcuODc1MDQgNC4xNjY1OSA3LjUwMDA0IDQuNTQxNTkgNy41MDAwNCA0Ljk5OTkyQzcuNTAwMDQgNS40NTgyNSA3Ljg3NTA0IDUuODMzMjUgOC4zMzMzNyA1LjgzMzI1Wk04LjMzMzM3IDEwLjQxNjZDNy42NDE3MSAxMC40MTY2IDcuMDgzMzcgMTAuOTc0OSA3LjA4MzM3IDExLjY2NjZDNy4wODMzNyAxMi4zNTgzIDcuNjQxNzEgMTIuOTE2NiA4LjMzMzM3IDEyLjkxNjZDOS4wMjUwNCAxMi45MTY2IDkuNTgzMzcgMTIuMzU4MyA5LjU4MzM3IDExLjY2NjZDOS41ODMzNyAxMC45NzQ5IDkuMDI1MDQgMTAuNDE2NiA4LjMzMzM3IDEwLjQxNjZaTTE1IDEwLjgzMzNDMTQuNTQxNyAxMC44MzMzIDE0LjE2NjcgMTEuMjA4MyAxNC4xNjY3IDExLjY2NjZDMTQuMTY2NyAxMi4xMjQ5IDE0LjU0MTcgMTIuNDk5OSAxNSAxMi40OTk5QzE1LjQ1ODQgMTIuNDk5OSAxNS44MzM0IDEyLjEyNDkgMTUuODMzNCAxMS42NjY2QzE1LjgzMzQgMTEuMjA4MyAxNS40NTg0IDEwLjgzMzMgMTUgMTAuODMzM1pNMTUgMTQuMTY2NkMxNC41NDE3IDE0LjE2NjYgMTQuMTY2NyAxNC41NDE2IDE0LjE2NjcgMTQuOTk5OUMxNC4xNjY3IDE1LjQ1ODMgMTQuNTQxNyAxNS44MzMzIDE1IDE1LjgzMzNDMTUuNDU4NCAxNS44MzMzIDE1LjgzMzQgMTUuNDU4MyAxNS44MzM0IDE0Ljk5OTlDMTUuODMzNCAxNC41NDE2IDE1LjQ1ODQgMTQuMTY2NiAxNSAxNC4xNjY2Wk0xNSA3LjQ5OTkyQzE0LjU0MTcgNy40OTk5MiAxNC4xNjY3IDcuODc0OTIgMTQuMTY2NyA4LjMzMzI1QzE0LjE2NjcgOC43OTE1OSAxNC41NDE3IDkuMTY2NTkgMTUgOS4xNjY1OUMxNS40NTg0IDkuMTY2NTkgMTUuODMzNCA4Ljc5MTU5IDE1LjgzMzQgOC4zMzMyNUMxNS44MzM0IDcuODc0OTIgMTUuNDU4NCA3LjQ5OTkyIDE1IDcuNDk5OTJaTTE1IDQuMTY2NTlDMTQuNTQxNyA0LjE2NjU5IDE0LjE2NjcgNC41NDE1OSAxNC4xNjY3IDQuOTk5OTJDMTQuMTY2NyA1LjQ1ODI1IDE0LjU0MTcgNS44MzMyNSAxNSA1LjgzMzI1QzE1LjQ1ODQgNS44MzMyNSAxNS44MzM0IDUuNDU4MjUgMTUuODMzNCA0Ljk5OTkyQzE1LjgzMzQgNC41NDE1OSAxNS40NTg0IDQuMTY2NTkgMTUgNC4xNjY1OVpNMTcuNSAxMS4yNDk5QzE3LjI2NjcgMTEuMjQ5OSAxNy4wODM0IDExLjQzMzMgMTcuMDgzNCAxMS42NjY2QzE3LjA4MzQgMTEuODk5OSAxNy4yNjY3IDEyLjA4MzMgMTcuNSAxMi4wODMzQzE3LjczMzQgMTIuMDgzMyAxNy45MTY3IDExLjg5OTkgMTcuOTE2NyAxMS42NjY2QzE3LjkxNjcgMTEuNDMzMyAxNy43MzM0IDExLjI0OTkgMTcuNSAxMS4yNDk5Wk0xMS42NjY3IDE0LjE2NjZDMTEuMjA4NCAxNC4xNjY2IDEwLjgzMzQgMTQuNTQxNiAxMC44MzM0IDE0Ljk5OTlDMTAuODMzNCAxNS40NTgzIDExLjIwODQgMTUuODMzMyAxMS42NjY3IDE1LjgzMzNDMTIuMTI1IDE1LjgzMzMgMTIuNSAxNS40NTgzIDEyLjUgMTQuOTk5OUMxMi41IDE0LjU0MTYgMTIuMTI1IDE0LjE2NjYgMTEuNjY2NyAxNC4xNjY2Wk0xMS42NjY3IDE3LjA4MzNDMTEuNDMzNCAxNy4wODMzIDExLjI1IDE3LjI2NjYgMTEuMjUgMTcuNDk5OUMxMS4yNSAxNy43MzMzIDExLjQzMzQgMTcuOTE2NiAxMS42NjY3IDE3LjkxNjZDMTEuOSAxNy45MTY2IDEyLjA4MzQgMTcuNzMzMyAxMi4wODM0IDE3LjQ5OTlDMTIuMDgzNCAxNy4yNjY2IDExLjkgMTcuMDgzMyAxMS42NjY3IDE3LjA4MzNaTTguMzMzMzcgNy4wODMyNUM3LjY0MTcxIDcuMDgzMjUgNy4wODMzNyA3LjY0MTU5IDcuMDgzMzcgOC4zMzMyNUM3LjA4MzM3IDkuMDI0OTIgNy42NDE3MSA5LjU4MzI1IDguMzMzMzcgOS41ODMyNUM5LjAyNTA0IDkuNTgzMjUgOS41ODMzNyA5LjAyNDkyIDkuNTgzMzcgOC4zMzMyNUM5LjU4MzM3IDcuNjQxNTkgOS4wMjUwNCA3LjA4MzI1IDguMzMzMzcgNy4wODMyNVpNOC4zMzMzNyAxNC4xNjY2QzcuODc1MDQgMTQuMTY2NiA3LjUwMDA0IDE0LjU0MTYgNy41MDAwNCAxNC45OTk5QzcuNTAwMDQgMTUuNDU4MyA3Ljg3NTA0IDE1LjgzMzMgOC4zMzMzNyAxNS44MzMzQzguNzkxNzEgMTUuODMzMyA5LjE2NjcxIDE1LjQ1ODMgOS4xNjY3MSAxNC45OTk5QzkuMTY2NzEgMTQuNTQxNiA4Ljc5MTcxIDE0LjE2NjYgOC4zMzMzNyAxNC4xNjY2Wk0xMS42NjY3IDEwLjQxNjZDMTAuOTc1IDEwLjQxNjYgMTAuNDE2NyAxMC45NzQ5IDEwLjQxNjcgMTEuNjY2NkMxMC40MTY3IDEyLjM1ODMgMTAuOTc1IDEyLjkxNjYgMTEuNjY2NyAxMi45MTY2QzEyLjM1ODQgMTIuOTE2NiAxMi45MTY3IDEyLjM1ODMgMTIuOTE2NyAxMS42NjY2QzEyLjkxNjcgMTAuOTc0OSAxMi4zNTg0IDEwLjQxNjYgMTEuNjY2NyAxMC40MTY2Wk0xMS42NjY3IDcuMDgzMjVDMTAuOTc1IDcuMDgzMjUgMTAuNDE2NyA3LjY0MTU5IDEwLjQxNjcgOC4zMzMyNUMxMC40MTY3IDkuMDI0OTIgMTAuOTc1IDkuNTgzMjUgMTEuNjY2NyA5LjU4MzI1QzEyLjM1ODQgOS41ODMyNSAxMi45MTY3IDkuMDI0OTIgMTIuOTE2NyA4LjMzMzI1QzEyLjkxNjcgNy42NDE1OSAxMi4zNTg0IDcuMDgzMjUgMTEuNjY2NyA3LjA4MzI1WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==');
+  --str-video__icon--checkmark: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M3.125 11.25L7.5 15.625L17.5 5.625%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--eye: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE5LjMyMTEgOS43NDY4OEMxOS4yOTM3IDkuNjg1MTYgMTguNjMyIDguMjE3MTkgMTcuMTYwOSA2Ljc0NjA5QzE1LjIwMDggNC43ODU5NCAxMi43MjUgMy43NSA5Ljk5OTk5IDMuNzVDNy4yNzQ5OSAzLjc1IDQuNzk5MjEgNC43ODU5NCAyLjgzOTA1IDYuNzQ2MDlDMS4zNjc5NiA4LjIxNzE5IDAuNzAzMTE4IDkuNjg3NSAwLjY3ODg5OSA5Ljc0Njg4QzAuNjQzMzYyIDkuODI2ODEgMC42MjUgOS45MTMzMSAwLjYyNSAxMC4wMDA4QzAuNjI1IDEwLjA4ODMgMC42NDMzNjIgMTAuMTc0OCAwLjY3ODg5OSAxMC4yNTQ3QzAuNzA2MjQzIDEwLjMxNjQgMS4zNjc5NiAxMS43ODM2IDIuODM5MDUgMTMuMjU0N0M0Ljc5OTIxIDE1LjIxNDEgNy4yNzQ5OSAxNi4yNSA5Ljk5OTk5IDE2LjI1QzEyLjcyNSAxNi4yNSAxNS4yMDA4IDE1LjIxNDEgMTcuMTYwOSAxMy4yNTQ3QzE4LjYzMiAxMS43ODM2IDE5LjI5MzcgMTAuMzE2NCAxOS4zMjExIDEwLjI1NDdDMTkuMzU2NiAxMC4xNzQ4IDE5LjM3NSAxMC4wODgzIDE5LjM3NSAxMC4wMDA4QzE5LjM3NSA5LjkxMzMxIDE5LjM1NjYgOS44MjY4MSAxOS4zMjExIDkuNzQ2ODhaTTkuOTk5OTkgMTMuMTI1QzkuMzgxOTMgMTMuMTI1IDguNzc3NzQgMTIuOTQxNyA4LjI2MzgzIDEyLjU5ODNDNy43NDk5MyAxMi4yNTUgNy4zNDkzOSAxMS43NjY5IDcuMTEyODcgMTEuMTk1OUM2Ljg3NjM0IDEwLjYyNDkgNi44MTQ0NiA5Ljk5NjUzIDYuOTM1MDQgOS4zOTAzNEM3LjA1NTYyIDguNzg0MTUgNy4zNTMyNCA4LjIyNzMzIDcuNzkwMjggNy43OTAyOUM4LjIyNzMyIDcuMzUzMjUgOC43ODQxNCA3LjA1NTYyIDkuMzkwMzMgNi45MzUwNUM5Ljk5NjUyIDYuODE0NDcgMTAuNjI0OSA2Ljg3NjM1IDExLjE5NTkgNy4xMTI4OEMxMS43NjY5IDcuMzQ5NCAxMi4yNTUgNy43NDk5NCAxMi41OTgzIDguMjYzODRDMTIuOTQxNyA4Ljc3Nzc1IDEzLjEyNSA5LjM4MTkzIDEzLjEyNSAxMEMxMy4xMjUgMTAuODI4OCAxMi43OTU4IDExLjYyMzcgMTIuMjA5NyAxMi4yMDk3QzExLjYyMzYgMTIuNzk1OCAxMC44Mjg4IDEzLjEyNSA5Ljk5OTk5IDEzLjEyNVoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--participants: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyLjg0OTIgMTUuMjgzNUMxMi45MTA3IDE1LjM3NzggMTIuOTQ1NiAxNS40ODcgMTIuOTUwMiAxNS41OTk1QzEyLjk1NDggMTUuNzEyIDEyLjkyODkgMTUuODIzNiAxMi44NzUzIDE1LjkyMjZDMTIuODIxNyAxNi4wMjE2IDEyLjc0MjMgMTYuMTA0MyAxMi42NDU2IDE2LjE2MTlDMTIuNTQ4OSAxNi4yMTk1IDEyLjQzODQgMTYuMjQ5OSAxMi4zMjU4IDE2LjI0OTlIMC43OTkyNEMwLjY4NjY1OSAxNi4yNDk5IDAuNTc2MTcxIDE2LjIxOTUgMC40Nzk0NTEgMTYuMTYxOUMwLjM4MjczMSAxNi4xMDQzIDAuMzAzMzY5IDE2LjAyMTYgMC4yNDk3NTEgMTUuOTIyNkMwLjE5NjEzMyAxNS44MjM2IDAuMTcwMjUgMTUuNzEyIDAuMTc0ODM1IDE1LjU5OTVDMC4xNzk0MjEgMTUuNDg3IDAuMjE0MzA1IDE1LjM3NzggMC4yNzU4MDMgMTUuMjgzNUMxLjE1NTU3IDEzLjkyOTMgMi40NDk2MiAxMi44OTU5IDMuOTY0ODcgMTIuMzM3NEMzLjEyNzIxIDExLjc3OTggMi40OTEyNSAxMC45Njc0IDIuMTUxMDQgMTAuMDIwM0MxLjgxMDgyIDkuMDczMjUgMS43ODQ0MSA4LjA0MTg1IDIuMDc1NzIgNy4wNzg2MkMyLjM2NzAyIDYuMTE1NCAyLjk2MDU3IDUuMjcxNDkgMy43Njg1OSA0LjY3MTY5QzQuNTc2NjIgNC4wNzE4OSA1LjU1NjIxIDMuNzQ4MDUgNi41NjI1MiAzLjc0ODA1QzcuNTY4ODMgMy43NDgwNSA4LjU0ODQzIDQuMDcxODkgOS4zNTY0NSA0LjY3MTY5QzEwLjE2NDUgNS4yNzE0OSAxMC43NTggNi4xMTU0IDExLjA0OTMgNy4wNzg2MkMxMS4zNDA2IDguMDQxODUgMTEuMzE0MiA5LjA3MzI1IDEwLjk3NCAxMC4wMjAzQzEwLjYzMzggMTAuOTY3NCA5Ljk5Nzg0IDExLjc3OTggOS4xNjAxOCAxMi4zMzc0QzEwLjY3NTQgMTIuODk1OSAxMS45Njk1IDEzLjkyOTMgMTIuODQ5MiAxNS4yODM1Wk0xOS43MTcyIDE1LjI3MThDMTguODM3MiAxMy45MjMzIDE3LjU0NiAxMi44OTQzIDE2LjAzNTIgMTIuMzM3NEMxNy4wMjQxIDExLjY3MTMgMTcuNzIyIDEwLjY1MzQgMTcuOTg2OCA5LjQ5MDg0QzE4LjI1MTYgOC4zMjgzIDE4LjA2MzUgNy4xMDg1MyAxNy40NjA3IDYuMDc5ODFDMTYuODU3OCA1LjA1MTEgMTUuODg1NyA0LjI5MDc2IDE0Ljc0MiAzLjk1MzU3QzEzLjU5ODQgMy42MTYzNyAxMi4zNjkyIDMuNzI3NjYgMTEuMzA0NyA0LjI2NDc5QzExLjI2NCA0LjI4NTgxIDExLjIyODQgNC4zMTU1MiAxMS4yMDA1IDQuMzUxODJDMTEuMTcyNSA0LjM4ODExIDExLjE1MjkgNC40MzAxMSAxMS4xNDMgNC40NzQ4M0MxMS4xMzMxIDQuNTE5NTYgMTEuMTMzMSA0LjU2NTkyIDExLjE0MzEgNC42MTA2MkMxMS4xNTMxIDQuNjU1MzMgMTEuMTcyOCA0LjY5NzI5IDExLjIwMDggNC43MzM1NEMxMS45OTIzIDUuNzIwODkgMTIuNDQ2OSA2LjkzNTc2IDEyLjQ5OCA4LjIwMDE5QzEyLjU0OSA5LjQ2NDYzIDEyLjE5MzggMTAuNzEyMiAxMS40ODQ0IDExLjc2MDFDMTEuNDM4NSAxMS44Mjg2IDExLjQyMTYgMTEuOTEyNCAxMS40MzczIDExLjk5MzNDMTEuNDUyOSAxMi4wNzQyIDExLjQ5OTkgMTIuMTQ1NyAxMS41NjggMTIuMTkyMUMxMi40OTI5IDEyLjgzNzcgMTMuMjg0NyAxMy42NTU1IDEzLjkgMTQuNjAwN0MxNC4xNDgyIDE0Ljk4MDggMTQuMjQ5NSAxNS40MzgxIDE0LjE4NTIgMTUuODg3NEMxNC4xNzc5IDE1LjkzMjEgMTQuMTgwNSAxNS45Nzc5IDE0LjE5MjcgMTYuMDIxNUMxNC4yMDQ4IDE2LjA2NTEgMTQuMjI2MyAxNi4xMDU1IDE0LjI1NTcgMTYuMTRDMTQuMjg1IDE2LjE3NDUgMTQuMzIxNSAxNi4yMDIyIDE0LjM2MjYgMTYuMjIxMkMxNC40MDM4IDE2LjI0MDEgMTQuNDQ4NSAxNi4yNSAxNC40OTM4IDE2LjI0OTlIMTkuMjA0N0MxOS4zNDIzIDE2LjI1IDE5LjQ3NjEgMTYuMjA0NiAxOS41ODUzIDE2LjEyMDhDMTkuNjk0NSAxNi4wMzcxIDE5Ljc3MyAxNS45MTk2IDE5LjgwODYgMTUuNzg2N0MxOS44MzAzIDE1LjY5OTIgMTkuODMzNCAxNS42MDgyIDE5LjgxNzcgMTUuNTE5NUMxOS44MDE5IDE1LjQzMDggMTkuNzY3NyAxNS4zNDY0IDE5LjcxNzIgMTUuMjcxOFoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--verified: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2LjI1IDMuMTI1SDMuNzVDMy40MTg0OCAzLjEyNSAzLjEwMDU0IDMuMjU2NyAyLjg2NjEyIDMuNDkxMTJDMi42MzE3IDMuNzI1NTQgMi41IDQuMDQzNDggMi41IDQuMzc1VjguNzVDMi41IDEyLjg2ODcgNC40OTM3NSAxNS4zNjQ4IDYuMTY2NDEgMTYuNzMzNkM3Ljk2Nzk3IDE4LjIwNyA5Ljc2MDE2IDE4LjcwNyA5LjgzODI4IDE4LjcyODFDOS45NDU3IDE4Ljc1NzMgMTAuMDU5IDE4Ljc1NzMgMTAuMTY2NCAxOC43MjgxQzEwLjI0NDUgMTguNzA3IDEyLjAzNDQgMTguMjA3IDEzLjgzODMgMTYuNzMzNkMxNS41MDYzIDE1LjM2NDggMTcuNSAxMi44Njg3IDE3LjUgOC43NVY0LjM3NUMxNy41IDQuMDQzNDggMTcuMzY4MyAzLjcyNTU0IDE3LjEzMzkgMy40OTExMkMxNi44OTk1IDMuMjU2NyAxNi41ODE1IDMuMTI1IDE2LjI1IDMuMTI1Wk0xMy41Njg3IDguNTY3MTlMOS4xOTM3NSAxMi45NDIyQzkuMTM1NyAxMy4wMDAzIDkuMDY2NzcgMTMuMDQ2NCA4Ljk5MDkgMTMuMDc3OUM4LjkxNTAzIDEzLjEwOTMgOC44MzM3IDEzLjEyNTUgOC43NTE1NiAxMy4xMjU1QzguNjY5NDMgMTMuMTI1NSA4LjU4ODEgMTMuMTA5MyA4LjUxMjIyIDEzLjA3NzlDOC40MzYzNSAxMy4wNDY0IDguMzY3NDIgMTMuMDAwMyA4LjMwOTM3IDEyLjk0MjJMNi40MzQzOCAxMS4wNjcyQzYuMzE3MSAxMC45NDk5IDYuMjUxMjEgMTAuNzkwOSA2LjI1MTIxIDEwLjYyNUM2LjI1MTIxIDEwLjQ1OTEgNi4zMTcxIDEwLjMwMDEgNi40MzQzOCAxMC4xODI4QzYuNTUxNjUgMTAuMDY1NSA2LjcxMDcxIDkuOTk5NjUgNi44NzY1NiA5Ljk5OTY1QzcuMDQyNDEgOS45OTk2NSA3LjIwMTQ3IDEwLjA2NTUgNy4zMTg3NSAxMC4xODI4TDguNzUgMTEuNjE2NEwxMi42ODI4IDcuNjgyODFDMTIuNzQwOSA3LjYyNDc0IDEyLjgwOTggNy41Nzg2OCAxMi44ODU3IDcuNTQ3MjVDMTIuOTYxNiA3LjUxNTgzIDEzLjA0MjkgNy40OTk2NSAxMy4xMjUgNy40OTk2NUMxMy4yMDcxIDcuNDk5NjUgMTMuMjg4NCA3LjUxNTgzIDEzLjM2NDMgNy41NDcyNUMxMy40NDAyIDcuNTc4NjggMTMuNTA5MSA3LjYyNDc0IDEzLjU2NzIgNy42ODI4MUMxMy42MjUzIDcuNzQwODggMTMuNjcxMyA3LjgwOTgyIDEzLjcwMjcgNy44ODU2OUMxMy43MzQyIDcuOTYxNTYgMTMuNzUwMyA4LjA0Mjg4IDEzLjc1MDMgOC4xMjVDMTMuNzUwMyA4LjIwNzEyIDEzLjczNDIgOC4yODg0NCAxMy43MDI3IDguMzY0MzFDMTMuNjcxMyA4LjQ0MDE4IDEzLjYyNTMgOC41MDkxMiAxMy41NjcyIDguNTY3MTlIMTMuNTY4N1oiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--star-filled: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE4LjMwMzkgOC45NzI3NEwxNC43ODgyIDEyLjAwNjNMMTUuODU5MyAxNi41NDMxQzE1LjkxODQgMTYuNzg5MyAxNS45MDMyIDE3LjA0NzYgMTUuODE1NiAxNy4yODUyQzE1LjcyOCAxNy41MjI5IDE1LjU3MTkgMTcuNzI5MiAxNS4zNjcxIDE3Ljg3ODJDMTUuMTYyMyAxOC4wMjcyIDE0LjkxNzkgMTguMTEyMSAxNC42NjQ4IDE4LjEyMjJDMTQuNDExOCAxOC4xMzI0IDE0LjE2MTQgMTguMDY3MyAxMy45NDUzIDE3LjkzNTJMOS45OTk5NSAxNS41MDcxTDYuMDUyMyAxNy45MzUyQzUuODM2MjIgMTguMDY2NiA1LjU4NjEzIDE4LjEzMSA1LjMzMzUgMTguMTIwNUM1LjA4MDg3IDE4LjExIDQuODM3IDE4LjAyNDkgNC42MzI2MSAxNy44NzYxQzQuNDI4MjIgMTcuNzI3MiA0LjI3MjQzIDE3LjUyMTIgNC4xODQ4OCAxNy4yODRDNC4wOTczMiAxNy4wNDY4IDQuMDgxOTEgMTYuNzg5IDQuMTQwNTggMTYuNTQzMUw1LjIxNTU4IDEyLjAwNjNMMS42OTk5NSA4Ljk3Mjc0QzEuNTA4NzggOC44MDc1MiAxLjM3MDUyIDguNTg5NjMgMS4zMDI0NCA4LjM0NjI5QzEuMjM0MzYgOC4xMDI5NiAxLjIzOTQ3IDcuODQ0OTYgMS4zMTcxNSA3LjYwNDUyQzEuMzk0ODMgNy4zNjQwNyAxLjU0MTYyIDcuMTUxODQgMS43MzkxOSA2Ljk5NDMyQzEuOTM2NzcgNi44MzY4MSAyLjE3NjM3IDYuNzQwOTkgMi40MjgwOCA2LjcxODg0TDcuMDM3NDUgNi4zNDY5Nkw4LjgxNTU4IDIuMDQzODRDOC45MTE4MiAxLjgwOTMyIDkuMDc1NjMgMS42MDg3MiA5LjI4NjE4IDEuNDY3NTRDOS40OTY3MyAxLjMyNjM2IDkuNzQ0NSAxLjI1MDk4IDkuOTk4IDEuMjUwOThDMTAuMjUxNSAxLjI1MDk4IDEwLjQ5OTMgMS4zMjYzNiAxMC43MDk4IDEuNDY3NTRDMTAuOTIwNCAxLjYwODcyIDExLjA4NDIgMS44MDkzMiAxMS4xODA0IDIuMDQzODRMMTIuOTU3OCA2LjM0Njk2TDE3LjU2NzEgNi43MTg4NEMxNy44MTkzIDYuNzQwMTcgMTguMDU5NiA2LjgzNTQ1IDE4LjI1NzkgNi45OTI3NUMxOC40NTYyIDcuMTUwMDUgMTguNjAzNyA3LjM2MjM2IDE4LjY4MTkgNy42MDMxQzE4Ljc2IDcuODQzODMgMTguNzY1NCA4LjEwMjI4IDE4LjY5NzMgOC4zNDYwNkMxOC42MjkyIDguNTg5ODQgMTguNDkwNyA4LjgwODExIDE4LjI5OTIgOC45NzM1MkwxOC4zMDM5IDguOTcyNzRaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K');
+  --str-video__icon--feedback: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath fill-rule=%22evenodd%22 clip-rule=%22evenodd%22 d=%22M10.3125 1.875C12.3845 1.875 14.3717 2.69808 15.8368 4.16321C17.3019 5.62834 18.125 7.6155 18.125 9.6875C18.1227 11.7588 17.299 13.7447 15.8344 15.2094C14.3697 16.674 12.3838 17.4977 10.3125 17.5H3.75C3.41848 17.5 3.10063 17.3682 2.86621 17.1338C2.63179 16.8994 2.5 16.5815 2.5 16.25V9.6875C2.5 7.6155 3.32308 5.62834 4.78821 4.16321C6.25334 2.69808 8.2405 1.875 10.3125 1.875ZM10.3394 13.2129C10.168 13.1419 9.97922 13.123 9.79736 13.1592C9.61551 13.1954 9.44873 13.285 9.31763 13.4161C9.18652 13.5472 9.09685 13.714 9.06067 13.8959C9.0245 14.0777 9.04342 14.2666 9.11438 14.4379C9.18533 14.609 9.30521 14.7555 9.45923 14.8584C9.6134 14.9614 9.79505 15.0165 9.98047 15.0165C10.2291 15.0164 10.4675 14.9176 10.6433 14.7418C10.8191 14.566 10.9179 14.3276 10.918 14.079C10.918 13.8936 10.8629 13.7119 10.7599 13.5577C10.6569 13.4037 10.5105 13.2838 10.3394 13.2129ZM9.98047 5.64148C8.25703 5.64148 6.85547 6.9032 6.85547 8.45398V8.76648C6.85551 8.93218 6.9214 9.0912 7.03857 9.20837C7.15577 9.32549 7.31478 9.39148 7.48047 9.39148C7.64617 9.39144 7.80519 9.32555 7.92236 9.20837C8.03954 9.0912 8.10543 8.93218 8.10547 8.76648V8.45398C8.10547 7.5946 8.94688 6.89148 9.98047 6.89148C11.014 6.89155 11.8555 7.59465 11.8555 8.45398C11.8554 9.31324 11.0139 10.0164 9.98047 10.0165C9.81471 10.0165 9.65578 10.0824 9.53857 10.1996C9.42136 10.3168 9.35547 10.4757 9.35547 10.6415V11.2665C9.35551 11.4322 9.4214 11.5912 9.53857 11.7084C9.65577 11.8255 9.81478 11.8915 9.98047 11.8915C10.1462 11.8914 10.3052 11.8255 10.4224 11.7084C10.5395 11.5912 10.6054 11.4322 10.6055 11.2665V11.2103C12.0304 10.9486 13.1054 9.81169 13.1055 8.45398C13.1055 6.90324 11.7038 5.64155 9.98047 5.64148Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--logout: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M8.75 3.125H3.75V16.875H8.75M8.75 10H17.5M14.375 13.125L17.5 10L14.375 6.875%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--call-latency: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M10 5.625V10H14.375M17.5 10C17.5 14.1421 14.1421 17.5 10 17.5C5.85786 17.5 2.5 14.1421 2.5 10C2.5 5.85786 5.85786 2.5 10 2.5C14.1421 2.5 17.5 5.85786 17.5 10Z%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--fullscreen: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M13.125 3.75H16.25V6.875M6.875 16.25H3.75V13.125M16.25 13.125V16.25H13.125M3.75 6.875V3.75H6.875%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
+  --str-video__icon--streaming: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjEyNSA5Ljk5OTk1QzEzLjEyNSAxMC42MTggMTIuOTQxNyAxMS4yMjIyIDEyLjU5ODMgMTEuNzM2MUMxMi4yNTQ5IDEyLjI1IDExLjc2NjkgMTIuNjUwNSAxMS4xOTU4IDEyLjg4NzFDMTAuNjI0OCAxMy4xMjM2IDkuOTk2NDggMTMuMTg1NSA5LjM5MDI5IDEzLjA2NDlDOC43ODQxIDEyLjk0NDMgOC4yMjcyOCAxMi42NDY3IDcuNzkwMjQgMTIuMjA5N0M3LjM1MzIgMTEuNzcyNiA3LjA1NTU3IDExLjIxNTggNi45MzUgMTAuNjA5NkM2LjgxNDQyIDEwLjAwMzQgNi44NzYzIDkuMzc1MDggNy4xMTI4MyA4LjgwNDA2QzcuMzQ5MzUgOC4yMzMwNCA3Ljc0OTg5IDcuNzQ0OTkgOC4yNjM3OSA3LjQwMTYxQzguNzc3NyA3LjA1ODIzIDkuMzgxODggNi44NzQ5NSA5Ljk5OTk1IDYuODc0OTVDMTAuODI4OCA2Ljg3NDk1IDExLjYyMzYgNy4yMDQxOSAxMi4yMDk3IDcuNzkwMjRDMTIuNzk1NyA4LjM3NjI5IDEzLjEyNSA5LjE3MTE1IDEzLjEyNSA5Ljk5OTk1Wk0xNi4yNSA5Ljk5OTk1QzE2LjI1MTggOC40NjIzNCAxNS42ODUgNi45NzgzNiAxNC42NTg1IDUuODMzNTRDMTQuNjA0MiA1Ljc3MDg5IDE0LjUzOCA1LjcxOTY4IDE0LjQ2MzcgNS42ODI4N0MxNC4zODk0IDUuNjQ2MDcgMTQuMzA4NSA1LjYyNDQyIDE0LjIyNTggNS42MTkxOEMxNC4xNDMgNS42MTM5NSAxNC4wNjAxIDUuNjI1MjIgMTMuOTgxNyA1LjY1MjM2QzEzLjkwMzQgNS42Nzk1IDEzLjgzMTIgNS43MjE5NSAxMy43Njk0IDUuNzc3MjVDMTMuNzA3NyA1LjgzMjU1IDEzLjY1NzUgNS44OTk1OSAxMy42MjE5IDUuOTc0NDZDMTMuNTg2MyA2LjA0OTM0IDEzLjU2NTkgNi4xMzA1NSAxMy41NjIgNi4yMTMzN0MxMy41NTgxIDYuMjk2MTkgMTMuNTcwNyA2LjM3ODk2IDEzLjU5OSA2LjQ1Njg2QzEzLjYyNzQgNi41MzQ3NyAxMy42NzEgNi42MDYyNCAxMy43MjczIDYuNjY3MTRDMTQuNTQ3MSA3LjU4MzgyIDE1LjAwMDQgOC43NzA1MSAxNS4wMDA0IDEwLjAwMDNDMTUuMDAwNCAxMS4yMzAyIDE0LjU0NzEgMTIuNDE2OSAxMy43MjczIDEzLjMzMzVDMTMuNjE5OCAxMy40NTc1IDEzLjU2NTQgMTMuNjE4NyAxMy41NzU4IDEzLjc4MjRDMTMuNTg2MiAxMy45NDYxIDEzLjY2MDUgMTQuMDk5MiAxMy43ODI3IDE0LjIwODZDMTMuOTA0OSAxNC4zMTggMTQuMDY1MyAxNC4zNzUgMTQuMjI5MSAxNC4zNjcyQzE0LjM5MyAxNC4zNTk1IDE0LjU0NzIgMTQuMjg3NiAxNC42NTg1IDE0LjE2NzFDMTUuNjg0OSAxMy4wMjE5IDE2LjI1MTcgMTEuNTM3OCAxNi4yNSA5Ljk5OTk1Wk02LjI3MjYxIDYuNjY3MTRDNi4zMjg4OCA2LjYwNjI0IDYuMzcyNDggNi41MzQ3NyA2LjQwMDg2IDYuNDU2ODZDNi40MjkyNCA2LjM3ODk2IDYuNDQxODMgNi4yOTYxOSA2LjQzNzkxIDYuMjEzMzdDNi40MzM5OSA2LjEzMDU1IDYuNDEzNjIgNi4wNDkzNCA2LjM3ODAxIDUuOTc0NDZDNi4zNDIzOSA1Ljg5OTU5IDYuMjkyMjQgNS44MzI1NSA2LjIzMDQ2IDUuNzc3MjVDNi4xNjg2OCA1LjcyMTk1IDYuMDk2NTIgNS42Nzk1IDYuMDE4MTcgNS42NTIzNkM1LjkzOTgzIDUuNjI1MjIgNS44NTY4NiA1LjYxMzk1IDUuNzc0MTIgNS42MTkxOEM1LjY5MTM3IDUuNjI0NDIgNS42MTA0OSA1LjY0NjA3IDUuNTM2MiA1LjY4Mjg3QzUuNDYxOSA1LjcxOTY4IDUuMzk1NjcgNS43NzA4OSA1LjM0MTM2IDUuODMzNTRDNC4zMTU0MSA2Ljk3ODk3IDMuNzQ4MTEgOC40NjI2MyAzLjc0ODExIDEwLjAwMDNDMy43NDgxMSAxMS41MzgxIDQuMzE1NDEgMTMuMDIxNyA1LjM0MTM2IDE0LjE2NzFDNS40NTI2OSAxNC4yODc2IDUuNjA2OTMgMTQuMzU5NSA1Ljc3MDc4IDE0LjM2NzJDNS45MzQ2NCAxNC4zNzUgNi4wOTQ5OCAxNC4zMTggNi4yMTcyIDE0LjIwODZDNi4zMzk0MyAxNC4wOTkyIDYuNDEzNzQgMTMuOTQ2MSA2LjQyNDExIDEzLjc4MjRDNi40MzQ0NyAxMy42MTg3IDYuMzgwMDYgMTMuNDU3NSA2LjI3MjYxIDEzLjMzMzVDNS40NTE5NSAxMi40MTcyIDQuOTk4MTcgMTEuMjMwNCA0Ljk5ODE3IDEwLjAwMDNDNC45OTgxNyA4Ljc3MDI3IDUuNDUxOTUgNy41ODM0MyA2LjI3MjYxIDYuNjY3MTRaTTE4LjYzODIgNi4zNTQ2NEMxOC4xODA4IDUuMjY4MzQgMTcuNTIxOCA0LjI3ODUgMTYuNjk2IDMuNDM3NDVDMTYuNjM5MSAzLjM3NjYgMTYuNTcwNiAzLjMyNzc0IDE2LjQ5NDUgMy4yOTM3NUMxNi40MTg1IDMuMjU5NzYgMTYuMzM2NCAzLjI0MTMyIDE2LjI1MzEgMy4yMzk1M0MxNi4xNjk4IDMuMjM3NzMgMTYuMDg2OSAzLjI1MjYxIDE2LjAwOTUgMy4yODMyOEMxNS45MzIgMy4zMTM5NiAxNS44NjE1IDMuMzU5ODIgMTUuODAyIDMuNDE4MTZDMTUuNzQyNSAzLjQ3NjUgMTUuNjk1MyAzLjU0NjE1IDE1LjY2MzEgMy42MjMwMUMxNS42MzA5IDMuNjk5ODcgMTUuNjE0NCAzLjc4MjM4IDE1LjYxNDYgMy44NjU3QzE1LjYxNDggMy45NDkwMyAxNS42MzE2IDQuMDMxNDcgMTUuNjY0MSA0LjEwODE5QzE1LjY5NjYgNC4xODQ5MSAxNS43NDQxIDQuMjU0MzYgMTUuODAzOSA0LjMxMjQ1QzE3LjI5MzUgNS44MzAxMyAxOC4xMjggNy44NzE4IDE4LjEyOCA5Ljk5ODM5QzE4LjEyOCAxMi4xMjUgMTcuMjkzNSAxNC4xNjY2IDE1LjgwMzkgMTUuNjg0M0MxNS43NDYyIDE1Ljc0MjkgMTUuNzAwNiAxNS44MTIzIDE1LjY2OTggMTUuODg4NUMxNS42Mzg5IDE1Ljk2NDYgMTUuNjIzNCAxNi4wNDYyIDE1LjYyNDEgMTYuMTI4NEMxNS42MjQ3IDE2LjIxMDYgMTUuNjQxNSAxNi4yOTE4IDE1LjY3MzYgMTYuMzY3NUMxNS43MDU3IDE2LjQ0MzIgMTUuNzUyMyAxNi41MTE4IDE1LjgxMDkgMTYuNTY5NUMxNS44Njk1IDE2LjYyNzEgMTUuOTM4OCAxNi42NzI3IDE2LjAxNSAxNi43MDM1QzE2LjA5MTIgMTYuNzM0NCAxNi4xNzI3IDE2Ljc0OTkgMTYuMjU0OSAxNi43NDkzQzE2LjMzNzEgMTYuNzQ4NiAxNi40MTg0IDE2LjczMTggMTYuNDk0MSAxNi42OTk3QzE2LjU2OTggMTYuNjY3NyAxNi42Mzg0IDE2LjYyMSAxNi42OTYgMTYuNTYyNEMxNy45OSAxNS4yNDExIDE4Ljg2NDYgMTMuNTY2OSAxOS4yMTAyIDExLjc1MDFDMTkuNTU1NyA5LjkzMzI1IDE5LjM1NjcgOC4wNTQ4MyAxOC42MzgyIDYuMzUwNzNWNi4zNTQ2NFpNMi41MTMyMyAxMy4xNjI0QzEuODg4NzMgMTEuNjg2MiAxLjcxNTI5IDEwLjA1ODEgMi4wMTQ3NyA4LjQ4MzQxQzIuMzE0MjQgNi45MDg3MiAzLjA3MzIzIDUuNDU3OTYgNC4xOTYwNCA0LjMxNDAxQzQuMzEyMjggNC4xOTU3IDQuMzc2NzYgNC4wMzYwNiA0LjM3NTMgMy44NzAyQzQuMzczODMgMy43MDQzNSA0LjMwNjU0IDMuNTQ1ODggNC4xODgyMyAzLjQyOTY0QzQuMDY5OTIgMy4zMTM0IDMuOTEwMjggMy4yNDg5MiAzLjc0NDQzIDMuMjUwMzhDMy41Nzg1NyAzLjI1MTg1IDMuNDIwMSAzLjMxOTE0IDMuMzAzODYgMy40Mzc0NUMxLjU4MzY5IDUuMTg4NjQgMC42MTk4NzMgNy41NDUyMyAwLjYxOTg3MyA5Ljk5OTk1QzAuNjE5ODczIDEyLjQ1NDcgMS41ODM2OSAxNC44MTEzIDMuMzAzODYgMTYuNTYyNEMzLjM2MDc3IDE2LjYyMzMgMy40MjkyOCAxNi42NzIyIDMuNTA1MzYgMTYuNzA2MUMzLjU4MTQzIDE2Ljc0MDEgMy42NjM1MyAxNi43NTg2IDMuNzQ2ODQgMTYuNzYwNEMzLjgzMDE0IDE2Ljc2MjIgMy45MTI5NiAxNi43NDczIDMuOTkwNDMgMTYuNzE2NkM0LjA2NzkgMTYuNjg1OSA0LjEzODQ1IDE2LjY0MDEgNC4xOTc5NCAxNi41ODE3QzQuMjU3NDMgMTYuNTIzNCA0LjMwNDY1IDE2LjQ1MzcgNC4zMzY4MyAxNi4zNzY5QzQuMzY5IDE2LjMgNC4zODU0OSAxNi4yMTc1IDQuMzg1MzEgMTYuMTM0MkM0LjM4NTE0IDE2LjA1MDkgNC4zNjgzIDE1Ljk2ODQgNC4zMzU4IDE1Ljg5MTdDNC4zMDMyOSAxNS44MTUgNC4yNTU3OCAxNS43NDU1IDQuMTk2MDQgMTUuNjg3NEMzLjQ4MDk1IDE0Ljk1OTQgMi45MDk5OSAxNC4xMDI3IDIuNTEzMjMgMTMuMTYyNFoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=');
+  --str-video__icon--livestream-viewers: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M19.3211 9.74688C19.2937 9.68516 18.632 8.21719 17.1609 6.74609C15.2008 4.78594 12.725 3.75 9.99999 3.75C7.27499 3.75 4.79921 4.78594 2.83905 6.74609C1.36796 8.21719 0.703118 9.6875 0.678899 9.74688C0.643362 9.82681 0.625 9.91331 0.625 10.0008C0.625 10.0883 0.643362 10.1748 0.678899 10.2547C0.706243 10.3164 1.36796 11.7836 2.83905 13.2547C4.79921 15.2141 7.27499 16.25 9.99999 16.25C12.725 16.25 15.2008 15.2141 17.1609 13.2547C18.632 11.7836 19.2937 10.3164 19.3211 10.2547C19.3566 10.1748 19.375 10.0883 19.375 10.0008C19.375 9.91331 19.3566 9.82681 19.3211 9.74688ZM9.99999 13.125C9.38193 13.125 8.77774 12.9417 8.26383 12.5983C7.74993 12.255 7.34939 11.7669 7.11287 11.1959C6.87634 10.6249 6.81446 9.99653 6.93504 9.39034C7.05562 8.78415 7.35324 8.22733 7.79028 7.79029C8.22732 7.35325 8.78414 7.05562 9.39033 6.93505C9.99652 6.81447 10.6249 6.87635 11.1959 7.11288C11.7669 7.3494 12.255 7.74994 12.5983 8.26384C12.9417 8.77775 13.125 9.38193 13.125 10C13.125 10.8288 12.7958 11.6237 12.2097 12.2097C11.6236 12.7958 10.8288 13.125 9.99999 13.125Z%22 fill=%22black%22/%3E %3C/svg%3E');
+  --str-video__icon--speaker-off: url('data:image/svg+xml;utf8,%3Csvg width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22 xmlns=%22http://www.w3.org/2000/svg%22%3E %3Cpath d=%22M15.625 8.125V11.875M18.125 6.875V13.125M4.375 3.125L16.875 16.875M9.38672 4.92109L12.5 2.5V8.34609M12.5 12.0625V17.5L6.875 13.125H3.125C2.95924 13.125 2.80027 13.0592 2.68306 12.9419C2.56585 12.8247 2.5 12.6658 2.5 12.5V7.5C2.5 7.33424 2.56585 7.17527 2.68306 7.05806C2.80027 6.94085 2.95924 6.875 3.125 6.875H7.78437%22 stroke=%22black%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E');
 }
 
 .str-video__audio-blocked-notification {
   position: absolute;
   inset: 0;
-  z-index: 4;
+  z-index: 1;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -153,13 +1110,13 @@
 .str-video__audio-blocked-notification .str-video__audio-blocked-notification__message {
   display: inline-flex;
   align-items: center;
-  gap: 0.625rem;
-  padding: 0.625rem;
+  gap: var(--str-video__spacing-xs);
+  padding: var(--str-video__spacing-xs);
   max-width: calc(100% - 1.6rem);
 }
 .str-video__audio-blocked-notification .str-video__audio-blocked-notification__message .str-video__icon {
-  width: 1.5rem;
-  height: 1.5rem;
+  width: var(--str-video__size-24);
+  height: var(--str-video__size-24);
   flex-shrink: 0;
 }
 .str-video__audio-blocked-notification .str-video__audio-blocked-notification__text {
@@ -170,16 +1127,16 @@
   line-height: 1.25;
 }
 .str-video__audio-blocked-notification .str-video__audio-blocked-notification__title {
-  font-size: 0.75rem;
-  font-weight: 600;
+  font-size: var(--str-video__typography-font-size-xs);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
   max-width: 100%;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 .str-video__audio-blocked-notification .str-video__audio-blocked-notification__subtitle {
-  font-size: 0.75rem;
-  font-weight: 400;
+  font-size: var(--str-video__typography-font-size-xs);
+  font-weight: var(--str-video__typography-font-weight-regular);
   max-width: 100%;
   white-space: nowrap;
   overflow: hidden;
@@ -187,46 +1144,81 @@
 }
 
 .str-video__audio-blocked-notification {
-  background: var(--str-video__audio-blocked-overlay-color);
+  background: var(--str-video__background-core-overlay-dark);
   border-radius: inherit;
-  transition: background-color 0.15s ease;
-}
-.str-video__audio-blocked-notification:hover {
-  background: var(--str-video__audio-blocked-overlay-color-hovered);
 }
 .str-video__audio-blocked-notification .str-video__audio-blocked-notification__message {
-  background-color: var(--str-video__background-color1);
-  border-radius: var(--str-video__border-radius-xs);
-  color: var(--str-video__text-color1);
+  background-color: var(--str-video__background-core-overlay-dark-strong);
+  border-radius: var(--str-video__radius-md);
+  color: var(--str-video__text-on-accent);
 }
 .str-video__audio-blocked-notification .str-video__audio-blocked-notification__message .str-video__icon {
-  background-color: var(--str-video__text-color1);
+  background-color: var(--str-video__text-on-accent);
 }
 .str-video__audio-blocked-notification .str-video__audio-blocked-notification__subtitle {
-  color: var(--str-video__text-color2);
+  color: var(--str-video__text-on-accent);
+}
+
+.str-video__avatar,
+.str-video__avatar--initials-fallback {
+  width: var(--str-video__size-32);
+  height: var(--str-video__size-32);
 }
 
 .str-video__avatar {
-  width: 2rem;
-  height: 2rem;
   object-fit: cover;
 }
 
 .str-video__avatar--initials-fallback {
-  width: 2rem;
-  height: 2rem;
   display: flex;
   justify-content: center;
   align-items: center;
 }
 
+.str-video__avatar--size-xs {
+  width: var(--str-video__size-20);
+  height: var(--str-video__size-20);
+}
+
+.str-video__avatar--size-sm {
+  width: var(--str-video__size-24);
+  height: var(--str-video__size-24);
+}
+
+.str-video__avatar--size-md {
+  width: var(--str-video__size-32);
+  height: var(--str-video__size-32);
+}
+
+.str-video__avatar--size-lg {
+  width: var(--str-video__size-40);
+  height: var(--str-video__size-40);
+}
+
+.str-video__avatar--size-xl {
+  width: var(--str-video__size-48);
+  height: var(--str-video__size-48);
+}
+
+.str-video__avatar--size-2xl {
+  width: var(--str-video__size-80);
+  height: var(--str-video__size-80);
+}
+
+.str-video__avatar--size-3xl {
+  width: 104px;
+  height: 104px;
+}
+
 .str-video {
   /* The font color applied inside the component */
-  --str-video__avatar--color: var(--str-video__text-color1);
+  --str-video__avatar--color: var(--str-video__avatar-text-default);
   /* The background color of the component */
-  --str-video__avatar--background-color: var(--str-video__background-color1);
+  --str-video__avatar--background-color: var(
+    --str-video__avatar-bg-placeholder
+  );
   /* The border radius used for the borders of the component */
-  --str-video__avatar--border-radius: var(--str-video__border-radius-circle);
+  --str-video__avatar--border-radius: var(--str-video__radius-max);
 }
 
 .str-video__avatar {
@@ -241,231 +1233,399 @@
 }
 
 .str-video__avatar--initials-fallback {
-  background-color: var(--str-video__primary-color);
-  font-size: 1rem;
-  font-weight: 600;
-  border-radius: var(--str-video__border-radius-circle);
+  background-color: var(--str-video__avatar-bg-default);
+  color: var(--str-video__avatar-text-default);
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  border-radius: var(--str-video__radius-max);
   text-transform: uppercase;
 }
 
-.str-video__button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: var(--str-video__border-radius-md);
-  padding: var(--str-video__spacing-sm) var(--str-video__spacing-lg);
-  text-align: center;
-  min-width: 120px;
-  width: 100%;
-  font-size: var(--str-video__font-size-md);
-  font-weight: 500;
-  border: 1px solid transparent;
-  color: var(--str-video__text-color1);
-  background-color: var(--str-video__button-primary-base);
-}
-.str-video__button:not([disabled]):hover {
-  background-color: var(--str-video__button-primary-hover);
-  cursor: pointer;
+.str-video__avatar--initials-fallback.str-video__avatar--size-xs {
+  font-size: var(--str-video__typography-font-size-xs);
 }
-.str-video__button__icon {
-  margin-inline-end: var(--str-video__spacing-xs);
-  background-color: var(--str-video__text-color1);
+
+.str-video__avatar--initials-fallback.str-video__avatar--size-sm {
+  font-size: var(--str-video__typography-font-size-sm);
 }
-.str-video__button:disabled {
-  background-color: var(--str-video__button-default-disabled);
-  cursor: not-allowed;
+
+.str-video__avatar--initials-fallback.str-video__avatar--size-md {
+  font-size: var(--str-video__typography-font-size-sm);
 }
 
-.str-video__composite-button--caption {
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  gap: 0.25rem;
+.str-video__avatar--initials-fallback.str-video__avatar--size-lg {
+  font-size: var(--str-video__typography-font-size-md);
 }
-.str-video__composite-button .str-video__composite-button__button-group {
-  display: flex;
-  align-items: center;
+
+.str-video__avatar--initials-fallback.str-video__avatar--size-xl {
+  font-size: var(--str-video__typography-font-size-lg);
 }
-.str-video__composite-button .str-video__composite-button__button-group .str-video__composite-button__button {
-  all: unset;
-  position: relative;
-  display: flex;
+
+.str-video__avatar--initials-fallback.str-video__avatar--size-2xl {
+  font-size: var(--str-video__typography-font-size-xl);
+}
+
+.str-video__avatar--initials-fallback.str-video__avatar--size-3xl {
+  font-size: var(--str-video__typography-font-size-xl);
+}
+
+.str-video__avatar--outlined {
+  box-shadow: inset 0 0 0 var(--str-video__w200) var(--str-video__border-core-on-inverse);
+}
+
+.str-video__badge {
+  --str-video__badge-size: var(--str-video__size-20);
+  --str-video__badge-glyph: var(--str-video__size-16);
+  --str-video__badge-font-size: var(--str-video__typography-font-size-sm);
+}
+.str-video__badge--size-xs {
+  --str-video__badge-size: var(--str-video__size-16);
+  --str-video__badge-glyph: var(--str-video__size-12);
+  --str-video__badge-font-size: var(--str-video__typography-font-size-xxs);
+}
+.str-video__badge--size-sm {
+  --str-video__badge-size: var(--str-video__size-20);
+  --str-video__badge-glyph: var(--str-video__size-16);
+  --str-video__badge-font-size: var(--str-video__typography-font-size-sm);
+}
+.str-video__badge--size-md {
+  --str-video__badge-size: var(--str-video__size-24);
+  --str-video__badge-glyph: var(--str-video__size-20);
+  --str-video__badge-font-size: var(--str-video__typography-font-size-sm);
+}
+.str-video__badge {
+  display: inline-flex;
   align-items: center;
   justify-content: center;
-  font-size: 12px;
-  padding: 0.5rem;
+  box-sizing: border-box;
+  flex-shrink: 0;
+  min-inline-size: var(--str-video__badge-size);
+  block-size: var(--str-video__badge-size);
+  padding-inline: var(--str-video__spacing-xxs);
+  border-radius: var(--str-video__radius-max);
+  border: var(--str-video__w100) solid;
+  white-space: nowrap;
+  font-size: var(--str-video__badge-font-size);
+  font-weight: var(--str-video__typography-font-weight-bold);
+  line-height: 1;
 }
-.str-video__composite-button .str-video__composite-button__button-group .str-video__composite-button__button:not([disabled]):hover {
-  cursor: pointer;
+.str-video__badge--icon {
+  inline-size: var(--str-video__badge-size);
+  padding-inline: 0;
+  overflow: hidden;
 }
-.str-video__composite-button .str-video__composite-button__button-group .str-video__menu-toggle-button {
-  padding: 0;
-  margin-inline-start: -30px;
-  margin-inline-end: 8px;
+.str-video__badge .str-video__icon {
+  background-color: currentColor;
+  inline-size: var(--str-video__badge-glyph);
+  block-size: var(--str-video__badge-glyph);
 }
-.str-video__composite-button .str-video__composite-button__button-group .str-video__loading-indicator__icon {
-  width: 1.25rem;
-  height: 1.25rem;
-  -webkit-mask-size: 1.25rem;
-  mask-size: 1.25rem;
+
+.str-video__badge {
+  --str-video__badge-bg: var(--str-video__badge-bg-default);
+  --str-video__badge-fg: var(--str-video__badge-text);
 }
-.str-video__composite-button.str-video__composite-button--menu .str-video__composite-button__button {
-  padding-inline-end: 2.5rem;
+.str-video__badge--default {
+  --str-video__badge-bg: var(--str-video__badge-bg-default);
+  --str-video__badge-fg: var(--str-video__badge-text);
 }
-
-.str-video__call-controls__button {
-  padding: 0.5rem;
+.str-video__badge--primary {
+  --str-video__badge-bg: var(--str-video__badge-bg-primary);
+  --str-video__badge-fg: var(--str-video__badge-text-on-accent);
 }
-.str-video__call-controls__button[disabled] {
-  cursor: not-allowed;
+.str-video__badge--error {
+  --str-video__badge-bg: var(
+    --str-video__control-call-control-error-badge-bg
+  );
+  --str-video__badge-fg: var(
+    --str-video__control-call-control-error-badge-text
+  );
+  border: 0;
 }
-.str-video__call-controls__button:hover, .str-video__call-controls__button:hover > *:hover {
-  cursor: pointer;
+.str-video__badge--neutral {
+  --str-video__badge-bg: var(--str-video__badge-bg-neutral);
+  --str-video__badge-fg: var(--str-video__badge-text-on-accent);
 }
-
-.str-video__text-button {
-  all: unset;
-  padding: 5px;
-  font-size: 12px;
-  border-radius: var(--str-video__participant-list-header__close-button--border-radius);
-  background: var(--str-video__participant-list-header__close-button--background-color);
+.str-video__badge--inverse {
+  --str-video__badge-bg: var(--str-video__badge-bg-inverse);
+  --str-video__badge-fg: var(--str-video__badge-text-on-inverse);
 }
-
-.str-video__call-recording-list-item__action-button {
-  border: none;
+.str-video__badge {
+  background-color: var(--str-video__badge-bg);
+  color: var(--str-video__badge-fg);
+  border-color: var(--str-video__badge-border);
 }
 
-.str-video {
-  /* The font color applied inside the component */
-  --str-video__composite-button__button-group--color: var(
-    --str-video__text-color1
+.str-video__button {
+  --str-video__button-py: var(--str-video__button-padding-y-md);
+  --str-video__button-px: var(--str-video__button-padding-x-with-label-md);
+  --str-video__button-px-icon-only: var(
+    --str-video__button-padding-x-icon-only-md
   );
-  /* The background color of the component */
-  --str-video__composite-button__button-group--background-color: var(
-    --str-video__button-primary-base
+  --str-video__button-radius: var(--str-video__button-radius-md);
+  --str-video__button-visual: var(--str-video__button-visual-height-md);
+}
+.str-video__button--size-xs {
+  --str-video__button-py: var(--str-video__button-padding-y-xs);
+  --str-video__button-px: var(--str-video__button-padding-x-with-label-xs);
+  --str-video__button-px-icon-only: var(
+    --str-video__button-padding-x-icon-only-xs
+  );
+  --str-video__button-radius: var(--str-video__button-radius-sm);
+  --str-video__button-visual: var(--str-video__button-visual-height-xs);
+}
+.str-video__button--size-sm {
+  --str-video__button-py: var(--str-video__button-padding-y-sm);
+  --str-video__button-px: var(--str-video__button-padding-x-with-label-sm);
+  --str-video__button-px-icon-only: var(
+    --str-video__button-padding-x-icon-only-sm
   );
-  /* The active background color of the component */
-  --str-video__composite-button__button-group-active--background-color: var(
-    --str-video__button-primary-active
+  --str-video__button-radius: var(--str-video__button-radius-sm);
+  --str-video__button-visual: var(--str-video__button-visual-height-sm);
+}
+.str-video__button--size-md {
+  --str-video__button-py: var(--str-video__button-padding-y-md);
+  --str-video__button-px: var(--str-video__button-padding-x-with-label-md);
+  --str-video__button-px-icon-only: var(
+    --str-video__button-padding-x-icon-only-md
   );
-  --str-video__composite-button__button-group-active-primary--background-color: var(
-    --str-video__button-primary-active
+  --str-video__button-radius: var(--str-video__button-radius-md);
+  --str-video__button-visual: var(--str-video__button-visual-height-md);
+}
+.str-video__button--size-lg {
+  --str-video__button-py: var(--str-video__button-padding-y-lg);
+  --str-video__button-px: var(--str-video__button-padding-x-with-label-lg);
+  --str-video__button-px-icon-only: var(
+    --str-video__button-padding-x-icon-only-lg
   );
-  --str-video__composite-button__button-group-active-secondary--background-color: var(
-    --str-video__button-secondary-active
+  --str-video__button-radius: var(--str-video__button-radius-lg);
+  --str-video__button-visual: var(--str-video__button-visual-height-lg);
+}
+.str-video__button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--str-video__spacing-xs);
+  white-space: nowrap;
+  block-size: var(--str-video__button-visual);
+  min-inline-size: var(--str-video__button-visual);
+  border: none;
+  border-radius: var(--str-video__button-radius);
+  padding-block: var(--str-video__button-py);
+  padding-inline: var(--str-video__button-px);
+  font-family: inherit;
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  line-height: var(--str-video__typography-line-height-normal);
+}
+.str-video__button:not(:disabled) {
+  cursor: pointer;
+}
+.str-video__button--icon-only {
+  justify-self: center;
+  aspect-ratio: 1/1;
+  padding: var(--str-video__button-px-icon-only);
+  border-radius: var(--str-video__button-radius-full);
+}
+
+.str-video__button {
+  --str-video__button-bg: var(--str-video__button-primary-bg);
+  --str-video__button-border: var(--str-video__button-primary-border);
+  --str-video__button-fg: var(--str-video__button-primary-text);
+  --str-video__button-fg-on-fill: var(
+    --str-video__button-primary-text-on-accent
   );
-  --str-video__composite-button__button-group-active-secondary-hover--background-color: var(
-    --str-video__button-secondary-hover
+  --str-video__button-border-disabled: var(
+    --str-video__border-utility-disabled
   );
-  /* The hover background color of the component */
-  --str-video__composite-button__button-group-hover--background-color: var(
-    --str-video__button-default-hover
+}
+.str-video__button--primary {
+  --str-video__button-bg: var(--str-video__button-primary-bg);
+  --str-video__button-border: var(--str-video__button-primary-border);
+  --str-video__button-fg: var(--str-video__button-primary-text);
+  --str-video__button-fg-on-fill: var(
+    --str-video__button-primary-text-on-accent
   );
-  /* The border radius used for the borders of the component */
-  --str-video__composite-button__button-group--border-radius: var(
-    --str-video__border-radius-xs
+}
+.str-video__button--secondary {
+  --str-video__button-bg: var(--str-video__button-secondary-bg);
+  --str-video__button-border: var(--str-video__button-secondary-border);
+  --str-video__button-fg: var(--str-video__button-secondary-text);
+  --str-video__button-fg-on-fill: var(
+    --str-video__button-secondary-text-on-accent
   );
 }
-
-.str-video__composite-button__button-group {
-  background: var(--str-video__composite-button__button-group--background-color);
-  color: var(--str-video__composite-button__button-group--color);
-  box-shadow: var(--str-video__composite-button__button-group--box-shadow);
-  border-radius: var(--str-video__composite-button__button-group--border-radius);
-  border-block-start: var(--str-video__composite-button__button-group--border-block-start);
-  border-block-end: var(--str-video__composite-button__button-group--border-block-end);
-  border-inline-start: var(--str-video__composite-button__button-group--border-inline-start);
-  border-inline-end: var(--str-video__composite-button__button-group--border-inline-end);
-  background-color: var(--str-video__composite-button__button-group--background-color);
-  border-radius: var(--str-video__border-radius-circle);
+.str-video__button--destructive {
+  --str-video__button-bg: var(--str-video__button-destructive-bg);
+  --str-video__button-border: var(--str-video__button-destructive-border);
+  --str-video__button-fg: var(--str-video__button-destructive-text);
+  --str-video__button-fg-on-fill: var(
+    --str-video__button-destructive-text-on-accent
+  );
 }
-.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button {
-  background-color: var(--str-video__button-primary-base);
+.str-video__button {
+  background-color: transparent;
+  background-image: linear-gradient(to bottom, var(--str-video__button-overlay, transparent), var(--str-video__button-overlay, transparent)), linear-gradient(to bottom, var(--str-video__button-selected, transparent), var(--str-video__button-selected, transparent));
+}
+.str-video__button .str-video__icon {
+  background-color: currentColor;
 }
-.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button:hover {
-  background-color: var(--str-video__button-default-hover);
+.str-video__button--solid {
+  background-color: var(--str-video__button-bg);
+  color: var(--str-video__button-fg-on-fill);
 }
-.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button--active {
-  background-color: var(--str-video__composite-button__button-group-hover--background-color);
-  color: white;
+.str-video__button--outline {
+  box-shadow: inset 0 0 0 var(--str-video__w100) var(--str-video__button-border);
+  color: var(--str-video__button-fg);
 }
-.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button--active:hover {
-  background-color: var(--str-video__composite-button__button-group-hover--background-color);
+.str-video__button--ghost {
+  color: var(--str-video__button-fg);
 }
-.str-video__composite-button__button-group .str-video__call-controls__button.str-video__menu-toggle-button--active:disabled {
-  background-color: var(--str-video__composite-button__button-group-hover--background-color);
+.str-video__button:not(:disabled):not([aria-disabled=true]):hover {
+  --str-video__button-overlay: var(--str-video__background-utility-hover);
+}
+.str-video__button:not(:disabled):not([aria-disabled=true])[aria-expanded=true], .str-video__button:not(:disabled):not([aria-disabled=true]):active {
+  --str-video__button-overlay: var(--str-video__background-utility-pressed);
+}
+.str-video__button:not(:disabled):not([aria-disabled=true])[aria-pressed=true] {
+  --str-video__button-selected: var(
+    --str-video__background-utility-selected
+  );
 }
-.str-video__composite-button__button-group.str-video__composite-button__button-group--active {
-  background-color: var(--str-video__composite-button__button-group-active--background-color);
+.str-video__button:not(:disabled):focus-visible {
+  outline: var(--str-video__w200) solid var(--str-video__border-utility-focused);
+  outline-offset: calc(var(--str-video__w200) * -1);
 }
-.str-video__composite-button__button-group.str-video__composite-button__button-group--active:hover {
-  background-color: var(--str-video__button-primary-hover);
+.str-video__button:disabled, .str-video__button[aria-disabled=true] {
+  color: var(--str-video__text-disabled);
+  cursor: default;
 }
-.str-video__composite-button__button-group.str-video__composite-button__button-group--active .str-video__icon {
-  background-color: var(--str-video__icon-active);
+.str-video__button:disabled.str-video__button--solid, .str-video__button[aria-disabled=true].str-video__button--solid {
+  background-color: var(--str-video__background-utility-disabled);
 }
-.str-video__composite-button__button-group.str-video__composite-button__button-group--active-primary {
-  background-color: var(--str-video__composite-button__button-group-active-primary--background-color);
+.str-video__button:disabled.str-video__button--outline, .str-video__button[aria-disabled=true].str-video__button--outline {
+  box-shadow: inset 0 0 0 var(--str-video__w100) var(--str-video__button-border-disabled);
 }
-.str-video__composite-button__button-group.str-video__composite-button__button-group--active-secondary {
-  background-color: var(--str-video__composite-button__button-group-active-secondary--background-color);
+.str-video__button[aria-disabled=true] {
+  pointer-events: none;
 }
 
+.str-video__composite-button {
+  --str-video__composite-button-caret: var(
+    --str-video__button-visual-height-xs
+  );
+  --str-video__composite-button-lead: var(--str-video__spacing-sm);
+}
+.str-video__composite-button--size-sm {
+  --str-video__composite-button-lead: var(--str-video__spacing-xs);
+}
+.str-video__composite-button--size-lg {
+  --str-video__composite-button-caret: var(
+    --str-video__button-visual-height-sm
+  );
+  --str-video__composite-button-lead: var(--str-video__spacing-md);
+}
+.str-video__composite-button {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--str-video__spacing-xxs);
+}
+.str-video__composite-button__group {
+  position: relative;
+  display: inline-flex;
+}
+.str-video__composite-button__action {
+  position: relative;
+}
+.str-video__composite-button__action > .str-video__badge {
+  position: absolute;
+  z-index: 1;
+  inset-block-start: calc(var(--str-video__spacing-xxs) * -1);
+  inset-inline-end: calc(var(--str-video__spacing-xxs) * -1);
+  pointer-events: none;
+}
 .str-video__composite-button__caption {
-  font-size: 12px;
-  line-height: 15px;
-  text-align: center;
+  max-inline-size: 100%;
   overflow: hidden;
+  font-size: var(--str-video__typography-font-size-xs);
+  line-height: var(--str-video__typography-line-height-tight);
+  text-align: center;
+  text-overflow: ellipsis;
   white-space: nowrap;
 }
-
-.str-video__composite-button__button-group:not(.str-video__composite-button__button-group--disabled):hover {
-  background-color: var(--str-video__composite-button__button-group-hover--background-color);
-}
-.str-video__composite-button__button-group:not(.str-video__composite-button__button-group--disabled):hover.str-video__composite-button__button-group--active-secondary:hover {
-  background-color: var(--str-video__composite-button__button-group-active-secondary-hover--background-color);
+.str-video__composite-button--menu .str-video__composite-button__action {
+  aspect-ratio: auto;
+  padding-inline: var(--str-video__composite-button-lead) calc(2 * var(--str-video__spacing-xs) + var(--str-video__composite-button-caret));
 }
-.str-video__composite-button__button-group:not(.str-video__composite-button__button-group--disabled):hover .str-video__icon {
-  background-color: var(--str-video__icon-hover);
+.str-video__composite-button--menu .str-video__composite-button__caret {
+  position: absolute;
+  inset-inline-end: var(--str-video__spacing-xs);
+  inset-block-start: 50%;
+  translate: 0 -50%;
 }
-
-.str-video__call-controls__button {
-  border-radius: var(--str-video__border-radius-circle);
-  text-decoration: none;
-  box-shadow: none;
-  border: none;
-  background-color: var(--str-video__button-primary-base);
+.str-video__composite-button--size-lg .str-video__composite-button__caret {
+  --str-video__button-visual: var(--str-video__button-visual-height-sm);
+  padding: var(--str-video__button-padding-x-icon-only-sm);
 }
-.str-video__call-controls__button:hover {
-  text-decoration: none;
-  background-color: var(--str-video__composite-button__button-group-hover--background-color);
+.str-video__composite-button--primary {
+  --str-video__composite-button-caret-bg: var(
+    --str-video__button-primary-bg
+  );
+  --str-video__composite-button-caret-fg: var(
+    --str-video__button-primary-text-on-accent
+  );
 }
-.str-video__call-controls__button:hover .str-video__icon {
-  background-color: var(--str-video__icon-hover);
+.str-video__composite-button--primary.str-video__composite-button--outline, .str-video__composite-button--primary.str-video__composite-button--ghost {
+  --str-video__composite-button-caret-bg: transparent;
+  --str-video__composite-button-caret-fg: var(
+    --str-video__button-primary-text
+  );
 }
-.str-video__call-controls__button--variant-danger {
-  background-color: var(--str-video__button-tertiary-base);
+.str-video__composite-button--secondary {
+  --str-video__composite-button-caret-bg: var(
+    --str-video__button-secondary-bg
+  );
+  --str-video__composite-button-caret-fg: var(
+    --str-video__button-secondary-text-on-accent
+  );
 }
-.str-video__call-controls__button--variant-danger .str-video__icon {
-  background-color: white;
+.str-video__composite-button--secondary.str-video__composite-button--outline, .str-video__composite-button--secondary.str-video__composite-button--ghost {
+  --str-video__composite-button-caret-bg: transparent;
+  --str-video__composite-button-caret-fg: var(
+    --str-video__button-secondary-text
+  );
 }
-.str-video__call-controls__button--variant-danger:hover {
-  background-color: var(--str-video__button-tertiary-hover);
+.str-video__composite-button--destructive {
+  --str-video__composite-button-caret-bg: var(
+    --str-video__button-destructive-bg
+  );
+  --str-video__composite-button-caret-fg: var(
+    --str-video__button-destructive-text-on-accent
+  );
 }
-.str-video__call-controls__button--variant-success {
-  background-color: var(--str-video__info-color);
+.str-video__composite-button--destructive.str-video__composite-button--outline, .str-video__composite-button--destructive.str-video__composite-button--ghost {
+  --str-video__composite-button-caret-bg: transparent;
+  --str-video__composite-button-caret-fg: var(
+    --str-video__button-destructive-text
+  );
 }
-.str-video__call-controls__button--variant-success:hover {
-  background-color: var(--str-video__info-color--accent);
+.str-video__composite-button .str-video__composite-button__caret:not(:disabled):not([aria-disabled=true]) {
+  background-color: var(--str-video__composite-button-caret-bg);
+  color: var(--str-video__composite-button-caret-fg);
 }
-.str-video__call-controls__button--variant-active {
-  background-color: var(--str-video__button-primary-active);
+.str-video__composite-button--primary .str-video__composite-button__action.str-video__button[aria-pressed=true], .str-video__composite-button--destructive .str-video__composite-button__action.str-video__button[aria-pressed=true] {
+  --str-video__button-selected: transparent;
 }
-.str-video__call-controls__button--variant-active:hover {
-  background-color: var(--str-video__button-primary-hover);
+.str-video__composite-button:has(> .str-video__composite-button__group > .str-video__composite-button__caret[aria-expanded=true]) > .str-video__composite-button__group > .str-video__composite-button__action {
+  --str-video__button-selected: var(
+    --str-video__background-utility-selected
+  );
 }
-.str-video__call-controls__button--enabled {
-  background: var(--str-video__background-color7);
+
+.str-video__composite-button.str-video__device-unavailable .str-video__composite-button__action,
+.str-video__composite-button.str-video__device-unavailable .str-video__composite-button__caret {
+  --str-video__button-overlay: var(--str-video__background-utility-disabled);
+  color: var(--str-video__text-disabled);
 }
 
 .str-video__background-filters {
@@ -498,15 +1658,14 @@
 .str-video__call-controls {
   display: flex;
   justify-content: center;
-  gap: 1rem;
-  padding: 1rem 0;
+  gap: var(--str-video__spacing-md);
+  padding: var(--str-video__spacing-md) var(--str-video__spacing-none);
 }
 .str-video__call-controls .str-video__reactions-menu {
-  background-color: var(--str-video__base-color6);
   display: flex;
-  padding: var(--str-video__spacing-sm);
-  gap: 0.5rem;
-  border-radius: var(--str-video__border-radius-lg);
+  align-items: center;
+  padding: var(--str-video__spacing-sm) var(--str-video__spacing-md) var(--str-video__spacing-md);
+  gap: var(--str-video__spacing-xxxs);
 }
 .str-video__call-controls .str-video__reactions-menu--horizontal {
   flex-direction: row;
@@ -515,158 +1674,96 @@
   flex-direction: column;
 }
 .str-video__call-controls .str-video__reactions-menu .str-video__reactions-menu__button {
-  font-family: "Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color";
-  font-size: 1.2rem;
-  height: 38px;
-  width: 38px;
-  background-color: var(--str-video__button-primary-base);
-  border-radius: var(--str-video__border-radius-circle);
-  border: 1px solid transparent;
+  font-family: system-ui;
+  font-size: var(--str-video__emoji-md);
+  line-height: 1;
+  padding: 0;
+  height: var(--str-video__button-visual-height-md);
+  width: var(--str-video__button-visual-height-md);
+  color: var(--str-video__text-primary);
+  background-color: transparent;
+  border: none;
+  border-radius: var(--str-video__radius-max);
   display: flex;
   align-items: center;
   justify-content: center;
 }
-.str-video__call-controls .str-video__reactions-menu .str-video__reactions-menu__button:hover {
-  background-color: var(--str-video__button-primary-hover);
-  cursor: pointer;
-}
-
-.str-video__no-media-permission,
-.str-video__system-muted,
-.str-video__pending-permission {
-  position: absolute;
-  height: 12px;
-  width: 12px;
-  outline: 1px solid var(--str-video__base-color6);
-  border-radius: var(--str-video__border-radius-circle);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  font-size: var(--str-video__font-size-xxs);
+.str-video__call-controls .str-video__reactions-menu .str-video__reactions-menu__button:hover:not(:disabled) {
+  background-color: var(--str-video__background-utility-hover);
   cursor: pointer;
-  font-weight: 600;
-  top: 0;
-  right: -3px;
 }
-
-.str-video__no-media-permission {
-  background-color: var(--str-video__alert-caution);
-  color: var(--str-video__base-color4);
-}
-
-.str-video__pending-permission {
-  background-color: var(--str-video__button-secondary-active);
-  color: var(--str-video__text-color1);
+.str-video__call-controls .str-video__reactions-menu .str-video__reactions-menu__button:active:not(:disabled) {
+  background-color: var(--str-video__background-utility-pressed);
 }
 
-.str-video__system-muted {
-  background-color: var(--str-video__alert-caution);
-  color: var(--str-video__base-color4);
-}
-
-.str-video__composite-button.str-video__device-unavailable .str-video__composite-button__button-group {
-  background-color: var(--str-video__button-default-disabled);
-}
-.str-video__composite-button.str-video__device-unavailable .str-video__composite-button__button-group:hover {
-  background-color: var(--str-video__button-default-hover);
+.str-video__accept-call-button {
+  --str-video__button-bg: var(--str-video__control-accept-call-button-bg);
+  --str-video__button-fg-on-fill: var(
+    --str-video__control-accept-call-button-text
+  );
 }
 
 .str-video__end-call__confirmation {
-  padding: var(--str-video__spacing-lg);
-  gap: var(--str-video__spacing-md);
+  padding: var(--str-video__spacing-md);
+  gap: var(--str-video__spacing-xs);
+  inline-size: 224px;
   display: flex;
   flex-direction: column;
 }
-.str-video__end-call__leave, .str-video__end-call__end {
-  min-width: 196px;
-  color: var(--str-video__text-color1);
-  border: 1px solid transparent;
-  padding: calc(var(--str-video__spacing-sm) - 1px) var(--str-video__spacing-lg);
-}
-.str-video__end-call__leave-icon, .str-video__end-call__end-icon {
-  background-color: var(--str-video__text-color1);
-}
-.str-video__end-call__leave {
-  background-color: var(--str-video__button-tertiary-base);
-}
-.str-video__end-call__leave:hover {
-  background-color: var(--str-video__button-tertiary-hover);
-}
-.str-video__end-call__end {
-  background-color: var(--str-video__button-primary-base);
-  border-color: var(--str-video__button-default-hover);
-}
-.str-video__end-call__end:hover {
-  background-color: var(--str-video__button-tertiary-hover);
-  border-color: transparent;
-}
-
-.str-video__end-call.str-video__end-call__leave-icon,
-.str-video__icon.str-video__end-call__end-icon {
-  background-color: var(--str-video__text-color1);
-}
 
 .str-video__end-recording__confirmation {
-  background-color: var(--str-video__base-color7);
-  border-radius: var(--str-video__border-radius-lg);
-  padding: var(--str-video__spacing-xl);
-  gap: var(--str-video__spacing-lg);
+  inline-size: 304px;
+  padding: var(--str-video__spacing-2xl) var(--str-video__spacing-xl) var(--str-video__spacing-xl);
+  gap: var(--str-video__spacing-2xl);
   display: flex;
   flex-direction: column;
+  background-color: var(--str-video__background-core-elevation-1);
+  border-radius: var(--str-video__radius-xl);
+  box-shadow: var(--str-video__box-shadow-4);
 }
 
 .str-video__end-recording__header {
   display: flex;
-  flex-direction: row;
+  flex-direction: column;
+  align-items: center;
   gap: var(--str-video__spacing-md);
+  inline-size: 100%;
+}
+.str-video__end-recording__header .str-video__icon {
+  inline-size: var(--str-video__icon-size-lg);
+  block-size: var(--str-video__icon-size-lg);
+  background-color: var(--str-video__text-tertiary);
+}
+
+.str-video__end-recording__text {
+  display: flex;
+  flex-direction: column;
+  gap: var(--str-video__spacing-xs);
+  inline-size: 100%;
+  text-align: center;
 }
 
 .str-video__end-recording__heading {
-  font-size: var(--str-video__font-size-lg);
-  font-weight: 600;
   margin: 0;
+  color: var(--str-video__text-primary);
+  font-size: var(--str-video__typography-font-size-md);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  line-height: var(--str-video__typography-line-height-normal);
 }
 
 .str-video__end-recording__description {
   margin: 0;
-  color: var(--str-video__text-color2);
-  font-size: var(--str-video__font-size-sm);
+  color: var(--str-video__text-secondary);
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-regular);
+  line-height: var(--str-video__typography-line-height-normal);
 }
 
 .str-video__end-recording__actions {
   display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  gap: var(--str-video__spacing-md);
-}
-.str-video__end-recording__actions .str-video__composite-button {
-  width: 100%;
-  gap: var(--str-video__spacing-md);
-}
-.str-video__end-recording__actions .str-video__composite-button:first-of-type {
-  background-color: transparent;
-}
-.str-video__end-recording__actions .str-video__composite-button:first-of-type .str-video__composite-button__button-group {
-  background-color: transparent;
-  border: 1px solid var(--str-video__base-color2);
-  width: 100%;
-  justify-content: center;
-}
-.str-video__end-recording__actions .str-video__composite-button:first-of-type .str-video__composite-button__button-group:hover {
-  background-color: var(--str-video__button-default-hover);
-}
-.str-video__end-recording__actions .str-video__composite-button .str-video__composite-button__button-group {
-  background-color: var(--str-video__button-tertiary-base);
-  width: 100%;
-  justify-content: center;
-}
-.str-video__end-recording__actions .str-video__composite-button .str-video__composite-button__button-group .str-video__text-button {
-  display: flex;
-  align-items: center;
-  gap: 5px;
-}
-.str-video__end-recording__actions .str-video__composite-button .str-video__composite-button__button-group:hover {
-  background-color: var(--str-video__button-tertiary-hover);
+  flex-direction: column;
+  gap: var(--str-video__spacing-xs);
+  inline-size: 100%;
 }
 
 .str-video__livestream-layout__wrapper {
@@ -686,25 +1783,25 @@
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant {
   position: absolute;
-  width: 240px;
-  height: 135px;
-  box-shadow: var(--str-video__background-color1) 0 0 3px 0;
+  width: var(--str-video__size-240);
+  height: calc(var(--str-video__size-240) * 9 / 16);
+  box-shadow: var(--str-video__box-shadow-1);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant--top-right {
-  top: 8px;
-  right: 8px;
+  top: var(--str-video__space-8);
+  right: var(--str-video__space-8);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant--top-left {
-  top: 8px;
-  left: 8px;
+  top: var(--str-video__space-8);
+  left: var(--str-video__space-8);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant--bottom-right {
-  bottom: 8px;
-  right: 8px;
+  bottom: var(--str-video__space-8);
+  right: var(--str-video__space-8);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__floating-participant--bottom-left {
-  bottom: 8px;
-  left: 8px;
+  bottom: var(--str-video__space-8);
+  left: var(--str-video__space-8);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay {
   position: absolute;
@@ -713,28 +1810,21 @@
   display: flex;
   flex-direction: column-reverse;
 }
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay:hover .str-video__livestream-layout__overlay__bar {
-  background-color: var(--str-video__livestream-overlay-color-hovered);
-}
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__overlay__bar {
-  height: 10%;
-  min-height: 40px;
-  max-height: 70px;
-  position: relative;
-  bottom: 0;
-  border-bottom-left-radius: var(--str-video__border-radius-sm);
-  border-bottom-right-radius: var(--str-video__border-radius-sm);
-  background-color: var(--str-video__livestream-overlay-color);
+  min-block-size: var(--str-video__size-48);
   display: flex;
   align-items: center;
-  padding: 0 20px;
+  padding: var(--str-video__spacing-xs);
+  gap: var(--str-video__spacing-xxs);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__overlay__bar-left,
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__overlay__bar-center,
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__overlay__bar-right {
   flex: 1;
+  min-inline-size: 0;
   display: flex;
   align-items: center;
+  gap: var(--str-video__spacing-xs);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__overlay__bar-center {
   justify-content: center;
@@ -743,50 +1833,58 @@
   justify-content: flex-end;
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__live-badge {
-  padding: 4px 8px;
-  border-radius: var(--str-video__border-radius-xxs);
-  background-color: var(--str-video__primary-color);
-  color: var(--str-video__text-color1);
+  display: inline-flex;
+  align-items: center;
+  flex: none;
+  gap: var(--str-video__spacing-xs);
+  block-size: var(--str-video__size-32);
+  padding: var(--str-video__spacing-xxs) var(--str-video__spacing-sm);
+  border-radius: var(--str-video__radius-24);
+  font-size: var(--str-video__typography-font-size-xs);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  line-height: var(--str-video__typography-line-height-tight);
+  text-transform: uppercase;
 }
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__viewers-count::before {
-  content: var(--str-video__icon--livestream-viewers);
-  margin-right: 3px;
-  vertical-align: middle;
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__live-badge__dot {
+  flex: none;
+  inline-size: var(--str-video__size-8);
+  block-size: var(--str-video__size-8);
+  border-radius: var(--str-video__radius-full);
+  animation: str-video__livestream-live-blink 1s ease-in-out infinite alternate;
 }
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__viewers-count {
-  padding: 4px 8px;
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__viewers-count,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__duration,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__speaker-name {
+  display: inline-flex;
+  align-items: center;
+  flex: none;
+  gap: var(--str-video__spacing-xxs);
+  block-size: var(--str-video__size-32);
+  padding: var(--str-video__spacing-xxs) var(--str-video__spacing-xs);
+  border-radius: var(--str-video__radius-24);
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  line-height: var(--str-video__typography-line-height-normal);
+}
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__viewers-count .str-video__icon,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__duration .str-video__icon,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__speaker-name .str-video__icon {
+  inline-size: var(--str-video__icon-size-sm);
+  block-size: var(--str-video__icon-size-sm);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__speaker-name {
-  font-size: 13px;
-  text-overflow: ellipsis;
+  flex: 0 1 auto;
+  min-inline-size: 0;
+}
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__speaker-name > span {
   overflow: hidden;
+  text-overflow: ellipsis;
   white-space: nowrap;
 }
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__duration {
-  text-align: center;
-}
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__mute-button {
-  background: var(--str-video__icon--speaker) center no-repeat;
-  border-radius: var(--str-video__border-radius-xxs);
-  cursor: pointer;
-  width: 32px;
-  height: 32px;
-}
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__mute-button.str-video__livestream-layout__mute-button--muted {
-  background: var(--str-video__icon--speaker-off) center no-repeat;
-}
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__mute-button:hover {
-  background-color: var(--str-video__overlay-color);
-}
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__go-fullscreen {
-  background: var(--str-video__icon--fullscreen) center no-repeat;
-  border-radius: var(--str-video__border-radius-xxs);
-  cursor: pointer;
-  width: 32px;
-  height: 32px;
-}
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__go-fullscreen:hover {
-  background-color: var(--str-video__overlay-color);
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__mute-button .str-video__icon,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__go-fullscreen .str-video__icon {
+  inline-size: var(--str-video__icon-size-md);
+  block-size: var(--str-video__icon-size-md);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__backstage {
   display: flex;
@@ -794,15 +1892,40 @@
   align-items: center;
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__backstage .str-video__livestream-layout__starts-at {
-  padding: 4px 8px;
-}
-.str-video__livestream-layout__wrapper .str-video__livestream-layout__backstage .str-video__livestream-layout__early-viewers-count::before {
-  content: var(--str-video__icon--livestream-viewers);
-  margin-right: 3px;
-  vertical-align: middle;
+  padding: var(--str-video__spacing-xxs) var(--str-video__spacing-xs);
 }
 .str-video__livestream-layout__wrapper .str-video__livestream-layout__backstage .str-video__livestream-layout__early-viewers-count {
-  padding: 4px 8px;
+  display: inline-flex;
+  align-items: center;
+  gap: var(--str-video__spacing-xxs);
+  padding: var(--str-video__spacing-xxs) var(--str-video__spacing-xs);
+}
+
+@keyframes str-video__livestream-live-blink {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0.4;
+  }
+}
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__live-badge {
+  background-color: var(--str-video__accent-primary);
+  color: var(--str-video__text-on-accent);
+}
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__live-badge__dot {
+  background-color: var(--str-video__background-core-on-accent);
+}
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__viewers-count,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__duration,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__speaker-name {
+  background-color: var(--str-video__background-core-surface-default);
+  color: var(--str-video__text-primary);
+}
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__viewers-count .str-video__icon,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__duration .str-video__icon,
+.str-video__livestream-layout__wrapper .str-video__livestream-layout__overlay .str-video__livestream-layout__speaker-name .str-video__icon {
+  background-color: currentColor;
 }
 
 .str-video__paginated-grid-layout__wrapper {
@@ -818,24 +1941,24 @@
 .str-video__paginated-grid-layout .str-video__paginated-grid-layout__group {
   display: flex;
   flex-wrap: wrap;
-  gap: 8px;
+  gap: var(--str-video__spacing-xs);
   justify-content: center;
   max-width: 110vh;
-  padding-inline: 1.25rem;
+  padding-inline: var(--str-video__spacing-lg);
   margin: auto;
   width: 100%;
 }
 .str-video__paginated-grid-layout .str-video__paginated-grid-layout__group .str-video__participant-view {
-  flex: 0 1 calc(25% - 6px);
+  flex: 0 1 calc(25% - var(--str-video__space-6));
 }
 .str-video__paginated-grid-layout .str-video__paginated-grid-layout__group.str-video__paginated-grid-layout--one .str-video__participant-view {
-  flex: 0 1 calc(100% - 6px);
+  flex: 0 1 calc(100% - var(--str-video__space-6));
 }
 .str-video__paginated-grid-layout .str-video__paginated-grid-layout__group.str-video__paginated-grid-layout--two-four .str-video__participant-view {
-  flex: 0 1 calc(50% - 6px);
+  flex: 0 1 calc(50% - var(--str-video__space-6));
 }
 .str-video__paginated-grid-layout .str-video__paginated-grid-layout__group.str-video__paginated-grid-layout--five-nine .str-video__participant-view {
-  flex: 0 1 calc(33% - 6px);
+  flex: 0 1 calc(33% - var(--str-video__space-6));
 }
 
 .str-video__speaker-layout__wrapper {
@@ -849,9 +1972,9 @@
   justify-content: center;
   height: 100%;
   width: 100%;
-  gap: 1rem;
-  padding-inline: 2px;
-  padding: 2px;
+  gap: var(--str-video__spacing-md);
+  padding-inline: var(--str-video__spacing-xxxs);
+  padding: var(--str-video__spacing-xxxs);
 }
 .str-video__speaker-layout .str-video__participant-view {
   aspect-ratio: 16/9;
@@ -870,7 +1993,7 @@
   width: 100%;
 }
 .str-video__speaker-layout .str-video__speaker-layout__spotlight .str-video__participant-details,
-.str-video__speaker-layout .str-video__speaker-layout__spotlight .str-video__call-controls__button {
+.str-video__speaker-layout .str-video__speaker-layout__spotlight .str-video__button {
   opacity: 1;
 }
 .str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper {
@@ -879,25 +2002,25 @@
   justify-content: center;
   align-items: center;
 }
-.str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper > .str-video__call-controls__button .str-video__icon {
-  width: 1rem;
-  height: 1rem;
+.str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper > .str-video__button .str-video__icon {
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
 }
 .str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper .str-video__speaker-layout__participants-bar--button-left {
   position: absolute;
-  left: 0.5rem;
+  left: var(--str-video__space-8);
 }
 .str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper .str-video__speaker-layout__participants-bar--button-right {
   position: absolute;
-  right: 0.5rem;
+  right: var(--str-video__space-8);
 }
 .str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper .str-video__speaker-layout__participants-bar--button-top {
   position: absolute;
-  top: 0.5rem;
+  top: var(--str-video__space-8);
 }
 .str-video__speaker-layout .str-video__speaker-layout__participants-bar-buttons-wrapper .str-video__speaker-layout__participants-bar--button-bottom {
   position: absolute;
-  bottom: 0.5rem;
+  bottom: var(--str-video__space-8);
 }
 .str-video__speaker-layout .str-video__speaker-layout__participants-bar-wrapper {
   scrollbar-width: none;
@@ -962,21 +2085,21 @@
   flex-wrap: wrap;
   overflow: hidden;
   justify-content: center;
-  gap: 1rem;
-  padding-inline: 1rem;
+  gap: var(--str-video__spacing-md);
+  padding-inline: var(--str-video__spacing-md);
   height: 100%;
 }
 
 .str-video__pip-screen-share-local {
   display: flex;
-  gap: var(--str-video__spacing-sm);
-  border-radius: var(--str-video__border-radius-sm);
-  padding: var(--str-video__spacing-md);
-  font-size: var(--str-video__font-size-sm);
+  gap: var(--str-video__spacing-xs);
+  border-radius: var(--str-video__radius-lg);
+  padding: var(--str-video__spacing-sm);
+  font-size: var(--str-video__typography-font-size-sm);
 }
 .str-video__pip-screen-share-local .str-video__icon {
-  width: 1rem;
-  height: 1rem;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
 }
 
 .str-video__pip-layout--grid {
@@ -1008,8 +2131,8 @@
   opacity: 1;
 }
 .str-video__pip-layout__pagination-button .str-video__icon {
-  width: 1rem;
-  height: 1rem;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
 }
 .str-video__pip-layout__pagination-button--left {
   left: 0;
@@ -1040,69 +2163,70 @@
   content: "";
   position: absolute;
   inset: 0;
-  border: 2px solid var(--str-video__primary-color);
-  border-radius: var(--str-video__border-radius-sm);
+  border: var(--str-video__w200) solid var(--str-video__accent-primary);
+  border-radius: var(--str-video__radius-2xl);
   pointer-events: none;
   z-index: 1;
 }
 .str-video__pip-layout__grid .str-video__participant-view .str-video__notification {
   display: none;
 }
-.str-video__pip-layout__grid .str-video__video-placeholder__avatar,
-.str-video__pip-layout__grid .str-video__video-placeholder__initials-fallback {
-  width: 32px;
-  height: 32px;
-  font-size: var(--str-video__font-size-sm);
+.str-video__pip-layout__grid .str-video__avatar,
+.str-video__pip-layout__grid .str-video__avatar--initials-fallback {
+  width: var(--str-video__size-32);
+  height: var(--str-video__size-32);
+  font-size: var(--str-video__typography-font-size-sm);
 }
 .str-video__pip-layout__grid.str-video__pip-layout__grid--single {
   --pip-cols: 1;
 }
-.str-video__pip-layout__grid.str-video__pip-layout__grid--single .str-video__video-placeholder__avatar,
-.str-video__pip-layout__grid.str-video__pip-layout__grid--single .str-video__video-placeholder__initials-fallback {
-  width: 80px;
-  height: 80px;
-  font-size: var(--str-video__font-size-xxl);
+.str-video__pip-layout__grid.str-video__pip-layout__grid--single .str-video__avatar,
+.str-video__pip-layout__grid.str-video__pip-layout__grid--single .str-video__avatar--initials-fallback {
+  width: var(--str-video__size-80);
+  height: var(--str-video__size-80);
+  font-size: var(--str-video__typography-font-size-2xl);
 }
 .str-video__pip-layout__grid.str-video__pip-layout__grid--small {
   --pip-cols: 2;
 }
-.str-video__pip-layout__grid.str-video__pip-layout__grid--small .str-video__video-placeholder__avatar,
-.str-video__pip-layout__grid.str-video__pip-layout__grid--small .str-video__video-placeholder__initials-fallback {
+.str-video__pip-layout__grid.str-video__pip-layout__grid--small .str-video__avatar,
+.str-video__pip-layout__grid.str-video__pip-layout__grid--small .str-video__avatar--initials-fallback {
   width: 60px;
   height: 60px;
-  font-size: var(--str-video__font-size-xl);
+  font-size: var(--str-video__typography-font-size-xl);
 }
 .str-video__pip-layout__grid.str-video__pip-layout__grid--medium {
   --pip-cols: 3;
 }
-.str-video__pip-layout__grid.str-video__pip-layout__grid--medium .str-video__video-placeholder__avatar,
-.str-video__pip-layout__grid.str-video__pip-layout__grid--medium .str-video__video-placeholder__initials-fallback {
+.str-video__pip-layout__grid.str-video__pip-layout__grid--medium .str-video__avatar,
+.str-video__pip-layout__grid.str-video__pip-layout__grid--medium .str-video__avatar--initials-fallback {
   width: 45px;
   height: 45px;
-  font-size: var(--str-video__font-size-md);
+  font-size: var(--str-video__typography-font-size-md);
 }
 .str-video__pip-layout__grid.str-video__pip-layout__grid--large {
   --pip-cols: 4;
 }
-.str-video__pip-layout__grid.str-video__pip-layout__grid--large .str-video__video-placeholder__avatar,
-.str-video__pip-layout__grid.str-video__pip-layout__grid--large .str-video__video-placeholder__initials-fallback {
+.str-video__pip-layout__grid.str-video__pip-layout__grid--large .str-video__avatar,
+.str-video__pip-layout__grid.str-video__pip-layout__grid--large .str-video__avatar--initials-fallback {
   width: 35px;
   height: 35px;
-  font-size: var(--str-video__font-size-sm);
+  font-size: var(--str-video__typography-font-size-sm);
 }
 .str-video__pip-layout__grid.str-video__pip-layout__grid--overflow {
   --pip-cols: 5;
   overflow-y: auto;
 }
-.str-video__pip-layout__grid.str-video__pip-layout__grid--overflow .str-video__video-placeholder__avatar,
-.str-video__pip-layout__grid.str-video__pip-layout__grid--overflow .str-video__video-placeholder__initials-fallback {
+.str-video__pip-layout__grid.str-video__pip-layout__grid--overflow .str-video__avatar,
+.str-video__pip-layout__grid.str-video__pip-layout__grid--overflow .str-video__avatar--initials-fallback {
   width: 25px;
   height: 25px;
-  font-size: var(--str-video__font-size-xs);
+  font-size: var(--str-video__typography-font-size-xs);
 }
 
 .str-video__pip-screen-share-local {
-  background: var(--str-video__background-color5);
+  background: var(--str-video__background-core-surface-default);
+  color: var(--str-video__text-primary);
 }
 
 .str-video__participant-list {
@@ -1112,14 +2236,22 @@
 .str-video__participant-list .str-video__participant-list-header {
   display: flex;
   align-items: center;
+  gap: var(--str-video__spacing-sm);
 }
 .str-video__participant-list .str-video__participant-list-header .str-video__participant-list-header__title {
   flex: 1;
-  font-size: var(--str-video__font-size-sm);
+  font-size: var(--str-video__typography-font-size-md);
+  line-height: var(--str-video__typography-line-height-normal);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  color: var(--str-video__text-primary);
+}
+.str-video__participant-list .str-video__participant-list-header .str-video__participant-list-header__title-count,
+.str-video__participant-list .str-video__participant-list-header .str-video__participant-list-header__title-anonymous {
+  color: var(--str-video__text-tertiary);
 }
 .str-video__participant-list .str-video__participant-list-header .str-video__participant-list-header__close-button > span {
-  height: 15px;
-  width: 15px;
+  inline-size: var(--str-video__icon-size-sm);
+  block-size: var(--str-video__icon-size-sm);
 }
 .str-video__participant-list .str-video__search-input__container {
   margin-top: var(--str-video__spacing-md);
@@ -1127,8 +2259,8 @@
 .str-video__participant-list .str-video__participant-list__content-header {
   display: flex;
   align-items: center;
-  gap: 0.5rem;
-  margin-top: var(--str-video__spacing-md);
+  gap: var(--str-video__spacing-xs);
+  margin-top: var(--str-video__spacing-xs);
   justify-content: flex-end;
 }
 .str-video__participant-list .str-video__participant-list__content-header .str-video__participant-list__content-header-title {
@@ -1136,30 +2268,22 @@
   align-items: center;
   justify-content: flex-end;
 }
-.str-video__participant-list .str-video__participant-list__content-header .str-video__call-controls__button {
-  width: 1.75rem;
-  height: 1.75rem;
-  display: flex;
-  padding: unset;
-  align-items: center;
-  justify-content: center;
-}
-.str-video__participant-list .str-video__participant-list__content-header .str-video__call-controls__button .str-video__icon--filter {
-  width: 1rem;
-  height: 1rem;
+.str-video__participant-list .str-video__participant-list__content-header .str-video__participant-list__filter-button .str-video__icon--filter {
+  inline-size: var(--str-video__icon-size-sm);
+  block-size: var(--str-video__icon-size-sm);
 }
 .str-video__participant-list .str-video__participant-list__content {
   height: auto;
   flex-grow: 1;
   overflow-y: auto;
-  margin-top: var(--str-video__spacing-xl);
+  margin-top: var(--str-video__spacing-xs);
 }
 .str-video__participant-list .str-video__participant-list__footer {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: stretch;
-  gap: 0.5rem;
+  gap: var(--str-video__spacing-xs);
 }
 .str-video__participant-list .str-video__search-results--loading {
   display: flex;
@@ -1178,8 +2302,10 @@
   display: flex;
   align-items: center;
   width: 100%;
-  padding: var(--str-video__spacing-md);
-  font-size: var(--str-video__font-size-sm);
+  padding: var(--str-video__spacing-sm);
+  font-size: var(--str-video__typography-font-size-sm);
+  line-height: var(--str-video__typography-line-height-normal);
+  color: var(--str-video__text-secondary);
 }
 
 .str-video__invite-link-button {
@@ -1204,15 +2330,13 @@
   display: flex;
   justify-content: space-between;
   gap: var(--str-video__spacing-sm);
-  padding-block: 0.5rem;
+  padding-block: var(--str-video__spacing-xs);
   width: 100%;
   align-items: center;
 }
-.str-video__participant-listing-item .str-video__call-controls__button {
-  padding: unset;
-}
 .str-video__participant-listing-item .str-video__participant-listing-item__display-name {
   flex: 1;
+  min-inline-size: 0;
   white-space: nowrap;
   overflow-y: visible;
   overflow-x: hidden;
@@ -1227,15 +2351,19 @@
 .str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group {
   display: flex;
   align-items: center;
-  gap: var(--str-video__spacing-sm);
+  flex-shrink: 0;
+  gap: var(--str-video__spacing-xs);
 }
 .str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon {
-  width: 0.75rem;
-  height: 0.75rem;
+  inline-size: var(--str-video__icon-size-sm);
+  block-size: var(--str-video__icon-size-sm);
 }
 
 .str-video__participant-listing-item .str-video__participant-listing-item__display-name {
-  font-size: 13px;
+  font-size: var(--str-video__typography-font-size-sm);
+  line-height: var(--str-video__typography-line-height-normal);
+  font-weight: var(--str-video__typography-font-weight-regular);
+  color: var(--str-video__text-primary);
 }
 .str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-mic {
   -webkit-mask-image: var(--str-video__icon--mic);
@@ -1246,7 +2374,7 @@
   mask-position: center;
   -webkit-mask-size: contain;
   mask-size: contain;
-  background-color: var(--str-video__text-color1);
+  background-color: var(--str-video__text-primary);
 }
 .str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-mic-off {
   -webkit-mask-image: var(--str-video__icon--mic-off);
@@ -1257,7 +2385,7 @@
   mask-position: center;
   -webkit-mask-size: contain;
   mask-size: contain;
-  background-color: var(--str-video__danger-color);
+  background-color: var(--str-video__accent-error);
 }
 .str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-camera {
   -webkit-mask-image: var(--str-video__icon--camera);
@@ -1268,7 +2396,7 @@
   mask-position: center;
   -webkit-mask-size: contain;
   mask-size: contain;
-  background-color: var(--str-video__text-color1);
+  background-color: var(--str-video__text-primary);
 }
 .str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-camera-off {
   -webkit-mask-image: var(--str-video__icon--camera-off);
@@ -1279,7 +2407,7 @@
   mask-position: center;
   -webkit-mask-size: contain;
   mask-size: contain;
-  background-color: var(--str-video__danger-color);
+  background-color: var(--str-video__accent-error);
 }
 .str-video__participant-listing-item .str-video__participant-listing-item__media-indicator-group .str-video__participant-listing-item__icon-pinned {
   -webkit-mask-image: var(--str-video__icon--pin);
@@ -1290,7 +2418,7 @@
   mask-position: center;
   -webkit-mask-size: contain;
   mask-size: contain;
-  background-color: var(--str-video__text-color1);
+  background-color: var(--str-video__text-primary);
 }
 
 .str-video__call-preview {
@@ -1300,229 +2428,127 @@
   object-fit: contain;
 }
 
-.str-video__call-recording-list__list {
-  display: flex;
-  flex-direction: column;
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-.str-video__call-recording-list__list:first-of-type .str-video__call-recording-list__item {
-  font-weight: 600;
-}
-
-.str-video__call-recording-list__item {
+.str-video__call-recording-list__header {
   display: flex;
   flex-direction: row;
-  justify-content: space-between;
   align-items: center;
-  font-size: var(--str-video__font-size-xs);
-  border-bottom: 1px solid var(--str-video__base-color2);
-  padding: var(--str-video__spacing-sm) 0;
-  gap: var(--str-video__spacing-sm);
-}
-.str-video__call-recording-list__item:last-of-type {
-  border-bottom: none;
-}
-
-.str-video__call-recording-list__filename {
-  width: 200px;
-}
-
-.str-video__call-recording-list__time {
-  width: 100px;
-}
-
-.str-video__call-recording-list__download {
-  display: flex;
-  justify-content: flex-end;
-  width: 100px;
-}
-
-.str-video__call-recording-list__filename,
-.str-video__call-recording-list__time {
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-
-.str-video__call-recording-list-item__action-button--download .str-video__icon--download {
-  height: 32px;
-  width: 32px;
-}
-.str-video__call-recording-list-item__action-button--download:hover .str-video__icon--download {
-  cursor: pointer;
-  background-color: var(--str-video__brand-color1);
-}
-
-.str-video__call-recording-list__title {
-  font-weight: 500;
-  font-size: 1rem;
-  line-height: 1.25rem;
-}
-
-.str-video__call-controls__button--icon-call-recordings {
-  -webkit-mask-image: var(--str-video__icon--film-roll);
-  mask-image: var(--str-video__icon--film-roll);
-  -webkit-mask-repeat: no-repeat;
-  mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-position: center;
-  -webkit-mask-size: 2px;
-  mask-size: 2px;
-  background-color: var(--str-video__text-color1);
-}
-
-.str-video__call-recordings__toggle-button--active {
-  background-color: var(--str-video__background-color7);
-}
-
-.str-video__refresh-button {
-  background-color: transparent;
-  cursor: pointer;
-  border-radius: 4px;
-}
-.str-video__refresh-button:hover {
-  background-color: var(--str-video__background-color7);
-}
-.str-video__refresh-button:active {
-  background-color: var(--str-video__background-color5);
-  transition: background-color 0.2s ease-out;
-}
-.str-video__refresh-button .str-video__refresh-button--icon {
-  -webkit-mask-image: var(--str-video__icon--refresh);
-  mask-image: var(--str-video__icon--refresh);
-  -webkit-mask-repeat: no-repeat;
-  mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-position: center;
-  -webkit-mask-size: contain;
-  mask-size: contain;
-  background-color: var(--str-video__text-color1);
-}
-
-.str-video__call-recording-list__listing--icon-empty {
-  -webkit-mask-image: var(--str-video__icon--film-roll);
-  mask-image: var(--str-video__icon--film-roll);
-  -webkit-mask-repeat: no-repeat;
-  mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-position: center;
-  -webkit-mask-size: contain;
-  mask-size: contain;
-  background-color: var(--str-video__text-color1);
+  justify-content: space-between;
+  gap: var(--str-video__spacing-md);
 }
 
-.str-video__call-stats {
-  border-radius: var(--str-video__border-radius-lg);
-  background-color: var(--str-video__base-color7);
-  padding: var(--str-video__spacing-md);
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  gap: 0.75rem;
-}
-.str-video__call-stats h3 {
-  margin: unset;
-}
-.str-video__call-stats .str-video__call-stats__header {
+.str-video__call-recording-list__list {
   display: flex;
   flex-direction: column;
-  margin-bottom: var(--str-video__spacing-md);
-}
-.str-video__call-stats .str-video__call-stats__heading {
-  display: flex;
-  align-items: center;
-}
-.str-video__call-stats .str-video__call-stats__icon {
-  margin-right: var(--str-video__spacing-sm);
-  height: 18px;
-  width: 18px;
+  list-style: none;
+  margin: 0;
+  padding: 0;
 }
-.str-video__call-stats .str-video__call-stats__description {
-  font-size: var(--str-video__font-size-sm);
-  margin-bottom: var(--str-video__spacing-sm);
-  font-weight: 600;
+.str-video__call-recording-list__list:first-of-type .str-video__call-recording-list__item {
+  background-color: var(--str-video__background-core-surface-card);
+  font-size: var(--str-video__typography-font-size-xs);
+  line-height: var(--str-video__typography-line-height-tight);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  color: var(--str-video__text-secondary);
 }
-.str-video__call-stats .str-video__call-stats__card-container {
-  --gap: 1rem;
+
+.str-video__call-recording-list__item {
   display: flex;
-  flex-wrap: wrap;
   flex-direction: row;
-  gap: var(--gap);
+  align-items: center;
+  padding: var(--str-video__spacing-sm);
+  gap: var(--str-video__spacing-xs);
+  border-radius: var(--str-video__radius-lg);
+  font-size: var(--str-video__typography-font-size-sm);
+  line-height: var(--str-video__typography-line-height-normal);
+  font-weight: var(--str-video__typography-font-weight-regular);
+  color: var(--str-video__text-primary);
 }
-.str-video__call-stats .str-video__call-stats__card {
-  display: flex;
-  justify-content: space-between;
-  background-color: var(--str-video__background-color4);
-  border-radius: var(--str-video__border-radius-xs);
-  width: calc(50% - var(--gap) / 2);
-  padding: 0.5rem 0.5rem;
+
+.str-video__call-recording-list__filename,
+.str-video__call-recording-list__time {
+  flex: 0 1 120px;
+  min-width: 0;
+  text-overflow: ellipsis;
+  overflow: hidden;
 }
-.str-video__call-stats .str-video__call-stats__card .str-video__call-stats__card-content {
+
+.str-video__call-recording-list__download {
   display: flex;
-  flex-direction: column;
+  justify-content: flex-end;
+  flex: 0 0 var(--str-video__button-visual-height-xs);
+  margin-inline-start: auto;
 }
-.str-video__call-stats .str-video__call-stats__card .str-video__call-stats__card-label {
+
+.str-video__call-recording-list-item__action-button--download {
   display: flex;
-  color: var(--str-video__text-color2);
-  font-size: 0.5625rem;
-  font-weight: 500;
-  text-transform: uppercase;
-}
-.str-video__call-stats .str-video__call-stats__card .str-video__call-stats__card-value {
-  font-size: 1.0625rem;
-  font-weight: 500;
-  line-height: 1.25rem;
+  align-items: center;
+  justify-content: center;
+  inline-size: var(--str-video__button-visual-height-xs);
+  block-size: var(--str-video__button-visual-height-xs);
+  padding: var(--str-video__button-padding-y-xs) var(--str-video__button-padding-x-icon-only-xs);
+  border-radius: var(--str-video__button-radius-full);
 }
-.str-video__call-stats .str-video__call-explanation__icon {
-  height: 12px;
-  width: 12px;
-  margin-left: var(--str-video__spacing-xs);
+.str-video__call-recording-list-item__action-button--download .str-video__icon--download {
+  height: var(--str-video__icon-size-sm);
+  width: var(--str-video__icon-size-sm);
+  background-color: var(--str-video__button-secondary-text);
 }
-.str-video__call-stats .str-video__call-explanation__icon:hover {
+.str-video__call-recording-list-item__action-button--download:hover {
   cursor: pointer;
+  background-color: var(--str-video__background-utility-hover);
 }
-.str-video__call-stats .str-video__call-explanation__description {
-  background-color: var(--str-video__base-color3);
-  padding: var(--str-video__spacing-xs);
-  font-size: var(--str-video__font-size-xs);
-  border-radius: var(--str-video__border-radius-xs);
-}
-.str-video__call-stats .str-video__call-stats-line-chart-container {
-  position: relative;
-  margin: auto;
-  height: 170px;
-  width: 100%;
+.str-video__call-recording-list-item__action-button--download:active {
+  background-color: var(--str-video__background-utility-pressed);
 }
-.str-video__call-stats .str-video__call-stats__tag {
-  border-radius: var(--str-video__border-radius-sm);
-  padding: var(--str-video__spacing-xs);
-  font-size: var(--str-video__font-size-sm);
-  font-weight: 600;
-  height: 30px;
+
+.str-video__call-recording-list__title {
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  font-size: var(--str-video__typography-font-size-md);
+  line-height: var(--str-video__typography-line-height-normal);
+  color: var(--str-video__text-primary);
 }
-.str-video__call-stats .str-video__call-stats__tag--good {
-  color: var(--str-video__alert-success);
-  background-color: var(--str-video__alert-success-background);
+
+.str-video__call-recording-list__listing--empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: var(--str-video__spacing-sm);
+  padding: var(--str-video__spacing-3xl) var(--str-video__spacing-xl);
 }
-.str-video__call-stats .str-video__call-stats__tag--ok {
-  color: var(--str-video__alert-caution);
-  background-color: var(--str-video__alert-caution-background);
+
+.str-video__call-recording-list__listing--icon-empty {
+  flex: 0 0 auto;
+  inline-size: var(--str-video__icon-size-lg);
+  block-size: var(--str-video__icon-size-lg);
+  -webkit-mask-image: var(--str-video__icon--film-roll);
+  mask-image: var(--str-video__icon--film-roll);
+  -webkit-mask-repeat: no-repeat;
+  mask-repeat: no-repeat;
+  -webkit-mask-position: center;
+  mask-position: center;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+  background-color: var(--str-video__text-tertiary);
 }
-.str-video__call-stats .str-video__call-stats__tag--bad {
-  color: var(--str-video__alert-warning);
-  background-color: var(--str-video__alert-warming-background);
+
+.str-video__call-recording-list__listing--text-empty {
+  margin: 0;
+  max-inline-size: var(--str-video__size-320);
+  text-align: center;
+  font-size: var(--str-video__typography-font-size-sm);
+  line-height: var(--str-video__typography-line-height-normal);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  color: var(--str-video__text-primary);
 }
 
-.str-video__device-settings__button .str-video__call-controls__button--icon-device-settings {
-  width: 1.25rem;
-  height: 1.25rem;
+.str-video__device-settings__button .str-video__icon--device-settings {
+  width: var(--str-video__icon-size-md);
+  height: var(--str-video__icon-size-md);
 }
 
 .str-video__device-settings {
-  padding: 0.625rem;
   z-index: 1;
-  font-family: "Inter";
 }
 
 .str-video__device-settings__header {
@@ -1536,104 +2562,171 @@
 .str-video__icon.str-video__device-settings__settings-icon {
   height: 24px;
   width: 24px;
-  color: var(--str-video__base-color1);
+  color: var(--str-video__text-primary);
 }
 
 .str-video__device-settings__close-button {
-  color: var(--str-video__base-color1);
+  color: var(--str-video__text-primary);
   background-color: transparent;
 }
 
+.str-video__menu-container:has(.str-video__device-settings__device-kind) {
+  padding-block: var(--str-video__spacing-xxs);
+}
+
 .str-video__device-settings__device-kind {
-  padding: var(--str-video__spacing-lg);
+  display: flex;
+  flex-direction: column;
+  gap: var(--str-video__spacing-xxxs);
 }
 .str-video__device-settings__device-kind .str-video__device-settings__device-selector-title {
-  font-size: var(--str-video__font-size-sm);
-  font-weight: bold;
-  line-height: 1.25rem;
-  padding-bottom: 0.5rem;
-  margin-bottom: var(--str-video__spacing-sm);
+  display: flex;
+  align-items: center;
+  min-height: 32px;
+  margin-inline: var(--str-video__spacing-xxs);
+  padding-inline: var(--str-video__spacing-xs);
+  color: var(--str-video__text-tertiary);
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  line-height: var(--str-video__typography-line-height-normal);
 }
 .str-video__device-settings__device-kind .str-video__option,
 .str-video__device-settings__device-kind .str-video__device-settings__option {
   display: flex;
   align-items: center;
-  border-radius: var(--str-video__border-radius-lg);
-  background-color: var(--str-video__button-primary-base);
-  padding: var(--str-video__spacing-sm) var(--str-video__spacing-lg);
-  gap: var(--str-video__spacing-sm);
-  font-weight: 600;
-  font-size: var(--str-video__font-size-sm);
-  line-height: var(--str-video__spacing-lg);
-}
-.str-video__device-settings__device-kind .str-video__option:not(:first-of-type),
-.str-video__device-settings__device-kind .str-video__device-settings__option:not(:first-of-type) {
-  margin-top: var(--str-video__spacing-sm);
+  min-height: 32px;
+  border-radius: var(--str-video__radius-md);
+  margin-inline: var(--str-video__spacing-xxs);
+  padding-inline: var(--str-video__spacing-xs);
+  gap: var(--str-video__spacing-xs);
+  color: var(--str-video__text-primary);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  font-size: var(--str-video__typography-font-size-sm);
+  line-height: var(--str-video__typography-line-height-normal);
+}
+.str-video__device-settings__device-kind .str-video__option__label,
+.str-video__device-settings__device-kind .str-video__device-settings__option__label {
+  flex: 1 0 0;
+  min-inline-size: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .str-video__device-settings__device-kind .str-video__option__icon--selected,
 .str-video__device-settings__device-kind .str-video__device-settings__option__icon--selected {
-  background-color: var(--str-video__brand-color1);
+  background-color: var(--str-video__accent-primary);
 }
 .str-video__device-settings__device-kind .str-video__option:hover,
 .str-video__device-settings__device-kind .str-video__device-settings__option:hover {
-  background-color: var(--str-video__button-default-hover);
+  background-color: var(--str-video__background-utility-hover);
   cursor: pointer;
 }
-.str-video__device-settings__device-kind .str-video__option--selected, .str-video__device-settings__device-kind .str-video__option--active,
-.str-video__device-settings__device-kind .str-video__device-settings__option--selected,
-.str-video__device-settings__device-kind .str-video__device-settings__option--active {
-  background-color: var(--str-video__button-default-hover);
+.str-video__device-settings__device-kind .str-video__option--disabled,
+.str-video__device-settings__device-kind .str-video__device-settings__option--disabled {
+  color: var(--str-video__text-disabled);
+}
+.str-video__device-settings__device-kind .str-video__option--disabled:hover,
+.str-video__device-settings__device-kind .str-video__device-settings__option--disabled:hover {
+  background-color: transparent;
+  cursor: default;
 }
 .str-video__device-settings__device-kind .str-video__option input[type=radio],
 .str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio] {
+  appearance: none;
   margin: 0;
-  height: 1rem;
-  width: 1rem;
+  inline-size: var(--str-video__icon-size-sm);
+  block-size: var(--str-video__icon-size-sm);
   display: grid;
   place-content: center;
+  background-color: var(--str-video__control-radio-button-bg);
+  border: var(--str-video__w100) solid var(--str-video__border-core-on-elevation);
+  border-radius: var(--str-video__radius-max);
 }
 .str-video__device-settings__device-kind .str-video__option input[type=radio]::before,
 .str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]::before {
   content: "";
-  width: 0.5rem;
-  height: 0.5rem;
+  inline-size: var(--str-video__size-8);
+  block-size: var(--str-video__size-8);
+  border-radius: var(--str-video__radius-max);
+  background-color: var(--str-video__control-radio-button-indicator);
   transform: scale(0);
 }
+.str-video__device-settings__device-kind .str-video__option input[type=radio]:checked,
+.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:checked {
+  background-color: var(--str-video__control-radio-button-bg-selected);
+  border-color: var(--str-video__control-radio-button-bg-selected);
+}
 .str-video__device-settings__device-kind .str-video__option input[type=radio]:checked::before,
 .str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:checked::before {
   transform: scale(1);
 }
-.str-video__device-settings__device-kind .str-video__option input[type=radio]:checked,
-.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:checked {
-  border-color: var(--str-video__primary-color);
+.str-video__device-settings__device-kind .str-video__option input[type=radio]:focus-visible,
+.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:focus-visible {
+  outline: var(--str-video__w200) solid var(--str-video__border-utility-focused);
+  outline-offset: var(--str-video__w100);
+}
+.str-video__device-settings__device-kind .str-video__option input[type=radio]:disabled,
+.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:disabled {
+  border-color: var(--str-video__border-utility-disabled);
+  cursor: default;
+}
+.str-video__device-settings__device-kind .str-video__option input[type=radio]:disabled:checked,
+.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:disabled:checked {
+  background-color: var(--str-video__background-utility-disabled);
+  border-color: var(--str-video__background-utility-disabled);
+}
+.str-video__device-settings__device-kind .str-video__option input[type=radio]:disabled:checked::before,
+.str-video__device-settings__device-kind .str-video__device-settings__option input[type=radio]:disabled:checked::before {
+  background-color: var(--str-video__text-disabled);
+}
+
+.str-video__device-settings__device-kind:has(.str-video__device-settings__option) {
+  inline-size: 296px;
+}
+
+.str-video__device-settings__device-kind:has(.str-video__device-preview) {
+  padding: var(--str-video__spacing-md);
+  gap: var(--str-video__spacing-xs);
+}
+.str-video__device-settings__device-kind:has(.str-video__device-preview) .str-video__device-settings__device-selector-title {
+  margin-inline: 0;
+  padding-inline: 0;
 }
 
 .str-video__device-settings__separator {
-  border-color: var(--str-video__base-color3);
+  margin: var(--str-video__spacing-xxs) 0 3px;
+  border: 0;
+  border-block-start: var(--str-video__w100) solid var(--str-video__border-core-default);
+}
+
+.str-video__device-settings__device-kind:last-child .str-video__device-settings__separator:last-child {
+  display: none;
 }
 
 .str-video__audio-volume-indicator {
-  width: 100%;
   display: flex;
   align-items: center;
+  min-height: 32px;
+  margin-inline: var(--str-video__spacing-xxs);
+  padding-inline: var(--str-video__spacing-xs);
   gap: var(--str-video__spacing-xs);
-  padding: var(--str-video__spacing-sm) var(--str-video__spacing-md);
 }
 .str-video__audio-volume-indicator .str-video__icon {
-  width: var(--str-video__font-size-xxl);
-  height: var(--str-video__font-size-xxl);
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
+  background-color: var(--str-video__text-secondary);
 }
 .str-video__audio-volume-indicator .str-video__audio-volume-indicator__bar {
   flex: 1;
-  background-color: var(--str-video__base-color1);
-  height: var(--str-video__spacing-xs);
-  border-radius: var(--str-video__border-radius-xs);
+  block-size: var(--str-video__size-8);
+  background-color: var(--str-video__control-progress-bar-track);
+  border-radius: var(--str-video__radius-max);
 }
 .str-video__audio-volume-indicator .str-video__audio-volume-indicator__bar-value {
   width: 100%;
   height: 100%;
-  background: var(--str-video__primary-color);
-  border-radius: var(--str-video__border-radius-xs);
+  background: var(--str-video__control-progress-bar-fill-audio);
+  border-radius: var(--str-video__radius-max);
   transform-origin: left center;
   transform: scaleX(0);
 }
@@ -1641,19 +2734,19 @@
 .str-video__device-level-indicator {
   display: flex;
   align-items: center;
-  gap: 0.125rem;
+  gap: var(--str-video__spacing-xxxs);
   flex-shrink: 0;
   margin-left: auto;
 }
 .str-video__device-level-indicator .str-video__device-level-indicator__bar {
-  width: 0.1875rem;
-  height: 0.75rem;
-  border-radius: var(--str-video__border-radius-xs);
-  background-color: var(--str-video__base-color3);
+  width: 3px;
+  height: var(--str-video__size-12);
+  border-radius: var(--str-video__radius-max);
+  background-color: var(--str-video__indicator-microphone-level-bar-inactive);
   transition: background-color 0.1s;
 }
 .str-video__device-level-indicator .str-video__device-level-indicator__bar--active {
-  background-color: var(--str-video__primary-color);
+  background-color: var(--str-video__indicator-microphone-level-bar-active);
 }
 
 .str-video__device-preview {
@@ -1667,12 +2760,12 @@
   display: flex;
   flex-direction: column;
   align-items: stretch;
-  max-width: 12rem;
+  max-width: 192px;
   cursor: pointer;
 }
 .str-video__device-preview .str-video__device-preview__label {
-  padding: var(--str-video__spacing-xs) 0;
-  font-size: var(--str-video__font-size-xs);
+  padding: var(--str-video__space-6) 0;
+  font-size: var(--str-video__typography-font-size-xs);
   text-align: center;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -1683,28 +2776,33 @@
   width: 100%;
   aspect-ratio: 16/9;
   object-fit: cover;
-  border-radius: var(--str-video__border-radius-sm);
-  border: 2px solid var(--str-video__base-color3);
-  background-color: var(--str-video__base-color5);
+  border-radius: var(--str-video__radius-sm);
+  border: var(--str-video__w200) solid var(--str-video__border-core-default);
+  background-color: var(--str-video__background-core-elevation-1);
   transform: scaleX(-1);
 }
 .str-video__device-preview--selected .str-video__device-video-preview__video {
-  border-color: var(--str-video__primary-color);
+  border-color: var(--str-video__accent-primary);
 }
 
 .str-video__speaker-test {
-  padding: var(--str-video__spacing-sm) 0;
+  --str-video__button-secondary-border: var(
+    --str-video__border-core-on-elevation
+  );
+  padding: var(--str-video__spacing-xs) var(--str-video__spacing-sm);
 }
 .str-video__speaker-test .str-video__speaker-test__button-content {
   display: flex;
   align-items: center;
-  gap: var(--str-video__spacing-sm);
-  padding: 0 var(--str-video__spacing-sm);
-  font-size: var(--str-video__font-size-sm);
-  font-weight: 600;
+  gap: var(--str-video__spacing-xs);
+  padding: 0 var(--str-video__spacing-xs);
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
 }
-.str-video__speaker-test .str-video__composite-button__button {
-  width: 100% !important;
+.str-video__speaker-test .str-video__composite-button,
+.str-video__speaker-test .str-video__composite-button__group,
+.str-video__speaker-test .str-video__composite-button__action {
+  inline-size: 100%;
 }
 
 .str-video__dropdown {
@@ -1714,28 +2812,41 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  background-color: var(--str-video__base-color4);
-  border-radius: var(--str-video__border-radius-lg);
-  border: 1px solid var(--str-video__base-color6);
+  gap: var(--str-video__spacing-xs);
+  background-color: transparent;
+  box-shadow: inset 0 0 0 var(--str-video__w100) var(--str-video__border-core-default);
+  border-radius: var(--str-video__input-radius-select-input);
+  padding: var(--str-video__spacing-xs) var(--str-video__spacing-sm);
+  color: var(--str-video__input-text-default);
 }
 .str-video__dropdown-selected__label {
   display: flex;
   align-items: center;
-  font-weight: 600;
-  padding: var(--str-video__spacing-sm);
-  font-size: var(--str-video__font-size-xs);
-}
-.str-video__dropdown-selected__icon {
-  margin-right: var(--str-video__spacing-sm);
-}
-.str-video__dropdown-selected__chevron {
-  margin-right: var(--str-video__spacing-md);
+  gap: var(--str-video__spacing-xs);
+  min-inline-size: 0;
+  padding-block: var(--str-video__spacing-xxxs);
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-regular);
+  line-height: var(--str-video__typography-line-height-normal);
+}
+.str-video__dropdown-selected__text {
+  min-inline-size: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .str-video__dropdown-selected > *:hover, .str-video__dropdown-selected:hover {
   cursor: pointer;
 }
 .str-video__dropdown-selected:hover {
-  border: 1px solid var(--str-video__brand-color1);
+  box-shadow: inset 0 0 0 var(--str-video__w100) var(--str-video__border-utility-hover);
+}
+.str-video__dropdown-selected[aria-expanded=true] {
+  box-shadow: inset 0 0 0 var(--str-video__w100) var(--str-video__border-utility-active);
+}
+.str-video__dropdown-selected:focus-visible {
+  outline: var(--str-video__w200) solid var(--str-video__border-utility-focused);
+  outline-offset: calc(var(--str-video__w200) * -1);
 }
 .str-video__dropdown-list {
   display: flex;
@@ -1743,56 +2854,51 @@
   position: absolute;
   z-index: 2;
   width: 100%;
-  margin-top: var(--str-video__spacing-sm);
-  background-color: var(--str-video__base-color6);
-  border-radius: var(--str-video__border-radius-lg);
-  padding: var(--str-video__spacing-md);
-  gap: var(--str-video__spacing-sm);
-  box-shadow: 0 0 24px -4px rgba(0, 0, 0, 0.64);
+  margin-top: var(--str-video__spacing-xxs);
+  background-color: var(--str-video__background-core-elevation-2);
+  border-radius: var(--str-video__radius-lg);
+  box-shadow: var(--str-video__box-shadow-3);
+  padding: var(--str-video__spacing-xxs) var(--str-video__spacing-none);
+  gap: var(--str-video__spacing-xxxs);
 }
 .str-video__dropdown-option {
   display: flex;
   align-items: center;
-  border-radius: var(--str-video__border-radius-lg);
-  padding: 8px 16px;
-  gap: 8px;
-  font-weight: 600;
-  font-size: var(--str-video__font-size-sm);
+  min-height: 32px;
+  margin-inline: var(--str-video__spacing-xxs);
+  padding-inline: var(--str-video__spacing-xs);
+  gap: var(--str-video__spacing-xs);
+  border-radius: var(--str-video__radius-md);
+  color: var(--str-video__text-primary);
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  line-height: var(--str-video__typography-line-height-normal);
+}
+.str-video__dropdown-option .str-video__icon {
+  background-color: var(--str-video__text-secondary);
 }
 .str-video__dropdown-option:hover {
-  background-color: var(--str-video__button-default-hover);
+  background-color: var(--str-video__background-utility-hover);
   cursor: pointer;
 }
-.str-video__dropdown-option--selected {
-  background-color: var(--str-video__button-primary-active);
-  color: var(--str-video__text-color1);
-}
-.str-video__dropdown-option--selected:hover {
-  background-color: var(--str-video__button-primary-hover);
-}
-.str-video__dropdown-icon {
-  background-color: var(--str-video__icon-default);
+.str-video__dropdown-option:active {
+  background-color: var(--str-video__background-utility-pressed);
 }
-.str-video__dropdown__option:hover .str-video__dropdown-icon {
-  background-color: var(--str-video__icon-hover);
+.str-video__dropdown-option:focus-visible {
+  outline: var(--str-video__w200) solid var(--str-video__border-utility-focused);
+  outline-offset: calc(var(--str-video__w200) * -1);
 }
-.str-video__dropdown-option--selected .str-video__dropdown-icon {
-  background-color: var(--str-video__text-color1);
-}
-.str-video__dropdown-label {
-  font-size: var(--str-video__font-size-xs);
-}
-.str-video__dropdown__option:hover .str-video__dropdown-label {
-  color: var(--str-video__base-color1);
+.str-video__dropdown-option--selected {
+  background-color: var(--str-video__background-utility-selected);
 }
 
-@media (min-width: 600px) {
-  .str-video__dropdown-selected__label {
-    font-size: var(--str-video__font-size-sm);
-  }
+.str-video__icon.str-video__dropdown-selected__icon,
+.str-video__icon.str-video__dropdown-selected__chevron {
+  background-color: var(--str-video__input-text-icon);
 }
+
 .str-video__icon {
-  background-color: var(--str-video__icon-default);
+  background-color: var(--str-video__text-on-accent);
 }
 .str-video__icon--reactions {
   -webkit-mask-image: var(--str-video__icon--reactions);
@@ -1802,27 +2908,26 @@
   -webkit-mask-image: var(--str-video__icon--call-latency);
   mask-image: var(--str-video__icon--call-latency);
 }
+.str-video__icon--poll {
+  -webkit-mask-image: var(--str-video__icon--poll);
+  mask-image: var(--str-video__icon--poll);
+}
 .str-video__icon--network-quality {
   -webkit-mask-image: var(--str-video__icon--network-quality);
   mask-image: var(--str-video__icon--network-quality);
 }
+.str-video__icon--low-bandwidth-fill {
+  -webkit-mask-image: var(--str-video__icon--low-bandwidth-fill);
+  mask-image: var(--str-video__icon--low-bandwidth-fill);
+}
 .str-video__icon--recording-on {
   -webkit-mask-image: var(--str-video__icon--recording-on);
   mask-image: var(--str-video__icon--recording-on);
 }
-.str-video__icon--caret-up {
-  -webkit-mask-image: var(--str-video__icon--caret-up);
-  mask-image: var(--str-video__icon--caret-up);
-}
 .str-video__icon--download {
   -webkit-mask-image: var(--str-video__icon--download);
   mask-image: var(--str-video__icon--download);
 }
-.str-video__icon--caret-down {
-  -webkit-mask-image: var(--str-video__icon--caret-down);
-  mask-image: var(--str-video__icon--caret-down);
-  transform: rotate(180deg);
-}
 .str-video__icon--chevron-right {
   -webkit-mask-image: var(--str-video__icon--chevron-right);
   mask-image: var(--str-video__icon--chevron-right);
@@ -1834,11 +2939,7 @@
 .str-video__icon--loading {
   -webkit-mask-image: var(--str-video__icon--loading);
   mask-image: var(--str-video__icon--loading);
-  transform: rotate(360deg);
-  transition-duration: 1s;
-  transition-delay: now;
-  animation-timing-function: linear;
-  animation-iteration-count: infinite;
+  animation: rotation 1s linear infinite;
 }
 .str-video__icon--logout {
   -webkit-mask-image: var(--str-video__icon--logout);
@@ -1911,6 +3012,26 @@
   -webkit-mask-image: var(--str-video__icon--call-accept);
   mask-image: var(--str-video__icon--call-accept);
 }
+.str-video__icon--exclamation-mark-fill {
+  -webkit-mask-image: var(--str-video__icon--exclamation-mark-fill);
+  mask-image: var(--str-video__icon--exclamation-mark-fill);
+}
+.str-video__icon--exclamation-circle-fill {
+  -webkit-mask-image: var(--str-video__icon--exclamation-circle-fill);
+  mask-image: var(--str-video__icon--exclamation-circle-fill);
+}
+.str-video__icon--checkmark {
+  -webkit-mask-image: var(--str-video__icon--checkmark);
+  mask-image: var(--str-video__icon--checkmark);
+}
+.str-video__icon--question-mark-fill {
+  -webkit-mask-image: var(--str-video__icon--question-mark-fill);
+  mask-image: var(--str-video__icon--question-mark-fill);
+}
+.str-video__icon--sliders-fill {
+  -webkit-mask-image: var(--str-video__icon--sliders-fill);
+  mask-image: var(--str-video__icon--sliders-fill);
+}
 .str-video__icon--info {
   -webkit-mask-image: var(--str-video__icon--info-icon);
   mask-image: var(--str-video__icon--info-icon);
@@ -1919,6 +3040,22 @@
   -webkit-mask-image: var(--str-video__icon--stats);
   mask-image: var(--str-video__icon--stats);
 }
+.str-video__icon--speaker-off {
+  -webkit-mask-image: var(--str-video__icon--speaker-off);
+  mask-image: var(--str-video__icon--speaker-off);
+}
+.str-video__icon--pip {
+  -webkit-mask-image: var(--str-video__icon--pip);
+  mask-image: var(--str-video__icon--pip);
+}
+.str-video__icon--fullscreen {
+  -webkit-mask-image: var(--str-video__icon--fullscreen);
+  mask-image: var(--str-video__icon--fullscreen);
+}
+.str-video__icon--livestream-viewers {
+  -webkit-mask-image: var(--str-video__icon--livestream-viewers);
+  mask-image: var(--str-video__icon--livestream-viewers);
+}
 .str-video__icon--speaker {
   -webkit-mask-image: var(--str-video__icon--speaker);
   mask-image: var(--str-video__icon--speaker);
@@ -1944,8 +3081,8 @@
   mask-image: var(--str-video__icon--film-roll);
 }
 .str-video__icon--device-settings {
-  -webkit-mask-image: var(--str-video__icon--settings);
-  mask-image: var(--str-video__icon--settings);
+  -webkit-mask-image: var(--str-video__icon--settings-fill);
+  mask-image: var(--str-video__icon--settings-fill);
 }
 .str-video__icon--filter {
   -webkit-mask-image: var(--str-video__icon--filter);
@@ -1968,14 +3105,19 @@
   -webkit-mask-size: contain;
   mask-size: contain;
   display: block;
-  width: 1.25rem;
-  height: 1.25rem;
+  flex-shrink: 0;
+  inline-size: var(--str-video__icon-size-sm);
+  block-size: var(--str-video__icon-size-sm);
 }
 
 .str-video__loading-indicator {
   display: flex;
   flex-direction: column;
   align-items: center;
+  gap: var(--str-video__spacing-xs);
+}
+.str-video__loading-indicator .str-video__loading-indicator-text {
+  margin: 0;
 }
 
 .str-video__loading-indicator__icon.spinner {
@@ -1985,12 +3127,12 @@
   mask-repeat: no-repeat;
   -webkit-mask-position: center;
   mask-position: center;
-  -webkit-mask-size: 1rem;
-  mask-size: 1rem;
-  background-color: var(--str-video__text-color2);
+  -webkit-mask-size: var(--str-video__icon-size-sm);
+  mask-size: var(--str-video__icon-size-sm);
+  background-color: var(--str-video__text-tertiary);
   animation: rotation 1s linear infinite;
-  width: 1rem;
-  height: 1rem;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
 }
 
 @keyframes rotation {
@@ -2018,7 +3160,7 @@
   z-index: 1;
   width: 100vw;
   height: 100vh;
-  background-color: var(--str-video__backdrop1);
+  background-color: var(--str-video__background-core-overlay-dark);
   left: 0;
   top: 0;
 }
@@ -2035,96 +3177,111 @@
 }
 
 .str-video__menu-container {
-  background-color: var(--str-video__base-color6);
-  border-radius: var(--str-video__border-radius-lg);
-  box-shadow: 0 0 24px -4px rgba(0, 0, 0, 0.64);
+  background-color: var(--str-video__background-core-elevation-2);
+  border-radius: var(--str-video__radius-lg);
+  box-shadow: var(--str-video__box-shadow-3);
 }
 
 .str-video__generic-menu {
   list-style: none;
   margin: unset;
-  padding: var(--str-video__spacing-md);
+  padding: var(--str-video__spacing-xxs) var(--str-video__spacing-none);
   display: flex;
   flex-direction: column;
-  gap: var(--str-video__spacing-xs);
+  gap: var(--str-video__spacing-xxxs);
+  min-inline-size: 224px;
 }
 .str-video__generic-menu .str-video__generic-menu--item {
-  align-items: center;
-  gap: 8px;
-  font-weight: 600;
-  font-size: var(--str-video__font-size-md);
   display: flex;
+  align-items: center;
+  padding-inline: var(--str-video__spacing-xxs);
 }
 .str-video__generic-menu .str-video__generic-menu--item button {
   all: unset;
+  box-sizing: border-box;
   width: 100%;
-  font-size: 13px;
-  border-radius: var(--str-video__border-radius-lg);
-  background-color: var(--str-video__button-primary-base);
-  padding: var(--str-video__spacing-xs) var(--str-video__spacing-lg);
-  gap: 10px;
+  min-height: 32px;
   display: flex;
   align-items: center;
-  position: relative;
-}
-.str-video__generic-menu .str-video__generic-menu--item button:hover {
-  background-color: var(--str-video__button-default-hover);
+  gap: var(--str-video__spacing-xs);
+  padding-inline: var(--str-video__spacing-xs);
+  border-radius: var(--str-video__radius-md);
+  color: var(--str-video__text-primary);
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  line-height: var(--str-video__typography-line-height-normal);
+}
+.str-video__generic-menu .str-video__generic-menu--item button .str-video__icon {
+  background-color: var(--str-video__text-secondary);
+}
+.str-video__generic-menu .str-video__generic-menu--item button:hover:not(:disabled) {
+  background-color: var(--str-video__background-utility-hover);
   cursor: pointer;
 }
-.str-video__generic-menu .str-video__generic-menu--item button--selected, .str-video__generic-menu .str-video__generic-menu--item button--active {
-  background-color: var(--str-video__button-primary-hover);
+.str-video__generic-menu .str-video__generic-menu--item button:active:not(:disabled) {
+  background-color: var(--str-video__background-utility-pressed);
 }
-.str-video__generic-menu .str-video__generic-menu--item button[aria-selected] {
-  padding: 5px 10px 5px 26px;
+.str-video__generic-menu .str-video__generic-menu--item button:not(:disabled):focus-visible {
+  outline: var(--str-video__w200) solid var(--str-video__border-utility-focused);
+  outline-offset: calc(var(--str-video__w200) * -1);
 }
-.str-video__generic-menu .str-video__generic-menu--item button[aria-selected=true]::after {
-  content: "●";
-  font-size: 10px;
-  left: 10px;
-  position: absolute;
+.str-video__generic-menu .str-video__generic-menu--item button:disabled {
+  color: var(--str-video__text-disabled);
+}
+.str-video__generic-menu .str-video__generic-menu--item button:disabled .str-video__icon {
+  background-color: var(--str-video__text-disabled);
+}
+.str-video__generic-menu .str-video__generic-menu--item button[aria-current=true], .str-video__generic-menu .str-video__generic-menu--item button[aria-selected=true] {
+  background-color: var(--str-video__background-utility-selected);
+}
+
+.str-video__generic-menu--separator {
+  margin: var(--str-video__spacing-xxs) 0 3px;
+  border-block-start: var(--str-video__w100) solid var(--str-video__border-core-default);
+}
+
+.str-video__generic-menu--separator:first-child,
+.str-video__generic-menu--separator + .str-video__generic-menu--separator,
+.str-video__generic-menu--separator:not(:has(~ .str-video__generic-menu--item)) {
+  display: none;
 }
 
 .str-video__notification {
-  padding: 0.625rem;
+  min-height: var(--str-video__size-48);
+  max-width: var(--str-video__size-480);
   display: flex;
   align-items: center;
-  gap: 0.625rem;
+  gap: var(--str-video__spacing-xs);
+  padding-block: var(--str-video__spacing-sm);
+  padding-inline: var(--str-video__spacing-md);
 }
-.str-video__notification .str-video__notification__icon {
-  display: inline-block;
-  width: 1.5rem;
-  height: 1.5rem;
+.str-video__notification--success, .str-video__notification--error, .str-video__notification--loading {
+  padding-inline-start: var(--str-video__spacing-sm);
 }
 .str-video__notification .str-video__notification__message {
   flex: 1;
 }
 .str-video__notification .str-video__notification__close {
+  margin-inline-start: var(--str-video__spacing-xxs);
   display: inline-block;
-  width: 1rem;
-  height: 1rem;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
 }
 .str-video__notification .str-video__notification__close:hover {
   cursor: pointer;
 }
 
 .str-video__notification {
-  background-color: var(--str-video__background-color1);
-  border-radius: var(--str-video__border-radius-xs);
+  background-color: var(--str-video__background-core-inverse);
+  color: var(--str-video__text-on-inverse);
+  border-radius: var(--str-video__radius-3xl);
+  box-shadow: var(--str-video__box-shadow-3);
+  font-size: var(--str-video__typography-font-size-sm);
+  line-height: var(--str-video__typography-line-height-normal);
   z-index: 100;
 }
-.str-video__notification .str-video__notification__icon {
-  -webkit-mask-image: var(--str-video__icon--info-icon);
-  mask-image: var(--str-video__icon--info-icon);
-  -webkit-mask-repeat: no-repeat;
-  mask-repeat: no-repeat;
-  -webkit-mask-position: center;
-  mask-position: center;
-  -webkit-mask-size: 1.5rem;
-  mask-size: 1.5rem;
-  background-color: var(--str-video__text-color1);
-}
-.str-video__notification .str-video__notification__message {
-  font-size: 0.75rem;
+.str-video__notification > .str-video__icon {
+  background-color: var(--str-video__text-on-inverse);
 }
 
 .str-video__participant-view {
@@ -2137,88 +3294,91 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  border-radius: var(--str-video__border-radius-sm);
+  border-radius: var(--str-video__radius-2xl);
 }
 .str-video__participant-view--speaking {
-  outline: 2px solid var(--str-video__primary-color);
-}
-.str-video__participant-view .str-video__call-controls__button {
-  transition: opacity 200ms ease-out;
-  opacity: 0.3;
-  color: var(--str-video__text-color1);
-}
-.str-video__participant-view:hover .str-video__call-controls__button {
-  opacity: 1;
+  outline: var(--str-video__w200) solid var(--str-video__accent-primary);
 }
-.str-video__participant-view > .str-video__call-controls__button {
+.str-video__participant-view .str-video__participant-view__menu-button {
   position: absolute;
-  top: 0.875rem;
-  left: 0.875rem;
-  padding: 0.3rem;
+  top: var(--str-video__space-8);
+  left: var(--str-video__space-8);
 }
 .str-video__participant-view .str-video__participant-details {
   position: absolute;
-  left: 0;
-  bottom: 0;
+  inset: auto auto var(--str-video__space-8) var(--str-video__space-8);
+  min-block-size: var(--str-video__size-32);
+  max-inline-size: 256px;
   display: flex;
   align-items: center;
-  gap: var(--str-video__spacing-sm);
-  border-radius: 0 var(--str-video__border-radius-xs) 0 var(--str-video__border-radius-sm);
-  background-color: var(--str-video__background-color4);
+  gap: var(--str-video__spacing-xs);
+  border-radius: var(--str-video__radius-lg);
+  background-color: var(--str-video__background-core-overlay-dark-strong);
+  -webkit-backdrop-filter: blur(12.5px);
+  backdrop-filter: blur(12.5px);
 }
 .str-video__participant-view .str-video__participant-details .str-video__participant-details__name {
   display: flex;
   align-items: center;
-  gap: var(--str-video__spacing-sm);
-  padding: 4px 6px;
+  gap: var(--str-video__spacing-xxs);
+  padding: var(--str-video__space-4) var(--str-video__space-4) var(--str-video__space-4) var(--str-video__space-12);
+  font-size: var(--str-video__typography-font-size-xs);
+  line-height: var(--str-video__typography-line-height-tight);
+  font-weight: var(--str-video__typography-font-weight-regular);
+  color: var(--str-video__participant-label--color);
+}
+.str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name-text {
+  max-inline-size: 160px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  font-size: var(--str-video__font-size-sm);
+}
+.str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name-text:not(:last-child) {
+  margin-inline-end: var(--str-video__spacing-xxs);
 }
 .str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--audio-muted {
-  width: 1rem;
-  height: 1rem;
-  -webkit-mask-size: 1rem;
-  mask-size: 1rem;
-  background-color: var(--str-video__text-color1);
+  flex-shrink: 0;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
+  -webkit-mask-size: var(--str-video__icon-size-sm);
+  mask-size: var(--str-video__icon-size-sm);
+  background-color: var(--str-video__participant-label--color);
   -webkit-mask-image: var(--str-video__icon--mic-off);
   mask-image: var(--str-video__icon--mic-off);
 }
 .str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--audio-connecting .str-video__loading-indicator__icon {
-  width: 1rem;
-  height: 1rem;
-  border-width: 2px;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
+  border-width: var(--str-video__size-2);
 }
 .str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--video-muted {
-  width: 1rem;
-  height: 1rem;
-  -webkit-mask-size: 1rem;
-  mask-size: 1rem;
-  background-color: var(--str-video__text-color1);
+  flex-shrink: 0;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
+  -webkit-mask-size: var(--str-video__icon-size-sm);
+  mask-size: var(--str-video__icon-size-sm);
+  background-color: var(--str-video__participant-label--color);
   -webkit-mask-image: var(--str-video__icon--camera-off);
   mask-image: var(--str-video__icon--camera-off);
 }
 .str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--track-paused {
-  width: 1rem;
-  height: 1rem;
-  -webkit-mask-size: 1rem;
-  mask-size: 1rem;
-  background-color: var(--str-video__text-color1);
-  mask-image: var(--str-video__icon--low-bandwidth);
-  -webkit-mask-image: var(--str-video__icon--low-bandwidth);
+  flex-shrink: 0;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
+  -webkit-mask-size: var(--str-video__icon-size-sm);
+  mask-size: var(--str-video__icon-size-sm);
+  background-color: var(--str-video__participant-label--color);
+  mask-image: var(--str-video__icon--low-bandwidth-fill);
+  -webkit-mask-image: var(--str-video__icon--low-bandwidth-fill);
 }
 .str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--pinned {
   cursor: pointer;
-  width: 1rem;
-  height: 1rem;
-  -webkit-mask-size: 1rem;
-  mask-size: 1rem;
-  background-color: var(--str-video__text-color1);
-  width: 0.8rem;
-  height: 1rem;
-  -webkit-mask-size: 0.8rem;
-  mask-size: 0.8rem;
+  flex-shrink: 0;
+  width: var(--str-video__icon-size-sm);
+  height: var(--str-video__icon-size-sm);
+  -webkit-mask-size: var(--str-video__icon-size-sm);
+  mask-size: var(--str-video__icon-size-sm);
+  background-color: var(--str-video__participant-label--color);
   -webkit-mask-repeat: no-repeat;
   mask-repeat: no-repeat;
   -webkit-mask-position: center;
@@ -2226,56 +3386,57 @@
   -webkit-mask-image: var(--str-video__icon--pin);
   mask-image: var(--str-video__icon--pin);
 }
-.str-video__participant-view .str-video__participant-details .str-video__participant-details__name .str-video__participant-details__name--network-stats {
-  width: 1rem;
-  height: 1rem;
-  -webkit-mask-size: 1rem;
-  mask-size: 1rem;
-  background-color: var(--str-video__text-color1);
-  background-image: var(--str-video__icon--network-quality);
-  cursor: pointer;
-  margin-right: 0.625rem;
-}
-.str-video__participant-view .str-video__participant-details__connection-quality {
+.str-video__participant-view .str-video__connection-quality-indicator {
   position: absolute;
-  bottom: 0;
-  right: 0;
-  border-radius: var(--str-video__border-radius-sm) 0 var(--str-video__border-radius-sm) 0;
-  width: 24px;
-  height: 24px;
-  display: block;
-  background-size: cover;
-  background-color: var(--str-video__background-color4);
+  inset: auto var(--str-video__space-8) var(--str-video__space-8) auto;
+  inline-size: var(--str-video__size-32);
+  block-size: var(--str-video__size-32);
+  border-radius: var(--str-video__radius-max);
+  display: grid;
+  grid-auto-flow: column;
+  place-content: center;
+  align-items: end;
+  gap: 3px;
+}
+.str-video__participant-view .str-video__connection-quality-indicator .str-video__connection-quality-indicator__bar {
+  inline-size: var(--str-video__icon-stroke-emphasis);
+  border-radius: var(--str-video__radius-max);
 }
-.str-video__participant-view .str-video__participant-details__connection-quality--poor {
-  background-image: var(--str-video__icon--connection-quality-poor);
+.str-video__participant-view .str-video__connection-quality-indicator .str-video__connection-quality-indicator__bar:nth-child(1) {
+  block-size: 4px;
 }
-.str-video__participant-view .str-video__participant-details__connection-quality--good {
-  background-image: var(--str-video__icon--connection-quality-good);
+.str-video__participant-view .str-video__connection-quality-indicator .str-video__connection-quality-indicator__bar:nth-child(2) {
+  block-size: 7px;
 }
-.str-video__participant-view .str-video__participant-details__connection-quality--excellent {
-  background-image: var(--str-video__icon--connection-quality-excellent);
+.str-video__participant-view .str-video__connection-quality-indicator .str-video__connection-quality-indicator__bar:nth-child(3) {
+  block-size: 10px;
 }
 
 .str-video__speech-indicator {
   display: flex;
-  justify-content: space-between;
+  justify-content: center;
   align-items: center;
-  gap: 1px;
-  height: 16px;
+  gap: 3px;
+  flex-shrink: 0;
+  inline-size: var(--str-video__size-24);
+  block-size: var(--str-video__size-24);
+  padding: 7px;
+  border-radius: var(--str-video__radius-md);
+  background-color: var(--str-video__background-core-overlay-dark-strong);
 }
 .str-video__speech-indicator .str-video__speech-indicator__bar {
-  width: 3px;
+  flex-shrink: 0;
+  width: 2px;
   height: 20%;
-  background-color: var(--str-video__primary-color);
-  border-radius: 2px;
+  background-color: var(--str-video__indicator-sound-indicator-speaking);
+  border-radius: var(--str-video__radius-max);
   animation-duration: 0.4s;
   animation-iteration-count: 1;
   animation-name: speech-indicator-silence;
   animation-timing-function: ease-in-out;
 }
 .str-video__speech-indicator.str-video__speech-indicator--dominant .str-video__speech-indicator__bar {
-  background-color: var(--str-video__primary-color);
+  background-color: var(--str-video__indicator-sound-indicator-speaking);
 }
 .str-video__speech-indicator.str-video__speech-indicator--speaking .str-video__speech-indicator__bar {
   height: 100%;
@@ -2330,49 +3491,66 @@
   }
 }
 
+/* The text and icon color inside the participant label */
+.str-video {
+  --str-video__participant-label--color: var(--str-video__text-on-accent);
+}
+
+.str-video__connection-quality-indicator {
+  background-color: var(--str-video__background-core-overlay-dark-strong);
+}
+.str-video__connection-quality-indicator .str-video__connection-quality-indicator__bar {
+  background-color: var(--str-video__base-transparent-white-30);
+}
+.str-video__connection-quality-indicator .str-video__connection-quality-indicator__bar--active {
+  background-color: var(--str-video__text-on-accent);
+}
+.str-video__connection-quality-indicator--poor .str-video__connection-quality-indicator__bar--active {
+  background-color: var(--str-video__indicator-connection-quality-poor);
+}
+.str-video__connection-quality-indicator--good .str-video__connection-quality-indicator__bar--active {
+  background-color: var(--str-video__indicator-connection-quality-fair);
+}
+.str-video__connection-quality-indicator--excellent .str-video__connection-quality-indicator__bar--active {
+  background-color: var(--str-video__indicator-connection-quality-great);
+}
+
 .str-video__permission-requests {
-  background-color: var(--str-video__background-color1);
-  border-radius: 8px;
-  padding: 10px;
+  background-color: var(--str-video__background-core-surface-card);
+  border-radius: var(--str-video__radius-md);
+  padding: var(--str-video__spacing-sm);
   position: relative;
 }
 .str-video__permission-requests .str-video__permission-requests__notification,
 .str-video__permission-requests .str-video__permission-request {
   display: flex;
-  gap: 10px;
-  padding: 10px 0;
+  gap: var(--str-video__spacing-xs);
+  padding-block: var(--str-video__spacing-xs);
   align-items: center;
 }
 .str-video__permission-requests .str-video__permission-requests__notification__message,
 .str-video__permission-requests .str-video__permission-request__message {
   flex: 1;
+  min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  font-size: var(--str-video__typography-font-size-sm);
+  line-height: var(--str-video__typography-line-height-normal);
+  font-weight: var(--str-video__typography-font-weight-regular);
+  color: var(--str-video__text-primary);
 }
 .str-video__permission-requests .str-video__permission-request__button {
-  background-color: transparent;
-  border: 1px solid var(--str-video__text-color1);
-  border-radius: 4px;
-  color: var(--str-video__color1);
-  cursor: pointer;
-  font-size: 14px;
-  font-weight: 500;
-  padding: 8px;
   min-width: 120px;
 }
-.str-video__permission-requests .str-video__permission-request__button--allow {
-  background-color: var(--str-video__primary-color);
-  border: 1px solid var(--str-video__primary-color);
-}
 .str-video__permission-requests .str-video__permission-requests-list {
-  background-color: var(--str-video__background-color1);
-  border-bottom-left-radius: 8px;
-  border-bottom-right-radius: 8px;
-  padding: 10px;
+  background-color: var(--str-video__background-core-surface-card);
+  border-bottom-left-radius: var(--str-video__radius-md);
+  border-bottom-right-radius: var(--str-video__radius-md);
+  box-shadow: var(--str-video__box-shadow-3);
+  padding: var(--str-video__spacing-sm);
   width: 100%;
   z-index: 1;
-  opacity: 0.9;
   overflow-x: scroll;
   overflow-y: hidden;
 }
@@ -2382,13 +3560,13 @@
 
 .str-video__reaction {
   position: absolute;
-  right: 0.875rem;
-  top: 0.875rem;
+  right: var(--str-video__space-8);
+  top: var(--str-video__space-8);
 }
 .str-video__reaction .str-video__reaction__emoji {
   display: flex;
   line-height: 1;
-  font-size: 2.5rem;
+  font-size: var(--str-video__font-size-size-40);
 }
 
 .str-video__call-panel {
@@ -2398,8 +3576,8 @@
   justify-content: space-around;
   width: 400px;
   height: 300px;
-  padding: 1rem 1rem 0.5rem;
-  gap: 1rem;
+  padding: var(--str-video__spacing-md) var(--str-video__spacing-md) var(--str-video__spacing-xs);
+  gap: var(--str-video__spacing-md);
 }
 
 .str-video__call-panel--ringing .str-video__call-panel__members-list {
@@ -2413,49 +3591,49 @@
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  padding: 2rem;
+  padding: var(--str-video__spacing-2xl);
 }
 .str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box .str-video__avatar {
-  width: 80px;
-  height: 80px;
+  width: var(--str-video__size-80);
+  height: var(--str-video__size-80);
 }
 .str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box .str-video__member_details {
   position: absolute;
   bottom: 10%;
-  padding: 0.125rem 0.375rem;
+  padding: var(--str-video__space-2) var(--str-video__space-6);
 }
 .str-video__call-panel--ringing .str-video__pending-call-controls {
   display: flex;
-  gap: 0.675rem;
+  gap: var(--str-video__spacing-sm);
 }
 
 .str-video__call-panel {
-  background: var(--str-video__background-color3);
-  border: 2px solid rgba(200, 200, 200, 0.6);
-  border-radius: 10px;
+  background: var(--str-video__background-core-surface-card);
+  border: 2px solid var(--str-video__border-core-default);
+  border-radius: var(--str-video__radius-md);
 }
 
 .str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box {
-  border-radius: var(--str-video__border-radius-circle);
-  background: var(--str-video__background-color6);
+  border-radius: var(--str-video__radius-max);
+  background: var(--str-video__background-core-surface-strong);
 }
 .str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box:before {
   content: "";
   position: absolute;
   inset: 0;
-  border-radius: var(--str-video__border-radius-circle);
-  padding: 4px;
-  background: linear-gradient(180deg, var(--str-video__primary-color), var(--str-video__info-color));
+  border-radius: var(--str-video__radius-max);
+  padding: var(--str-video__space-4);
+  background: linear-gradient(180deg, var(--str-video__accent-primary), var(--str-video__accent-success));
   -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
   -webkit-mask-composite: xor;
   mask-composite: exclude;
 }
 .str-video__call-panel--ringing .str-video__call-panel__members-list .str-video__call-panel__member-box .str-video__member_details {
-  background-color: var(--str-video__background-color4);
-  color: var(--str-video__text-color1);
-  border-radius: 4px;
-  font-size: 12px;
-  line-height: 16px;
+  background-color: var(--str-video__background-core-overlay-dark-strong);
+  color: var(--str-video__text-on-accent);
+  border-radius: var(--str-video__radius-xs);
+  font-size: var(--str-video__typography-font-size-xs);
+  line-height: var(--str-video__typography-line-height-tight);
 }
 
 .str-video__screen-share-overlay {
@@ -2466,87 +3644,79 @@
   position: absolute;
   width: 100%;
   height: 100%;
-  gap: 1.8rem;
+  gap: var(--str-video__spacing-2xl);
 }
 .str-video__screen-share-overlay > .str-video__icon {
-  width: 4rem;
-  height: 4rem;
-}
-.str-video__screen-share-overlay .str-video__screen-share-overlay__button {
-  display: flex;
-  gap: 0.4rem;
-  align-items: center;
-  padding-inline: 1.6rem;
-  padding-block: 0.8rem;
+  width: var(--str-video__size-64);
+  height: var(--str-video__size-64);
 }
 .str-video__screen-share-overlay .str-video__screen-share-overlay__button .str-video__icon {
-  width: 0.7rem;
-  height: 0.7rem;
+  width: var(--str-video__icon-size-xs);
+  height: var(--str-video__icon-size-xs);
 }
 
 .str-video__screen-share-overlay {
-  background: var(--str-video__overlay-color);
+  background: var(--str-video__background-core-overlay-dark-strong);
+  color: var(--str-video__text-on-accent);
   backdrop-filter: blur(3px);
   border-radius: inherit;
 }
-.str-video__screen-share-overlay .str-video__screen-share-overlay__title {
-  font-size: 1.3rem;
-}
-.str-video__screen-share-overlay .str-video__screen-share-overlay__button {
-  color: white;
-  background: var(--str-video__danger-color);
-  border-radius: var(--str-video__border-radius-xs);
+.str-video__screen-share-overlay > .str-video__icon {
+  background-color: var(--str-video__text-on-accent);
 }
-.str-video__screen-share-overlay .str-video__screen-share-overlay__button:hover {
-  background-color: var(--str-video__danger-color--accent);
+.str-video__screen-share-overlay .str-video__screen-share-overlay__title {
+  font-size: var(--str-video__typography-font-size-xl);
 }
 
 .str-video__search-input__container {
   display: flex;
-  gap: 0.5rem;
-  padding: 0.5rem 0.75rem;
-  margin-inline: -0.25rem;
+  align-items: center;
+  gap: var(--str-video__spacing-xs);
+  padding: var(--str-video__spacing-xs) var(--str-video__spacing-sm);
+}
+.str-video__search-input__container.str-video__search-input__container--active {
+  padding-inline-end: var(--str-video__spacing-xs);
 }
 .str-video__search-input__container input {
   flex: 1;
   min-width: 0;
+  padding-block: var(--str-video__spacing-xxxs);
 }
 .str-video__search-input__container .str-video__search-input__clear-btn {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: 0;
-}
-.str-video__search-input__container .str-video__search-input__icon {
-  padding: 0.25rem;
+  flex-shrink: 0;
+  inline-size: var(--str-video__button-visual-height-xs);
+  block-size: var(--str-video__button-visual-height-xs);
+  padding: var(--str-video__button-padding-y-xs) var(--str-video__button-padding-x-icon-only-xs);
 }
 .str-video__search-input__container .str-video__search-input__icon--active,
 .str-video__search-input__container .str-video__search-input__icon {
   display: inline-block;
-  width: 1.125rem;
-  height: 1.125rem;
+  flex-shrink: 0;
+  inline-size: var(--str-video__icon-size-sm);
+  block-size: var(--str-video__icon-size-sm);
 }
 
 .str-video {
-  --str-video__search-input__container--color: var(--str-video__text-color1);
-  --str-video__search-input__container--background-color: var(
-    --str-video__background-color0
+  --str-video__search-input__container--color: var(
+    --str-video__input-text-default
   );
+  --str-video__search-input__container--background-color: transparent;
   --str-video__search-input__container--border-radius: var(
-    --str-video__border-radius-circle
+    --str-video__input-radius-search-input
   );
-  --str-video__search-input__container--border-block-start: 1px solid
-    transparent;
-  --str-video__search-input__container--border-block-end: 1px solid transparent;
-  --str-video__search-input__container--border-inline-start: 1px solid
-    transparent;
-  --str-video__search-input__container--border-inline-end: 1px solid transparent;
-  --str-video__search-input__placeholder-color: var(--str-video__text-color2);
-  --str-video__search-input__icon--color: var(--str-video__text-color1);
-}
-
-.str-video__search-input__container.str-video__search-input__container--active {
-  border-color: var(--str-video__primary-color);
+  --str-video__search-input__container--box-shadow: inset 0 0 0
+    var(--str-video__w100) var(--str-video__border-core-default);
+  --str-video__search-input__container--border-block-start: none;
+  --str-video__search-input__container--border-block-end: none;
+  --str-video__search-input__container--border-inline-start: none;
+  --str-video__search-input__container--border-inline-end: none;
+  --str-video__search-input__placeholder-color: var(
+    --str-video__input-text-placeholder
+  );
+  --str-video__search-input__icon--color: var(--str-video__input-text-icon);
 }
 
 .str-video__search-input__container {
@@ -2559,12 +3729,20 @@
   border-inline-start: var(--str-video__search-input__container--border-inline-start);
   border-inline-end: var(--str-video__search-input__container--border-inline-end);
 }
+.str-video__search-input__container:hover {
+  box-shadow: inset 0 0 0 var(--str-video__w100) var(--str-video__border-utility-hover), inset 0 0 0 var(--str-video__w100) var(--str-video__border-core-default);
+}
+.str-video__search-input__container:focus-within {
+  box-shadow: inset 0 0 0 var(--str-video__w100) var(--str-video__border-utility-active), inset 0 0 0 var(--str-video__w200) var(--str-video__border-utility-focused);
+}
 .str-video__search-input__container input {
   background-color: transparent;
   border: none;
   outline: none;
   color: inherit;
-  font-size: 13px;
+  font-size: var(--str-video__typography-font-size-sm);
+  font-weight: var(--str-video__typography-font-weight-regular);
+  line-height: var(--str-video__typography-line-height-normal);
 }
 .str-video__search-input__container input::placeholder {
   color: var(--str-video__search-input__placeholder-color);
@@ -2576,33 +3754,37 @@
   mask-repeat: no-repeat;
   -webkit-mask-position: center;
   mask-position: center;
-  -webkit-mask-size: 0.75rem 0.75rem;
-  mask-size: 0.75rem 0.75rem;
+  -webkit-mask-size: var(--str-video__icon-size-sm);
+  mask-size: var(--str-video__icon-size-sm);
   background-color: var(--str-video__search-input__icon--color);
 }
 .str-video__search-input__container .str-video__search-input__clear-btn {
   background-color: transparent;
-  border-radius: var(--str-video__border-radius-circle);
+  border-radius: var(--str-video__button-radius-full);
   border: none;
 }
 .str-video__search-input__container .str-video__search-input__clear-btn:hover {
   cursor: pointer;
+  background-color: var(--str-video__background-utility-hover);
+}
+.str-video__search-input__container .str-video__search-input__clear-btn:active {
+  background-color: var(--str-video__background-utility-pressed);
 }
 .str-video__search-input__container .str-video__search-input__clear-btn .str-video__search-input__icon--active {
-  -webkit-mask-image: var(--str-video__icon--close);
-  mask-image: var(--str-video__icon--close);
+  -webkit-mask-image: var(--str-video__icon--x-circle);
+  mask-image: var(--str-video__icon--x-circle);
   -webkit-mask-repeat: no-repeat;
   mask-repeat: no-repeat;
   -webkit-mask-position: center;
   mask-position: center;
-  -webkit-mask-size: 0.75rem 0.75rem;
-  mask-size: 0.75rem 0.75rem;
-  background-color: var(--str-video__search-input__icon--color);
+  -webkit-mask-size: var(--str-video__icon-size-sm);
+  mask-size: var(--str-video__icon-size-sm);
+  background-color: var(--str-video__button-secondary-text);
 }
 
 .str-video__call {
-  background-color: var(--str-video__background-color2);
-  color: var(--str-video__text-color1);
+  background-color: var(--str-video__background-core-elevation-1);
+  color: var(--str-video__text-primary);
   width: 100%;
   height: 100%;
   min-height: 0;
@@ -2611,40 +3793,40 @@
   flex-direction: column;
 }
 .str-video__call .str-video {
-  background-color: var(--str-video__background-color2);
-  color: var(--str-video__text-color1);
+  background-color: var(--str-video__background-core-elevation-1);
+  color: var(--str-video__text-primary);
 }
 
 .str-video__tooltip {
   display: flex;
   justify-content: center;
-  padding: var(--str-video__spacing-sm);
+  gap: var(--str-video__spacing-xs);
+  padding-block: var(--str-video__spacing-xxs);
+  padding-inline: var(--str-video__spacing-xs);
+  border-radius: var(--str-video__radius-md);
+  font-size: var(--str-video__typography-font-size-xs);
+  font-weight: var(--str-video__typography-font-weight-semi-bold);
+  line-height: var(--str-video__typography-line-height-tight);
   z-index: 4;
-  max-width: 250px;
-  width: max-content;
+  inline-size: max-content;
+  max-inline-size: 250px;
   white-space: initial;
   overflow-wrap: break-word;
 }
 
 .str-video {
-  /* The border radius used for the borders of the component */
-  --str-video__tooltip--border-radius: var(--str-video__border-radius-xs);
-  /* The text/icon color of the component */
-  --str-video__tooltip--color: var(--str-video__text-color1);
-  /* The background color of the component */
-  --str-video__tooltip--background-color: var(
-    --str-video__button-default-hover
-  );
-  /* Top border of the component */
+  --str-video__tooltip-bg: var(--str-video__background-core-inverse);
+  --str-video__tooltip--background-color: var(--str-video__tooltip-bg);
+  --str-video__tooltip--color: var(--str-video__text-on-accent);
+  --str-video__tooltip--box-shadow: var(--str-video__box-shadow-3);
+  --str-video__tooltip--border-radius: var(--str-video__radius-md);
   --str-video__tooltip--border-block-start: none;
-  /* Bottom border of the component */
   --str-video__tooltip--border-block-end: none;
-  /* Left (right in RTL layout) border of the component */
   --str-video__tooltip--border-inline-start: none;
-  /* Right (left in RTL layout) border of the component */
   --str-video__tooltip--border-inline-end: none;
-  /* Box shadow applied to the component */
-  --str-video__tooltip--box-shadow: none;
+}
+.str-video.str-video__theme-dark {
+  --str-video__tooltip-bg: var(--str-video__background-core-elevation-2);
 }
 
 .str-video__tooltip {
@@ -2656,11 +3838,6 @@
   border-block-end: var(--str-video__tooltip--border-block-end);
   border-inline-start: var(--str-video__tooltip--border-inline-start);
   border-inline-end: var(--str-video__tooltip--border-inline-end);
-  font-size: 14px;
-  line-height: 1rem;
-}
-.str-video__tooltip::after {
-  background-color: var(--str-video__tooltip-background-color);
 }
 
 .str-video__video {
@@ -2678,7 +3855,7 @@
 }
 
 .str-video__video {
-  background-color: var(--str-video__background-color5);
+  background-color: var(--str-video__background-core-surface-subtle);
 }
 
 .str-video__video-placeholder {
@@ -2689,40 +3866,19 @@
   align-items: center;
   justify-content: center;
 }
-.str-video__video-placeholder .str-video__video-placeholder__avatar {
-  width: 100px;
-  height: 100px;
-  object-fit: cover;
-}
-.str-video__video-placeholder .str-video__video-placeholder__initials-fallback {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100px;
-  height: 100px;
-}
 
 .str-video__video-placeholder {
-  background: var(--str-video__base-color6);
+  background: var(--str-video__background-core-surface-subtle);
+  border: var(--str-video__w100) solid var(--str-video__border-core-default);
   border-radius: inherit;
 }
-.str-video__video-placeholder .str-video__video-placeholder__avatar {
-  border-radius: var(--str-video__border-radius-circle);
-}
-.str-video__video-placeholder .str-video__video-placeholder__initials-fallback {
-  background-color: var(--str-video__primary-color);
-  border-radius: var(--str-video__border-radius-circle);
-  font-size: 32px;
-  font-weight: 600;
-  text-transform: uppercase;
-}
 
 .str-video__video-preview-container {
   display: flex;
   justify-content: center;
   align-items: center;
-  width: 500px;
-  height: 375px;
+  width: 100%;
+  aspect-ratio: 16/9;
 }
 .str-video__video-preview-container .str-video__video-preview {
   object-fit: cover;
@@ -2743,27 +3899,33 @@
 
 .str-video {
   /* The font color applied inside the component */
-  --str-video__video-preview-container--color: var(--str-video__text-color1);
+  --str-video__video-preview-container--color: var(--str-video__text-primary);
   /* The background color of the component */
   --str-video__video-preview-container--background-color: var(
-    --str-video__background-color5
+    --str-video__background-core-surface-subtle
   );
   /* The border radius used for the borders of the component */
   --str-video__video-preview-container--border-radius: var(
-    --str-video__border-radius-xs
+    --str-video__radius-2xl
   );
   /* The border used for the borders of the component */
-  --str-video__video-preview-container--border-block-start: 4px solid
-    var(--str-video__primary-color);
+  --str-video__video-preview-container--border-block-start: var(
+      --str-video__w100
+    )
+    solid var(--str-video__border-core-default);
   /* The border used for the borders of the component */
-  --str-video__video-preview-container--border-block-end: 4px solid
-    var(--str-video__primary-color);
+  --str-video__video-preview-container--border-block-end: var(--str-video__w100)
+    solid var(--str-video__border-core-default);
   /* The border used for the borders of the component */
-  --str-video__video-preview-container--border-inline-start: 4px solid
-    var(--str-video__primary-color);
+  --str-video__video-preview-container--border-inline-start: var(
+      --str-video__w100
+    )
+    solid var(--str-video__border-core-default);
   /* The border used for the borders of the component */
-  --str-video__video-preview-container--border-inline-end: 4px solid
-    var(--str-video__primary-color);
+  --str-video__video-preview-container--border-inline-end: var(
+      --str-video__w100
+    )
+    solid var(--str-video__border-core-default);
 }
 
 .str-video__video-preview-container {
@@ -2777,5 +3939,9 @@
   border-inline-end: var(--str-video__video-preview-container--border-inline-end);
   overflow: hidden;
 }
+.str-video__video-preview-container--speaking {
+  outline: var(--str-video__w200) solid var(--str-video__accent-primary);
+  outline-offset: calc(var(--str-video__w200) * -1);
+}
 
 /*# sourceMappingURL=styles.css.map */