.sidebar{background-color:#fff;position:absolute;width:100%;height:100%;left:0;top:0;z-index:5}.from-left-enter-active,.from-left-leave-active{transition:all .2s ease}.from-left-leave-from,.from-left-enter-to,.from-left-leave{left:0}.from-left-enter-from,.from-left-enter,.from-left-leave-to{left:-100%}.sidebar button.close{position:absolute;top:0;right:0}.sidebar input{font-size:16px}.list{width:100%}.list-item{display:flex;width:100%;min-height:48px;align-items:center}.list-item:active{background-color:#f5f5f5}.list-icon{margin:0 12px}.header{text-align:center;padding:8px}.header>button{color:#fff;background:none}.header .peer-id-segment+.peer-id-segment{margin-left:.3em}.banner{position:relative;z-index:1}.banner--wrap{background:#5fb1eb69;backdrop-filter:blur(8px);position:absolute;width:100%;padding:4px 0;text-align:center}.main{padding:8px}.myself{flex-direction:row-reverse;text-align:right}.myself .avatar{margin-left:8px;margin-right:0}.message{max-width:100%}.system-message{font-size:8px;text-align:center}span.message{background-color:#fff;padding:8px 12px;border-radius:16px;display:inline-block;word-break:break-word;min-width:1em}img.message{background-color:#fff;border-radius:4px;display:inline-block;max-height:8em}.from{font-size:14px;color:#999;margin-bottom:2px}button.avatar{margin-right:8px;background-color:#fff}.send-button{margin-left:8px;padding:0 12px;height:32px}.button-group span.mdi{color:#999;cursor:pointer}.footer .btn-text{padding:0 8px}.footer .btn-text:active>span{color:#00bfff}.record{height:128px;overflow:hidden}.from-bottom-enter-active,.from-bottom-leave-active{transition:all .2s ease}.from-bottom-leave-from,.from-bottom-enter-to,.from-bottom-leave{height:128px}.from-bottom-enter-from,.from-bottom-enter,.from-bottom-leave-to{height:0}.record-button{width:64px;height:64px;border-radius:50%;background:#5fb1eb69;transition:transform .1s ease}.record-button.recording{transform:scale(1.2)}.smallscreen-modal{position:absolute;top:5%;right:5%;width:30%;height:30%;z-index:100;overflow:hidden}.fullscreen-modal{background-color:#00000080;backdrop-filter:blur(8px);position:absolute;top:0;left:0;width:100%;height:100%;z-index:100;overflow:auto}.smallscreen-modal>video,.fullscreen-modal>video{position:absolute;object-fit:contain;width:100%;height:100%}.smallscreen-modal>.secondary-video{display:none}.fullscreen-modal>.secondary-video{top:5%;right:5%;width:30%;height:30%;z-index:1}.calling-buttons{display:flex;position:absolute;bottom:0;width:100%;padding:16px 0}.calling-buttons>button{background:#ffffff40;backdrop-filter:blur(2px);margin:0 8px}.calling-buttons>button.hangup{background-color:#df3d3d;color:#fff}html,body{overscroll-behavior:contain}body{margin:0;font-display:swap;font-family:Roboto,arial,sans-serif}@media (max-width: 960px){*{outline:none;-webkit-tap-highlight-color:transparent}}.position-relative{position:relative}.position-absolute{position:absolute}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.fill-width{width:100%}.fill-height{height:100%}.row{display:flex}.row+.row{margin-top:8px}.col{flex-grow:1;flex-basis:0%;min-width:0}.col-auto{width:auto;flex:0 0 auto}.flex-column{flex-direction:column}.flex-grow-0{flex-grow:0!important}.flex-grow-1{flex-grow:1!important}.flex-shrink-0{flex-shrink:0!important}.flex-shrink-1{flex-shrink:1!important}.object-fit-contain{object-fit:contain!important;width:100%;height:100%}.object-fit-cover{object-fit:cover!important;width:100%;height:100%}.object-fit-fill{object-fit:fill!important;width:100%;height:100%}.size-16{width:16px;height:16px}.size-32{width:32px;height:32px}.size-48{width:48px;height:48px}.size-64{width:64px;height:64px}button.size-16>span.mdi{font-size:12px}button.size-32>span.mdi{font-size:24px}button.size-48>span.mdi{font-size:32px}.color-primary{background-color:#1976d2;color:#fff}.color-primary[disabled]{background-color:#a0bef0}.mdi{font-size:24px}.rounded{border-radius:50%;overflow:hidden}input{padding:8px;border:none;border-radius:16px}button{border:none;border-radius:16px;user-select:none;cursor:pointer}button>span.mdi{display:inline-flex;margin:auto}.btn-text{background:none}.btn-icon{display:flex;padding:0;background:none}html,body,#app{width:100%;height:100%}#app{display:flex;flex-direction:column;background-color:#f5f5f5}#app>*{flex-shrink:0}#app>.main{flex-shrink:1}.main{flex-grow:1;overflow-y:auto}.footer{padding:8px 8px 0}