body{background-color:#f9f9f9;font-family:Arial,sans-serif;margin:0;padding:0}.container{display:flex;flex-direction:column;height:100vh}.timeline{background-color:#fff;flex:1;overflow-y:auto;padding:20px;position:relative}.timeline:after{background-color:#00a6ed;content:"";display:none;height:100vh;left:3.105%;position:fixed;top:0;width:20px;z-index:.01}.timeline.has-messages:after{display:block}.message{display:flex;margin-bottom:35px;position:relative;z-index:1}.message .line{position:relative;width:6.5%}.message .line:before{background-color:#00a6ed;border-radius:50%;content:"";height:75px;left:50%;margin-left:-10px;position:absolute;top:50%;transform:translate(-50%,-50%);width:75px;z-index:200}@media screen and (max-width:768px){.message .line:before{height:40px;width:40px}}.message .content{background-color:#f1f1f1;border:1px solid #ddd;border-radius:5px;display:flex;flex-direction:column;padding:15px 10px;width:93.5%;z-index:1}.message .time{color:#666;font-size:18px;margin-bottom:5.5px;margin-right:10px;margin-top:6.5px;text-align:right}.message .text{word-wrap:break-word;font-size:27px;hyphens:auto;margin-bottom:9.5px;margin-left:10px;max-width:75%;overflow-wrap:break-word}.message .coords{color:#666;font-size:18px;margin-left:10px}.message .coords .eye-icon{background-image:url(img/eye.svg);background-size:cover;display:inline-block;height:28px;margin-left:8px;transform:translateY(7.5px);width:28px}.input-area{align-items:center;background-color:#f1f1f1;border-top:1px solid #ddd;display:flex;flex-wrap:wrap;height:auto;padding:10px 20px;z-index:1}#text-input{border:1px solid #ddd;border-radius:5px;flex:1;font-size:20px;margin-right:10px;padding:25px 15px}.record-controls{align-items:center;display:flex;gap:10px}#audio-btn,#cancel-btn-record,#ok-btn-record,#video-btn{background-color:#00a6ed;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:32px;padding:15px}#video-btn:before{content:"🎥";display:inline-block;transform:translateY(-5.5px)}#timer{color:#666;font-size:16px}.modal{align-items:center;background-color:rgba(0,0,0,.5);display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:1000}.modal,.modal-content{justify-content:center}.modal-content{align-items:flex-start;background-color:#fff;border-radius:10px;display:flex;flex-direction:column;font-size:16px;height:auto;max-height:90vh;max-width:500px;padding:5px 20px 10px;text-align:center;width:90%}@media screen and (min-width:768px){.modal-content{width:70%}}@media screen and (min-width:1024px){.modal-content{width:50%}}.modal-content input{border:1px solid #ddd;border-radius:5px;margin:10px 0;padding:10px;width:96%}.modal-content h3{margin-bottom:6px}.modal-content p{margin-bottom:12px;text-align:left}.modal-content label{margin-bottom:6px;text-align:left}.modal-buttons{align-self:flex-end;display:flex}.modal-buttons button{border:none;border-radius:5px;cursor:pointer;font-size:15px;margin-left:7px;padding:15px 17px;transform:translateX(-10%)}#cancel-btn{background-color:#ddd}#ok-btn{background-color:#007bff;color:#fff}.video-preview{background-color:#f1f1f1;border-bottom:1px solid #ddd;border-radius:5px;border-top:1px solid #ddd;display:none;height:75%;padding:20px 10px;position:relative;text-align:center;width:98%;z-index:1001}#video-recorder{height:100%;object-fit:fill;width:100%}.media{transform:translateX(5px) translateY(-6.5px)}.custom-audio-player{align-items:left;background-color:#f1f1f1;border-radius:10px;display:flex;flex-direction:column;gap:10px;max-width:75%;padding:10px}.play-pause-btn{align-items:flex-end;background-color:#00a6ed;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:64px;height:85px;justify-content:center;margin-bottom:4px;margin-left:-3.5px;width:85px}.progress-container{align-items:center;display:flex;width:100%}.progress-bar{background-color:#ddd;cursor:pointer;flex:1;height:5px}.progress,.progress-bar{border-radius:5px;position:relative}.progress{height:100%;width:0}.progress,.thumb{background-color:#00a6ed}.thumb{border-radius:50%;cursor:pointer;height:22px;position:absolute;top:50%;transform:translate(-50%,-50%);width:22px}.custom-video-player{align-items:flex-start;background-color:#f1f1f1;border-radius:10px;display:flex;flex-direction:column;gap:15px;margin-right:auto;max-width:75%;padding:10px;position:relative}.custom-video-player video{align-self:flex-start;aspect-ratio:16/9;height:500px;object-fit:fill;width:100%}@media screen and (max-width:650px){.custom-video-player video{height:200px}}.custom-video-player .play-pause-btn{align-items:self-start;background-color:#00a6ed;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:64px;height:90px;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:90px;z-index:1}.custom-video-player .progress-container{align-items:center;display:flex;justify-content:flex-start;width:100%}.custom-video-player .progress-bar{background-color:#ddd;border-radius:5px;cursor:pointer;flex:1;height:5px;position:relative}.custom-video-player .progress{background-color:#00a6ed;border-radius:5px;height:100%;position:relative;width:0}.custom-video-player .thumb{background-color:#00a6ed;border-radius:50%;cursor:pointer;height:22px;position:absolute;top:50%;transform:translate(-50%,-50%);width:22px}