*,:before,:after{box-sizing:border-box}*{margin:0;padding:0;box-sizing:border-box}:where(fieldset[class]){border:none}ul,li{list-style:none}input,textarea,select,button{font:inherit}html,body{height:100%;overflow:hidden}label,button{cursor:pointer}img,video{max-width:100%;height:auto}*,html,:has(:target){scroll-behavior:smooth}a{text-decoration:none;font-family:inherit;color:inherit}h1,h2,h3,h4{font-size:inherit}@font-face{font-family:"Exo 2";src:url(/assets/Exo2-Regular-BKV1TYo9.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:"Exo 2";src:url(/assets/Exo2-Light-BFuzbZDj.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:"Exo 2";src:url(/assets/Exo2-Bold-VnMrmOV_.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@keyframes scaleUp{10%{transform:rotateX(10deg)}60%{transform:rotateX(360deg)}to{transform:scaleX(.0001);opacity:0}}@keyframes scaleDown{0%{transform:scale(.000000001);opacity:0}50%{opacity:0}}@keyframes slide{60%{opacity:0}to{opacity:0;transform:rotate(-720deg)}}@keyframes opacityOn{to{opacity:0}}@keyframes scale{to{opacity:0;transform:scale(.01)}}@keyframes killBlock{0%{transform:rotate(720deg);opacity:0}20%{opacity:0}}@keyframes attention{to{color:var(--color-red)}}@keyframes dynamicBackground{to{background-color:var(--color-white);color:var(--color-black)}}@keyframes twitchy{to{fill:var(--color-white)}}@keyframes twitchy-back{to{background-color:var(--color-black);transform:translateY(10%) scale(.9)}}@keyframes slowShow{0%{opacity:0}to{opacity:1}}@keyframes slowShowOut{to{opacity:0}}@keyframes shaker{0%{transform:rotate(-5deg)}to{transform:rotate(5deg)}}@keyframes to-hell{0%{opacity:0;transform:rotateX(90deg) scale(.3)}50%{background-color:var(--color-black)}}:root{--font-family: "Exo 2";--font-weight-basic: 400;--font-size-basic: clamp(16px, 1.3vw, 25px);--font-size-small: clamp(11px, .833vw, 16px);--color-red: #DC0404;--color-white: #FFF;--color-black: #19120E;--color-grey: #9D9696;--color-accent: #F7E1FA;--color-pink: #fadbdb85;--padding-button: 11px 20px;--border-button: 1px solid var(--color-black);--height-button-img: clamp(20px, 2.08vw, 40px);--container-width: 1440px;--container-padding-x: 15px;--border-radius: 15px;--height-chat-container: 60vh;--width-message: 700px;--width-check: 15px;--width-buttons: 15vw;--box-shadow: 6px 6px 8px 0px rgba(0, 0, 0, .534), inset 2px 2px 8px 0px rgba(0, 0, 0, .534), -.5px -.5px 32px 0px rgba(255, 255, 255, .048);--subModal-box-shadow: 4px 4px 4px 0px var(--color-red);--backgroundUrl: url(/assets/lightTheme-B5NH67EG.svg)}body{font-family:var(--font-family);font-weight:var(--font-weight-basic);font-size:var(--font-size-basic);padding:20px;display:flex;flex-direction:column;row-gap:10px;transition-duration:.4s;background-image:var(--backgroundUrl);background-repeat:no-repeat;background-position:center;background-size:cover}input{transition-duration:.2s}input:focus{background-color:var(--color-black);color:var(--color-white);animation-name:dynamicBackground;animation-duration:4s;animation-iteration-count:infinite;animation-direction:alternate-reverse;outline:none}input::placeholder{font-size:inherit;font-weight:inherit}button,input,form,h2,dialog{box-shadow:var(--box-shadow)}.container{margin-inline:auto;max-width:calc(var(--container-width) + var(--container-padding-x) * 2)}.visually-hidden{display:none!important;font-size:0;opacity:0;height:0!important;max-height:0!important;width:0!important;padding:0!important;margin:0!important;border:none}.disabled{background-color:var(--color-grey)!important;pointer-events:none;border:1px solid var(--color-grey)!important}.killBlock{animation-name:killBlock;animation-duration:1s;animation-direction:reverse}.scaleUp{animation-name:scaleUp;animation-direction:reverse;animation-duration:2s}.scaleDown{animation-name:scaleDown;animation-direction:reverse;animation-duration:1s}.opacityOn{animation-name:opacityOn;animation-duration:2s;animation-direction:reverse}.opacityOnFast{animation-name:opacityOn;animation-duration:1s;animation-direction:reverse}.slowShow{animation-name:slowShow;animation-duration:.3s}.slowShowOut{animation-name:slowShowOut;animation-duration:.3s}.pointer-events-none{pointer-events:none}.slide{animation-name:slide;animation-duration:1.5s;animation-direction:reverse}.scale{animation-name:scale;animation-duration:.5s;animation-direction:reverse}.long-scale{animation-name:scale;animation-duration:2s;animation-direction:reverse}.attention{animation-name:attention;animation-duration:.4s;animation-iteration-count:10}.shaker{animation-name:shaker;animation-duration:.8s;animation-direction:alternate;transform:rotate(-5deg);animation-iteration-count:infinite}.header{margin-bottom:20px;flex:0 0 5%}.button{border:var(--border-button);border-radius:var(--border-radius);background-color:var(--color-red);color:var(--color-white);padding:var(--padding-button);display:flex;align-items:center;justify-content:center;column-gap:15px;flex-grow:1;max-width:min(290px,var(--width-buttons))}.button img{height:var(--height-button-img)}.header__container{display:flex;align-items:center;justify-content:space-between;flex-basis:0}.logo-img{max-width:20vw;z-index:2}.authorization__section{display:flex;align-items:center;justify-content:center;flex-direction:column;row-gap:30px}.main{flex:1 1 90%;overflow-y:auto}.authorization__container,.confirmation__container,.userSettings__container{display:flex;align-items:center;justify-content:center;flex-direction:column;row-gap:30px;max-height:80%}.authorization__form,.confirmation__form,.userSettings__form{display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--color-red);border:var(--border-button);border-radius:var(--border-radius);row-gap:60px;padding:40px 60px}.userSettings__form{position:relative}.userSettings-close{border:var(--border-button);border-radius:var(--border-radius);background-color:var(--color-black);color:var(--color-white);padding:5px 10px;display:flex;align-items:center;justify-content:center;position:absolute;top:5px;right:5px}.authorization__title{display:flex;justify-content:center;align-items:center;font-weight:900;color:var(--color-white);background-color:var(--color-black);border-radius:var(--border-radius);margin-inline:auto;padding:20px}.authorization-label,.confirmation-label,.userSettings-label{font-weight:900;color:var(--color-white)}.authorization__input,.confirmation__input,.userSettings__input,.settings__dialog_name__input{border-radius:var(--border-radius);border:var(--border-button);padding:11px 30px}.authorization__buttons,.confirmation__buttons,.userSettings__buttons{display:flex;justify-content:center;align-items:center;column-gap:20px}.userSettings__buttons{flex-wrap:wrap;row-gap:15px}.authorization__buttons button,.confirmation__buttons button,.userSettings__buttons button{border:var(--border-button);border-radius:var(--border-radius);background-color:var(--color-black);color:var(--color-white);padding:var(--padding-button);display:flex;align-items:center;justify-content:center}.chat__section{height:100%}.window-wrapper,.chat__message{box-shadow:var(--box-shadow)}.chat__container{display:flex;flex-direction:column;justify-content:space-between;row-gap:20px;height:95%;position:relative}.window-wrapper{overflow-y:auto;overflow-x:hidden;height:auto;background-color:var(--color-pink);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border-bottom:var(--border-button);border-left:var(--border-button);border-right:var(--border-button);border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);flex-grow:1;display:grid;scroll-behavior:auto}*::-webkit-scrollbar{height:12px;width:12px}*::-webkit-scrollbar-track{background:var(--color-red)}*::-webkit-scrollbar-thumb{background-color:var(--color-white);border-radius:5px;border:2px solid var(--color-black)}.chat__friend-info{display:flex;justify-content:center;align-items:center;font-weight:900;color:var(--color-white);background-color:var(--color-black);border-top-left-radius:calc(var(--border-radius) * 6);border-top-right-radius:calc(var(--border-radius) * 6);margin-inline:auto;max-width:calc(var(--container-width) + var(--container-padding-x) * 2)}.chat__window{padding:25px;display:flex;flex-direction:column;align-items:start;justify-content:end;row-gap:10px}.chat__message{padding:10px 30px;background-color:var(--color-white);font-weight:300;display:inline-flex;flex-direction:column;justify-content:space-between;row-gap:10px;border:var(--border-button);border-radius:var(--border-radius);max-width:70%}.message__me{align-self:flex-end;transform:scale(1);transition-duration:.5s}.message{display:flex;justify-content:start;align-items:start;column-gap:5px;flex-wrap:wrap;flex-direction:column;pointer-events:none}.message__adressant{font-weight:700;word-break:break-word}.message__time{color:var(--color-grey);font-size:var(--font-size-small)}.message__data{display:flex;justify-content:space-between;align-items:end;column-gap:5px;pointer-events:none}.message__content{word-break:break-word}.message__check img{width:var(--width-check);height:var(--width-check)}.chat__form-wrapper{display:flex;align-items:center;justify-content:center;background-color:var(--color-red);border:var(--border-button);border-radius:var(--border-radius);column-gap:60px;padding:20px 30px;flex-grow:0;position:relative}.to-bottom{padding:10px;border:var(--border-button);background-color:var(--color-black);color:var(--color-accent);aspect-ratio:1;font-size:var(--font-size-small);border-radius:var(--border-radius);position:absolute;top:-240px;right:40px}.chat__input{border-radius:var(--border-radius);border:var(--border-button);padding:11px 30px;width:1164px;transition-duration:1s}.chat__input:focus{background-color:var(--color-black);animation:none;color:var(--color-white)}.emoji__wrapper{position:relative;min-width:38px;display:flex;align-items:center;justify-content:center}.chat__emoji{width:40px;transition-duration:.3s}.chat__emoji-menu{position:absolute;display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:center;width:100px;min-height:70px;top:-400%;right:-80%;background-color:var(--color-white);border:var(--border-button);padding:7px;border-radius:var(--border-radius);transition-duration:.3s;opacity:1}.chat__emoji-menu span{cursor:pointer;-webkit-user-select:none;user-select:none}.chat__send{display:flex;justify-content:center;align-items:center;border-radius:var(--border-radius);border:var(--border-button);padding:12px 28px;animation-name:twitchy-back;animation-duration:.5s;animation-iteration-count:6;animation-direction:alternate;animation-delay:3s;animation-timing-function:ease-out;transition-duration:.3s}.chat__send svg path{animation-name:twitchy;animation-duration:.5s;animation-iteration-count:6;animation-direction:alternate;animation-delay:3s;animation-timing-function:ease-out;transform:scaleX(1.5) translate(-10%);transition-duration:.3s}.send-img{width:40px;height:25px}.footer{flex:0 0 auto}.footer__container{display:flex;align-items:center;justify-content:center;column-gap:10vw}.exit__dialog,.subModal,.settings__dialog{display:flex;flex-direction:column;row-gap:15px;background-color:var(--color-black);font-weight:300;border:var(--border-button);border-radius:var(--border-radius);padding:30px;position:absolute;top:20px;margin-inline:auto;align-items:center}.settings__dialog{width:max(40vw,300px)}.exit__title,.settings__title,.subTitle{display:flex;justify-content:center;align-items:center;font-weight:900;color:var(--color-white);background-color:var(--color-black);border-radius:var(--border-radius);margin-inline:auto;padding:20px}.settings__title{font-size:calc(var(--font-size-basic) * 1.3);background-color:var(--color-red)}.settings__title_filter-by-name{padding:20px 20px 5px}.settings__list{display:flex;flex-direction:column;row-gap:20px;align-items:flex-start;justify-content:center}.settings__item{font-weight:900;cursor:pointer;transition-duration:.3s;position:relative;color:var(--color-white);padding:3px 20px;background-color:var(--color-red);border-radius:calc(var(--border-radius) / 3);width:100%;text-align:center}.settings__item:after{content:"";position:absolute;top:110%;left:50%;translate:-50%;background-color:var(--color-red);height:4px;width:0;z-index:3;transition-duration:.3s}.exit__buttons{display:flex;flex-direction:row;column-gap:15px}.theme__buttons{display:flex;flex-direction:column;row-gap:15px}.filter-by-name__buttons{display:flex;column-gap:15px}.settings__dialog_filter-by-name{padding:10px 30px}.settings__dialog{display:flex;align-items:center;min-height:400px}.subModal{border:4px dashed var(--color-red);top:30px;display:flex;align-items:center;min-height:370px;min-width:max(30vw,250px);justify-content:space-between}.subModal button{flex-grow:0}.subclose,.settings__close{position:absolute;top:5px;right:5px;border:var(--border-button);background-color:var(--color-white);padding:5px}.cross{pointer-events:none;width:20px;height:20px!important}.filter-by-name-list{overflow-y:auto;border:2px solid var(--color-red);padding:10px;font-size:var(--font-size-small);max-height:200px;width:100%;display:flex;flex-direction:column;row-gap:10px}.filter-by-name-item{color:var(--color-grey);border-bottom:4px solid var(--color-red);padding:5px;cursor:pointer;justify-content:center;transition-duration:.3s;transition-behavior:smooth}.selectedByName{color:var(--color-white);border-bottom:4px solid var(--color-white);font-weight:900}.selectedByName:after{content:"✔"}.message__toolTip{position:relative;transition-duration:.3s}.toolTip__delete-button{position:absolute;top:-5px;right:-25px;padding:2px;background-color:transparent;font-size:var(--font-size-small);box-shadow:none;border:none;opacity:1}.toolTip__delete-button svg{width:25px;height:30px;fill:var(--color-white);pointer-events:none}.message__to-hell{animation-name:to-hell;animation-duration:1s}.highlighted{background-color:var(--color-red);transform:scale(.95);transition-duration:.5s}.highlighted *{color:var(--color-white)}.unVisibleButExists{opacity:0!important;pointer-events:none;transition-duration:.5s!important}.deleteAllMessagesButton{padding:10px;border:var(--border-button);background-color:var(--color-black);color:var(--color-accent);font-size:var(--font-size-small);border-radius:var(--border-radius);position:absolute;top:20px;right:40px;z-index:5;opacity:1;transition-duration:.5s}@media (prefers-reduced-motion: no-preference){button:active{background-color:var(--color-white);color:var(--color-black);transform:translateY(5%)}.button:active{background-color:var(--color-black);color:var(--color-white);transform:translateY(5%)}.filter-by-name__buttons button:active,.exit__yes:active,.exit__no:active,.settings__dialog__confirm_name:active{background-color:var(--color-white);color:var(--color-black)}.chat__send:active{background-color:var(--color-black);color:var(--color-white);transform:translateY(5%)}.chat__send:active svg path{filter:brightness(100);transform:scaleX(1.7) translate(-10%);fill:var(--color-white)}.subclose:active,.settings__close:active{background-color:var(--color-red)}.light_theme_button:active{background-color:var(--color-white);color:var(--color-black)}button:active img{filter:brightness(100);transform:rotate(360deg) scale(1.15)}input:active{transform:translateY(5%)}.chat__emoji:active{transform:translateY(5%) scale(1.15)}.settings__item:active{transform:scale(1.1);color:var(--color-black);background-color:var(--color-white)}.settings__item:active:after{width:100%}.filter-by-name-item:active{transform:scaleX(.95);border-bottom:4px solid var(--color-white);font-weight:900;color:var(--color-white)}.toolTip__delete-button:active{transform:rotate(3deg) scale(1.1);color:var(--color-black);background-color:transparent}.toolTip__delete-button:active svg{fill:var(--color-black)}}@media (any-pointer: fine){.toolTip__delete-button:hover{transform:rotate(3deg) scale(1.1);color:var(--color-black);background-color:transparent}.toolTip__delete-button:hover svg{fill:var(--color-black)}button,button img{transition-duration:.2s}button:hover{background-color:var(--color-white);color:var(--color-black);transform:translateY(5%)}.button:hover{background-color:var(--color-black);color:var(--color-white);transform:translateY(5%)}.filter-by-name__buttons button:hover,.exit__yes:hover,.exit__no:hover,.settings__dialog__confirm_name:hover{background-color:var(--color-white);color:var(--color-black)}.chat__send:hover{background-color:var(--color-black);color:var(--color-white);transform:translateY(5%)}.chat__send:hover svg path{filter:brightness(100);transform:scaleX(1.7) translate(-10%);fill:var(--color-white)}.subclose:hover,.settings__close:hover{background-color:var(--color-red)}.light_theme_button:hover{background-color:var(--color-white);color:var(--color-black)}button:hover img{filter:brightness(100);transform:rotate(360deg) scale(1.15)}input:hover{transform:translateY(5%)}.chat__emoji:hover{transform:translateY(5%) scale(1.15)}.settings__item:hover{transform:scale(1.1);color:var(--color-black);background-color:var(--color-white)}.settings__item:hover:after{width:100%}.filter-by-name-item:hover{transform:scaleX(.95);border-bottom:4px solid var(--color-white);font-weight:900;color:var(--color-white)}}@media (max-width: 1070px){.chat__form-wrapper{padding:10px;column-gap:20px}.authorization__form,.confirmation__form,.userSettings__form{padding:40px}.chat__send{padding:4px 20px}:root{--border-radius: 10px;--width-buttons: 20vw}.logo-img{max-width:25vw}}@media (max-width: 760px){:root{--border-radius: 8px;--width-buttons: 25vw}.chat__send{padding:4px 15px}.chat__form-wrapper{column-gap:20px;padding:5px 20px}.authorization__form,.confirmation__form,.userSettings__form{padding:40px 20px}.header__container{justify-content:center}.send-img{height:25px;width:8vw}.chat__container{row-gap:10px}.chat__window{padding:10px}.logo-img{max-width:40vw}.header{margin-bottom:0}.chat__message{max-width:85%}.chat__input{padding:5px 20px}.chat__emoji{width:30px}.chat__emoji-menu{top:-520%;right:-80%}}@media (max-width: 570px){.container{padding:0}.authorization__buttons{flex-wrap:wrap;row-gap:20px}:root{--width-buttons: 33vw}.send-img{width:10vw}}@media (max-width: 430px){body{padding:10px 5px}.chat__form-wrapper{padding:3px 5px;column-gap:10px}.send-img{width:5vw;height:15px}.chat__input{padding:5px;max-width:60vw}:root{--width-buttons: 45vw}.header{margin-bottom:5px}.logo-img{max-width:50vw}.chat__friend-info{font-size:14px;text-align:center}.exit__dialog,.settings__dialog_name,.settings__dialog{padding:15px}}