:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;--primary-text:#333;--secondary-text:#999;--max-width:1280px;--prominent-color:#d9923a;--prominent-color-light:#eac190;--background-color:#ded2c0;--background-color-light:#efeae1;background-color:#242424;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box}.secondaryText{color:var(--secondary-text)}a{color:#646cff;-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{color:#535bf2}html,body{width:100%;height:100%}body{background:linear-gradient(to left top, var(--background-color-light), var(--background-color));margin:0}h1{font-size:3.2em;line-height:1.1}img{aspect-ratio:1;border-radius:50%;width:3rem}@media (prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}}*{color:var(--primary-text)}#root{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.room-listing--empty,.loading-panel,.error-panel{text-align:center;flex-direction:column;align-items:center;width:100%;height:100%;padding:1.5rem;display:flex}.app-container{width:100%;height:100%;display:flex;position:relative}.main-panel{flex:1;width:100%;height:100%;margin-inline:auto;position:relative}.center-column{flex-direction:column;justify-content:center;align-items:center;height:100%;display:flex}.hidden{display:none}@media screen and (width<=800px){#root{padding:0}.intro-area img{width:6rem}.app-container{flex-direction:column;overflow-y:hidden}}.str-video__avatar--initials-fallback{background-color:var(--prominent-color);text-transform:uppercase;border-radius:999px;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:1rem;font-weight:600;display:flex}.str-video__avatar{width:2rem;height:2rem}.speaker-image-container .str-video__avatar--initials-fallback{width:5rem;height:5rem;font-size:2rem}.listener .str-video__avatar--initials-fallback{width:3rem;height:3rem;font-size:1.5rem}.sidebar .str-video__avatar--initials-fallback{width:100px;height:100px;font-size:3rem}button,a.filled-button{cursor:pointer;white-space:nowrap;border:1px solid #0000;border-radius:8px;font-family:inherit;font-size:1em;font-weight:500;transition:border-color .25s}button:disabled{cursor:not-allowed}.filled-button{justify-content:center;align-items:center;gap:.375rem;padding:.6rem 1rem;transition:background-color .2s ease-out;display:flex}.filled-button svg{height:1rem}.filled-button--blue{background:#00f}.filled-button--blue,.filled-button--blue *,a.filled-button--blue:hover{color:#fff}.filled-button:hover{background:#66f}.open-create-room-button{position:fixed;bottom:1rem;right:1rem}.form-modal-background-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute}.form-container{border:3px solid var(--prominent-color-light);background:#fff;border-radius:8px;width:300px;padding:1rem}.form-container__header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.form-container__title{font-size:1.25rem;font-weight:700}.form-container__header button.form-container__close-button{background-color:var(--background-color);justify-content:center;align-items:center;padding:0;display:flex}.form-container__header .form-container__close-button svg{width:1.5rem;height:1.5rem}form{width:100%}form input{border:2px solid var(--prominent-color-light);background-color:var(--background-color-light);border-radius:1rem;width:100%;margin-bottom:.5rem;padding:.5rem .75rem}form button{margin-top:.75rem}.create-button{color:#fff;background:#00f;padding:.6rem 1.2rem}.create-button:hover{background:#66f}@media screen and (width<=800px){.open-create-room-button{padding:.875rem}.open-create-room-button span{display:none}}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-icon{fill:#fff;animation:2s linear infinite rotation}.intro-area{text-align:left;flex-direction:column;align-items:start;display:flex}.intro-area img{aspect-ratio:1;background:0 0;border-radius:2rem;width:8rem}.login-screen{max-width:var(--max-width);flex-wrap:wrap;align-items:center;gap:4rem;height:100%;margin:auto;padding:2rem;display:flex;overflow-y:auto}.login-screen>*{flex:1}.user-list{border-radius:1rem;max-width:300px}.user-list button{background-color:var(--background-color-light);cursor:pointer;align-items:center;gap:1rem;width:100%;padding:.5rem 1rem;font-weight:700;transition:background .15s ease-out;display:flex}.user-list button:hover{background:var(--background-color)}.user-list button:not(:last-child){margin-bottom:.5rem}.active-room{justify-content:center;gap:1rem;width:100%;height:100%;padding:1rem;display:flex}.active-room .rooms-overview{flex:1;min-width:365px;max-width:400px}.active-room .room-listing-tabs{padding-left:2rem}.room-detail{background:#fff;border-radius:1rem;flex-direction:column;flex:1;align-items:start;min-width:0;max-width:800px;height:100%;padding:1rem 1.5rem;display:flex;position:relative}.room-detail h2{margin-block:.75rem}.room-overlay{text-align:center;border-radius:inherit;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff80;flex-direction:column;justify-content:center;align-items:center;padding:1rem;display:flex;position:absolute;inset:0}.room-intro .room-host{flex-direction:column;justify-content:center;align-items:center;display:flex}.room-intro .room-host h3{margin:.5rem 0 0;font-size:1.5rem}.room-intro .host-avatar{width:80px;height:80px;font-size:2rem}.room-intro .room-description{margin-bottom:3rem;font-size:1.2rem}.participants-section{flex-direction:column;width:100%;margin-bottom:2.5rem;display:flex}.participants-section h3{margin:0 0 1rem}.speakers-list{gap:3rem;width:100%;display:flex;overflow-x:auto}.speakers-list svg{border-radius:50%;width:1rem;height:1rem;padding:.15rem}.speakers-list span{display:inline-block}.listeners-list{flex-wrap:wrap;gap:1rem;width:100%;display:flex;overflow-y:auto}.listener{flex-direction:column;align-items:center;display:flex}.listener-name{font-size:smaller}.room-access-controls{flex-wrap:wrap;align-items:center;gap:1rem;width:100%;display:flex;bottom:0}.room-access-controls-button{background:var(--prominent-color-light);align-items:center;gap:.5rem;padding:.6rem 1.2rem;transition:all .2s ease-in-out;display:flex}.room-access-controls-button svg{width:1rem;height:1rem}.room-access-controls-button:hover{background:var(--prominent-color);color:#fff}.icon-button{background:#000;border-radius:.5rem;justify-content:center;align-items:center;width:1.75rem;height:1.75rem;padding:0;display:flex}.icon-button.notifications{position:relative}.icon-button.notifications:after{content:"";background:#adff2f;border-radius:999px;width:8px;height:8px;position:absolute;bottom:4px;left:4px}.icon-button svg{width:100%;height:100%;padding:.25rem;display:inline-block}.mute-microphone-icon{fill:#ff4500;stroke-width:20%}.speaker-container{flex-direction:column;align-items:flex-start;display:flex}.speaker-image-container{position:relative}.speaker-container__controls{background:var(--background-color-light);opacity:.2;border-radius:8px;justify-content:flex-start;align-items:center;display:flex;position:absolute;top:0;right:0}.speaker-container__controls:hover{opacity:1}.speaker-container button{background:0 0;justify-content:center;align-items:center;padding:0;display:flex}.speaker-container svg{width:1.5rem;height:1.5rem}.speaker-container svg.mute-microphone-icon{background:var(--background-color-light);position:absolute;bottom:0;right:5px}.speaker-container img{border:6px solid #0000;width:100px;transition:border .2s ease-out}.speaker-name{justify-content:center;align-items:center;width:100%;font-weight:700;display:flex}.speaking-indicator{border-color:var(--background-color)}.speaking-requests-container{border:1px solid var(--background-color-light);background:#fff;background:var(--background-color-light);border-radius:8px;flex-direction:column;align-items:start;gap:1rem;padding:1rem;display:flex;position:absolute;top:15px;left:15px;right:15px}.speaking-requests-container__header{justify-content:space-between;align-items:center;width:100%;margin-bottom:.5rem;display:flex}.speaking-requests-container__header h3{margin:0}.speaking-requests-container__header button{background:#fff;justify-content:center;align-items:center;padding:0;display:flex}.speaking-requests-container__header button svg{width:1.25rem;height:1.25rem}.speaking-request{box-sizing:border-box;border:1px solid var(--secondary-text);border-radius:1rem;justify-content:space-between;width:100%;padding:0 1rem;display:flex}.room-detail-header{justify-content:space-between;align-items:center;width:100%;display:flex}.user-counts{align-items:center;gap:.5rem;margin:0 0 1.5rem;display:flex}.user-counts svg{width:1rem;height:1rem}.live-room-controls{gap:.5rem;display:flex;position:relative}.live-room-controls__notificaton{white-space:nowrap;color:#fff;background:#000;border-radius:4px;padding:.375rem .5rem;font-size:.75rem;position:absolute;top:calc(100% + .25rem);right:0}.speaking-request-buttons{align-items:center;gap:1rem;display:flex}.speaking-request-buttons button{transition:background .2s ease-out}.reject-button svg,.accept-button svg{stroke:#fff}.reject-button:hover{background:#f66}.accept-button:hover{background:#00b300}.show-room-list-button{z-index:1;padding:.5rem;position:absolute;top:.5rem;left:.5rem}@media screen and (width<=800px){.active-room.with-room-list{padding:0}.active-room.with-room-list .room-detail{display:none}}.rooms-overview{flex-direction:column;height:100%;display:flex}.rooms-overview h2{text-align:center}.room-listing{grid-template-columns:repeat(auto-fit,minmax(100px,400px));justify-content:center;gap:2rem;padding:1rem;display:grid;overflow-y:auto}.room-listing-section{flex:1;padding:0 1rem 1rem;overflow-y:auto}.room-card-button{background:0 0;border:1px solid #0000;border-radius:8px;padding:0;overflow:hidden}.room-card-button:hover{border-color:var(--prominent-color)}.room-card{text-align:start;background:var(--background-color-light);border-radius:8px;flex-direction:column;min-width:0;max-width:400px;height:100%;padding:.6rem 1.2rem;display:flex}.room-card>span{font-size:.8rem;font-style:italic;font-weight:lighter}.hosts-grid{border-bottom:2px solid var(--background-color);width:100%;margin-top:.25rem;padding-bottom:1rem;display:flex}.hosts-grid div{align-items:center;gap:.5rem;display:flex}.hosts-grid span{text-transform:capitalize;font-size:.8rem;font-weight:700}.room-listing__load-more-container{justify-content:center;width:100%;padding-block:2rem .5rem;display:flex}.room-listing-tabs{justify-content:center;gap:1rem;width:100%;padding-block:1rem;font-size:1.25rem;display:flex}.room-listing-tab{background:0 0;border-radius:8px;outline:none;align-items:flex-end;padding:.5rem .75rem;display:flex}.room-listing-tab.active,.room-listing-tab:hover{background:var(--background-color)}.room-listing-tab.active{font-size:1.5rem;font-weight:700}@media screen and (width<=800px){.active-room .rooms-overview{width:100%;overflow:unset;max-width:unset}.room-listing__load-more-container{padding-bottom:5rem}}.sidebar{border-right:2px solid #c4c4c4;flex-direction:column;justify-content:space-between;align-items:center;gap:1rem;padding:1rem;display:flex}.sidebar-top,.sidebar-bottom{flex-direction:column;align-items:center;gap:1rem;display:flex}.sidebar-bottom{position:relative}.sidebar img{width:100px;height:100px}.sidebar .profile{flex-direction:column;align-items:center;gap:.5rem;display:flex}.sidebar .username{font-size:1.25rem;font-weight:700}.sidebar .filled-button{width:100%}@media screen and (width<=800px){.sidebar{border-right:unset;background:var(--background-color);border-bottom:2px solid #c4c4c4;flex-direction:row-reverse;justify-content:space-between;align-items:center;padding:.5rem}.sidebar .profile{flex-direction:row-reverse;align-items:flex-end}.sidebar .username{padding-block:.375rem;font-size:.75rem}.sidebar img{width:60px}.sidebar .sidebar-top{flex-direction:row-reverse}.sidebar .sidebar-top img,.sidebar .str-video__avatar--initials-fallback{width:50px;height:50px;font-size:1.25rem}.sidebar .sidebar-bottom{flex-direction:row-reverse}.sidebar .filled-button span{display:none}}
