:root{--font-family: "Verdana", sans-serif;--breakpoint-sm: 400px;--breakpoint-md: 800px;--breakpoint-lg: 1000px;--dark: #121315;--light: #212328;--ligher: #2e333d;--accent: #6b8afd;--background: var(--dark);--background-secondary: var(--light);--background-tertiary: var(--ligher);--message-background-sender: var(--background-tertiary);--message-background-recipient: #424957;--text: #e0e0e0;--text-secondary: #6d6d6d;--text-tertiary: #f5f5f5;--border: 1px solid #e5e7eb;--border-radius: 24px;--border-radius-small: calc(var(--border-radius) / 2);--padding: 2em;--margin: 2em;--gutter: 12px;--gutter-small: calc(var(--gutter) / 2);--gutter-medium: calc(var(--gutter) * 2);--gutter-big: calc(var(--gutter) * 3)}*{box-sizing:border-box;outline:none}body{font-family:var(--font-family);margin:0;padding:0;background-color:var(--background)}h1,h2,h3,h4,h5,h6{margin:0;padding:0;color:var(--text)}a{text-decoration:none;color:inherit}html{overflow:hidden;height:100dvh}body{min-height:580px;height:100%;overflow:auto;background-color:#1c1c1d}.app{margin:auto;max-width:1200px;border-radius:var(--border-radius);background-color:var(--background);color:var(--text);display:flex;height:100vh;height:100dvh;flex-direction:column}.panel{padding-top:2px;min-width:260px;display:flex;flex-direction:column;gap:var(--gutter);overflow:scroll;&:not(:first-child){display:none}}.main{background-color:var(--background-secondary);border-radius:var(--border-radius);flex-grow:1;max-width:1080px;display:flex;flex-direction:column;padding:var(--gutter-medium);gap:var(--gutter-medium);height:calc(100dvh - 50px);overflow:scroll}@media (min-width: 800px){.app{flex-direction:row}.main{flex-direction:row;padding:var(--gutter-big);gap:var(--gutter-big);height:initial;overflow:initial;flex-direction:row-reverse;justify-content:flex-end}.panel{max-width:340px;min-width:340px}.panel:not(:first-child){display:flex}}.icon{cursor:pointer}.center-center{margin:auto}.conversation__input{flex-grow:0;flex-shrink:0;justify-content:space-between;align-items:flex-end;display:flex;gap:var(--gutter);background-color:var(--background-tertiary);border-radius:var(--border-radius-small);padding:var(--gutter);.icon{color:var(--text-secondary);flex-shrink:1;aspect-ratio:1}}.conversation__input__textarea{flex-grow:1;max-height:240px;resize:none;field-sizing:content;background-color:transparent;border:none;color:var(--text);font-family:var(--font-family)}.conversation-list__item{display:flex;border-radius:var(--border-radius-small);position:relative;padding:var(--gutter);gap:var(--gutter);cursor:pointer}.conversation-list__item--active{background-color:var(--background-tertiary);cursor:default}.conversation-list__item:not(.conversation-list__item--active):hover{filter:brightness(1.2)}.conversation-list__item__avatar{background-color:var(--accent);border-radius:var(--border-radius-small);flex-basis:48px;min-width:48px;max-height:48px;aspect-ratio:1;text-align:center;display:flex;align-items:center;justify-content:center;font-size:1.5em}.conversation-list__item__content{flex-grow:1}.conversation-list__item__content__name{font-size:.8em;margin:4px 0}.conversation-list__item__content__preview{font-size:.7em;color:var(--text-secondary);max-height:16px;overflow:hidden}.conversation-list__item__meta{flex-shrink:1;display:flex;flex-direction:column;justify-content:space-around;align-items:center}.conversation-list__item__meta__time{font-size:.7em;color:var(--text-secondary)}.conversation-list__item__meta__unread{background:var(--accent);border-radius:50%;aspect-ratio:1;text-align:center;font-size:.7em;padding:2px}.conversation__messages__message{display:flex;gap:var(--gutter-small);align-items:flex-end}.conversation__messages__message__avatar{background-color:var(--accent);border-radius:var(--border-radius-small);flex-basis:48px;min-width:48px;max-height:48px;min-height:48px;max-width:48px;aspect-ratio:1;text-align:center;display:flex;align-items:center;justify-content:center;font-size:1.5em;visibility:hidden}.conversation__messages__message__content{position:relative;background-color:var(--message-background-recipient);border-radius:var(--border-radius-small);padding:var(--gutter);font-size:.9em;white-space:pre-line;word-wrap:break-word}.sender .divider+.conversation__messages__message__content__text,.recipient .conversation__messages__message__content__text:not(.divider+.conversation__messages__message__content__text){font-style:italic;opacity:.3}.conversation__messages__message__content:before{content:"";height:50%;width:10px;position:absolute;border-right:10px solid var(--message-background-recipient);border-bottom-right-radius:24px;bottom:0;left:0;transform:translate(-10px);visibility:hidden}.conversation__messages__message__wrapper{display:flex;flex-direction:column;gap:var(--gutter)}.conversation__messages__message--self{flex-direction:row-reverse;.conversation__messages__message__content:before{transform:rotateY(-185deg) translate(-10px);left:unset;right:0}}.conversation__messages__message--self .conversation__messages__message__content{background-color:var(--message-background-sender);&:before{border-color:var(--message-background-sender)}}.conversation__messages__message:first-child,.conversation__messages__message--self+.conversation__messages__message:not(.conversation__messages__message--self),.conversation__messages__message:not(.conversation__messages__message--self)+.conversation__messages__message--self{&:not(:first-child){margin-bottom:var(--gutter-medium)}.conversation__messages__message__content:before,.conversation__messages__message__avatar{visibility:visible}}.conversation__messages__message__content__meta{display:flex;justify-content:space-between;margin-top:var(--gutter-small)}.conversation__messages__message__content__meta__time{text-align:right;color:var(--text-secondary);font-size:.7em}.conversation{display:flex;flex-grow:1;overflow-y:scroll;flex-direction:column;gap:var(--gutter)}.conversation__header{flex-shrink:0;flex-grow:0;display:flex;align-items:center;justify-content:space-between;gap:var(--gutter);.conversation__header__content{flex-grow:1;.conversation__header__content__name{font-weight:700;font-size:1.2em}.conversation__header__content__info{font-size:.8em;color:var(--text-secondary)}}.conversation__header__actions{flex-grow:0;text-align:right;display:flex;color:var(--text-secondary);gap:var(--gutter-medium)}}.divider{border:1px solid #ffffff0f;border-radius:24px}.divider--horizontal{width:92%;margin:0 auto}.loading-shimmer{position:fixed;top:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,#0ff0,#00ffff80,#0ff0);background-size:200% 100%;animation:glow 2s linear infinite;z-index:9999;pointer-events:none}@keyframes glow{0%{background-position:100% 0}to{background-position:-100% 0}}.loading-shimmer:after{content:"";position:absolute;inset:0;box-shadow:0 0 15px 5px #00ffff4d;opacity:0;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.7}50%{opacity:1}}.login{padding:var(--gutter-medium);max-width:360px;width:100%;margin:auto;display:flex;flex-direction:column;gap:var(--gutter-big);max-height:100%;overflow:scroll}.login__header{text-align:center}.form{display:flex;flex-direction:column;gap:var(--gutter-medium)}.form__form-input-row{display:flex;gap:var(--gutter-medium)}.form__input-group__label{display:flex;flex-direction:column;gap:var(--gutter-small)}.form__input-group__label-text{color:var(--text-secondary);font-synthesis:.8em}.toogle_login_register{display:flex;justify-content:space-evenly;gap:var(--gutter-small)}.toogle_login_register__link{color:var(--text-secondary);&.toogle_login_register__link--active{color:var(--text-primary)}}.forgot-password{font-size:.8em;text-align:center;margin:var(--gutter-big) 0;color:var(--text-secondary)}.form__input-group__input-container{display:flex;gap:var(--gutter);padding:var(--gutter);border-radius:var(--border-radius-small);background-color:var(--background-tertiary);&:has(.form__input-group__input:focus){outline:1px solid var(--accent);.form__input-group__input-icon{color:var(--accent)}}}.form__input-group__input{color:var(--text);background-color:transparent;border:none;width:100%;&::placeholder{display:none}}.form__input-group__input-icon{color:var(--text-secondary)}.form-button__button{background-color:var(--accent);border-radius:var(--border-radius-small);padding:var(--gutter);border:none;color:var(--text);font-size:1.2em;width:100%;cursor:pointer;&.form-button__button--disabled{background-color:var(--background-secondary);cursor:not-allowed}&:not(.form-button__button--disabled):hover{filter:brightness(1.1)}&:not(.form-button__button--disabled):active{filter:brightness(1)}}.logout-link{display:flex;justify-content:space-evenly;align-items:baseline;margin-bottom:var(--gutter-big);color:var(--accent)}.nav{padding:var(--gutter-medium);display:flex;justify-content:flex-start;align-items:center;gap:var(--gutter-big);height:50px}.nav__icon{font-weight:700;font-size:28px}.nav__nav-items{min-width:44px;flex-grow:1;display:flex;flex-direction:row;justify-content:flex-start;align-items:center;font-size:1.1rem;gap:var(--gutter-medium);color:var(--text-secondary)}.nav__nav-items__item--active{color:var(--accent)}.nav__nav-items__item:last-of-type{flex-grow:1;justify-self:self-start;display:flex;flex-direction:column;flex-direction:row;justify-content:flex-end}@media (min-width: 800px){.nav{flex-direction:column;height:initial}.nav__nav-items{font-size:1.5rem;flex-direction:column}.conversation__messages__message__content{max-width:calc(100% - 100px)}.nav__nav-items__item:last-of-type{flex-direction:column}}.person-container{display:flex;flex-direction:column;gap:var(--gutter);width:100%;flex-grow:1;overflow-y:scroll}.top-title{font-size:1.2em;color:var(--text);margin-bottom:var(--gutter-small)}.top-subtitle{color:var(--text-secondary);font-size:.8em}.column-title{color:var(--text-secondary)}.start-new-convo{display:flex;justify-content:center;gap:var(--gutter);background-color:var(--accent);padding:var(--gutter);border-radius:var(--border-radius-small);cursor:pointer;color:var(--text);&:hover:not(:active){filter:brightness(1.1)}}.search-box{border-radius:var(--border-radius-small);position:relative;margin:0 var(--gutter)}.search-box__input{background:var(--background-tertiary);border:none;width:100%;height:100%;color:var(--text);padding:var(--gutter);border-radius:var(--border-radius-small);outline:none;box-shadow:none!important}.search-box__icon{text-align:center;position:absolute;left:10px;top:50%;transform:translateY(-50%);content:"Q";height:24px;width:24px;color:#fff;margin-top:2px}.saved-messages{width:100%;margin:0 auto}@media screen and (min-width: 800px){.saved-messages{width:60%}}.saved-message{border:2px solid #ffffff0f;border-radius:var(--border-radius-small);padding:var(--gutter)}@keyframes slideUp{0%{transform:translate(-50%,300%)}to{transform:translate(-50%)}}.toast{padding:var(--gutter);background-color:var(--background-tertiary);border-radius:var(--border-radius-small);box-shadow:0 0 10px #0000001a;border:1px solid var(--background-secondary);background-attachment:#ffffff05;left:50%;position:fixed;z-index:1000;bottom:60px;width:320px;max-width:90%;transform:translate(-50%);transform:translateX(-50%,300px);animation:slideUp .3s ease-out;background-color:#18181a;border:1px solid #29292d;color:#e4e4e7;transition:transform .2s;&:last-child{&.warning{background-color:#261e13;border-color:#503716;color:#fde68a;transition-delay:.3s}&.error{background-color:#251416;border-color:#4e1e20;color:#fecaca}&.success{background-color:#13201c;border-color:#173f30;color:#a8f3d0}}&:nth-last-child(2){transform:translate(calc(-50% + 0px),-9px)}&:nth-last-child(3){transform:translate(calc(-50% + 0px),-16px)}}