body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-Family:JetBrains Mono}.settings-dark-container{color:#fff;display:flex;font-family:sans-serif;min-height:100vh}.settings-sidebar{background-color:#f8f2e6;border-right:1px solid #333;padding:30px 20px;width:240px}.settings-sidebar ul{list-style:none;margin:0;padding:0}.settings-sidebar li{font-weight:500;padding:12px 0}.settings-sidebar li.active{color:#fff}.settings-main-content{background-color:#f8f2e6;color:#000;flex:1 1;padding:40px}.profile-banner{align-items:center;display:flex;gap:20px;margin-bottom:30px}.avatar{border:2px solid #444;border-radius:50%;height:80px;object-fit:cover;width:80px}.username-display{font-size:1.1rem;font-weight:700;text-transform:lowercase}.change-photo-btn{background:#1d4ed8;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;margin-top:5px;padding:6px 12px}.input-block{margin-bottom:20px}.input-block label{color:#aaa;display:block;font-size:.85rem;margin-bottom:5px}.input-block input{background:#121212;border:1px solid #333;border-radius:6px;color:#fff;padding:10px;width:100%}.save-btn{background-color:#1d4ed8;border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:700;margin-top:10px;padding:10px 20px}.settings-sidebar li{border-radius:8px;color:#000;cursor:pointer;padding:12px 16px;transition:background-color .2s ease}.settings-sidebar li.active{background-color:#d3d3d3;border-radius:8px;color:#000;font-weight:700;padding:12px 16px}.settings-container{background-color:#f8f2e6;color:#000;height:100vh;overflow-y:auto;padding:60px 20px 40px;text-align:center}.settings-container h1{font-size:24px;margin-bottom:20px}.settings-container p{font-size:14px;margin:5px 0}.settings-container input{color:#000;font-size:14px}.profile-picture-container{align-items:center;display:flex;flex-direction:column;margin-bottom:15px}.profile-picture{border-radius:50%;height:80px;object-fit:cover;width:80px}.profile-picture,.profile-picture-upload input[type=file]{margin-bottom:8px}.profile-picture-upload button{background-color:#fc3;border:none;border-radius:5px;color:#000;cursor:pointer;font-size:14px;padding:8px 16px}.profile-picture-upload button:hover{background-color:#e6b800}.checkbox-container{background-color:#d1d1d1;border-radius:8px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:10px auto;max-width:300px;padding:10px;text-align:center}.checkbox-container label{align-items:center;display:flex;gap:5px;white-space:nowrap}.update-fields{display:flex;flex-direction:column;gap:8px;margin-bottom:15px}.update-fields input{background-color:#d1d1d1;border:1px solid #ccc;border-radius:8px;margin:0 auto;max-width:280px;padding:8px;width:100%}.update-fields button{background-color:#fc3;border:none;border-radius:5px;color:#000;cursor:pointer;font-size:14px;margin:5px auto;padding:8px 16px}.update-fields button:hover{background-color:#e6b800}.post-creation{margin:0 auto;max-width:480px;width:100%}.post-creation textarea{background-color:#d1d1d1;border:1px solid #ccc;border-radius:8px;font-size:14px;margin-bottom:8px;padding:8px;width:100%}.post-creation button{background-color:#fc3;border:none;border-radius:5px;color:#000;cursor:pointer;font-size:14px;padding:8px 16px}.post-creation button:hover{background-color:#e6b800}.user-posts{margin:0 auto;max-width:480px;padding-bottom:20px;width:100%}.post-container{background-color:#fff;border:1px solid #ddd;border-radius:10px;box-shadow:0 4px 8px #0000001a;display:flex;flex-direction:column;margin-bottom:12px;max-width:100%;overflow-wrap:break-word;padding:12px;position:relative}.post-container img{border-radius:8px;margin-top:8px;max-height:280px;object-fit:contain;width:100%}.post-container button{background-color:red;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:12px;padding:4px 8px;position:absolute;right:8px;top:8px}.post-container button:hover{background-color:darkred}.modal-overlay{align-items:center;background:#00000080;height:100%;padding:2rem;width:100%;z-index:999}.modal-content{background:#fff;border-radius:12px;box-shadow:0 8px 16px #0003;max-height:90vh;max-width:700px;min-height:60vh;overflow-y:auto;padding:2rem;text-align:center}.modal-update-fields{display:flex;flex-direction:column;gap:12px;margin-top:1rem}.modal-update-fields input{background-color:#d1d1d1;border:1px solid #ccc;border-radius:8px;color:#000;font-size:14px;padding:10px}.modal-update-fields button{background-color:#fc3;border:none;border-radius:6px;color:#000;cursor:pointer;font-weight:600;padding:10px}.modal-update-fields button:hover{background-color:#e6b800}.modal-close-button{background-color:#888;border:none;border-radius:6px;color:#fff;margin-top:8px;padding:8px 16px}.modal-close-button:hover{background-color:#666}.modal-close-x{background:none;border:none;color:#666;cursor:pointer;font-size:28px;font-weight:700;position:absolute;right:24px;top:20px;transition:color .2s ease;z-index:1001}.modal-close-x:hover{color:#000}.user-info{background:#fff;border-radius:12px;box-shadow:0 1px 4px #00000026;cursor:pointer;font-size:14px;margin:20px auto;max-width:400px;padding:16px;transition:box-shadow .2s ease}.profile-item{border-bottom:1px solid #ddd;display:flex;justify-content:space-between;padding:10px 0}.profile-item:last-child{border-bottom:none}.label{color:#444;font-weight:600}.value{color:#222;font-weight:500}@media (max-width:768px){.settings-dark-container{flex-direction:column;padding:10px}.settings-sidebar{border-bottom:1px solid #ccc;border-right:none;display:flex;flex-wrap:wrap;justify-content:space-around;padding:10px;width:100%}.settings-main-content{padding:20px 10px}.user-info{font-size:14px;max-width:100%;padding:12px;width:100%}.profile-item{align-items:flex-start;flex-direction:column}.profile-item .label,.profile-item .value{text-align:left;width:100%}iframe{aspect-ratio:16/9;height:auto!important;width:100%!important}.modal-content{padding:1rem;width:95%}.post-container button{margin-top:8px;position:relative;right:0;top:0}}.circle-wrapper{height:260px;position:absolute;width:260px}.circle{background:radial-gradient(circle at top left,#00c896cc 10%,#4a00e0cc 40%,#800080e6 70%,#c000c099 100%);box-shadow:inset -15px -15px 35px #00000080,5px 5px 25px #0006;height:220px;width:220px}.circle,.circle-overlay{border-radius:50%;left:50%;opacity:1;position:absolute;top:50%;transform:translate(-50%,-50%)}.circle-overlay{background:radial-gradient(circle at top left,#00c8964d 10%,#4a00e04d 40%,#80008066 70%,#c000c033 100%);box-shadow:inset -15px -15px 35px #0000004d,5px 5px 25px #0003;height:240px;width:240px}.orange-circle{background:radial-gradient(circle at top left,#ff8c00cc 10%,#ff4500cc 40%,#ff6347e6 70%,#ffa50099 100%);border-radius:50%;box-shadow:inset -15px -15px 35px #00000080,5px 5px 25px #0006;height:220px;left:50%;opacity:1;position:absolute;top:50%;transform:translate(-50%,-50%);width:220px}.orange-overlay{background:radial-gradient(circle at top left,#ff8c004d 10%,#ff45004d 40%,#ff634766 70%,#ffa50033 100%);box-shadow:inset -15px -15px 35px #0000004d,5px 5px 25px #0003;opacity:1}.circle-outline,.orange-overlay{border-radius:50%;height:240px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:240px}.first-circle{z-index:3}.second-circle{z-index:1}.third-circle{z-index:2}.fourth-circle{z-index:1}body,html{border:none;height:100%;width:100%}body{font-Family:JetBrains Mono;background-color:#f8f2e6}.split-container{display:flex;height:100%;width:100%}.left-section{align-items:center;background-color:purple;display:flex;flex:1 1;flex-direction:column;justify-content:center;min-height:100%;overflow:hidden;position:static}.website-name{color:#b7adad;font-family:Bricolage Grotesque,Bricolage Grotesque Fallback;font-size:3.5rem;font-weight:700;text-align:center}.website-subtitle{color:#ffffffe6;font-size:1.8rem;font-style:italic;font-weight:400;margin-top:.5rem}.right-section{align-items:flex-start;background-color:#b7adad;display:flex;flex:1 1;height:100%;justify-content:center;overflow-y:auto;position:relative}.login-container{background:#d9d9d9;border-radius:20px;box-shadow:0 4px 15px #0000001a;max-height:300px;max-width:500px;padding:2.5rem;width:100%}.title-container{align-items:center;display:flex;flex-direction:column;text-align:center}.corner-decor{height:60px;position:absolute;width:60px;z-index:1}.corner-image{height:100%;object-fit:contain;width:100%}.corner-tl{left:10px;top:1%}.corner-tr{right:10px;top:10px}.corner-bl{bottom:30px;left:5px}.corner-br{bottom:10px;right:10px}.error-message{color:red;font-weight:700}.title{color:#fff}.register-title,.title{font-size:30px;margin-bottom:20px}.register-title{color:#000;font-weight:700}.form-group{align-items:center;display:flex;flex-direction:column;margin-bottom:15px}.form-group label{color:#000;font-size:20px;font-weight:700;text-align:left;width:250px}.form-group input{background-color:#b7adad;border:none;border-radius:10px;font-size:18px;height:35px;padding-left:10px;width:250px}.new-user-header{color:#555;font-family:JetBrains Mono,monospace;font-size:.9rem;letter-spacing:.25px;margin-bottom:.5rem;margin-top:200px;text-transform:uppercase}.create-account-button,.login-button{font-Family:JetBrains Mono;background-color:teal;border:none;border-radius:10px;color:#fff;cursor:pointer;font-size:18px;font-weight:700;height:45px;margin-top:10px;width:260px}.create-account-button{margin-top:15px}.forgot-password{color:purple;display:block;font-size:16px;margin-top:15px;text-decoration:none}.forgot-password span{font-weight:700}.input-error{color:red;margin-top:5px}@media (max-width:768px){.login-content-container{flex-direction:column}.left-section{display:none;padding:1rem}.right-section{min-height:100vh;padding:1rem}.login-container{background-color:#d9d9d9;box-shadow:none;max-width:100%;padding:1.5rem}.mobile-logo-container{display:block;margin-bottom:1.5rem;text-align:center}.mobile-logo{height:auto;max-width:150px}.website-name{font-size:2rem}.website-subtitle{font-size:1.2rem}}.modal-overlay{align-items:flex-start;background-color:#00000080;bottom:0;display:flex;justify-content:center;left:0;overflow-y:auto;padding:20px;position:fixed;right:0;top:0;z-index:1000}.modal-content{background-color:teal;border-radius:30px;box-shadow:0 4px 15px #0000001a;margin:auto;max-height:50vh;max-width:400px;padding:1.5rem;position:relative;width:100%}.modal-content label{color:#000;display:block;font-size:.95rem;margin-bottom:.5rem;width:100%;word-break:break-word}.modal-content input{border:1px solid #ddd;font-size:.9rem;margin-bottom:1rem;padding:.6rem}.modal-content input,.submit-button{border-radius:8px;box-sizing:border-box;font-family:JetBrains Mono;width:100%}.submit-button{display:block;font-size:.8rem;line-height:1.2;margin:.5rem auto 0;overflow:hidden;padding:.35rem .5rem;text-align:center;text-overflow:ellipsis;transition:all .2s ease;white-space:nowrap}@media (max-width:768px){.modal-overlay{submit-button{font-size:.9rem;padding:.6rem}}.modal-content{max-height:85vh;max-width:95%;padding:1.2rem}.modal-content h2{font-size:1.2rem;margin-bottom:1rem}.submit-button{color:coral;cursor:pointer;font-family:JetBrains Mono;font-size:.9rem;font-weight:700;margin-top:.5rem;padding:.2rem 0;text-decoration:underline;transition:color .2s ease;width:auto}}@media (max-width:480px){.submit-button{font-size:.75rem;padding:.25rem .4rem}}:root{--primary:#3b1c8b;--secondary:#662d91;--accent:#ff8c00;--white:#fff;--light-gray:#f1f1f1;--shadow:0 4px 20px #0000001a;--transition:all 0.3s ease}.navbar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#3b1c8b,#662d91);background:linear-gradient(135deg,var(--primary),var(--secondary));box-shadow:0 4px 20px #0000001a;box-shadow:var(--shadow);color:#fff;color:var(--white);height:60px;justify-content:space-between;left:0;padding:0 1.5rem;position:fixed;right:0;top:0;z-index:1000}.navbar,.navbar-brand{align-items:center;display:flex}.navbar-brand{gap:.75rem;padding-left:1rem;z-index:1001}.logo-link{align-items:center;display:flex;height:100%}.website-logo{filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));height:auto;width:400px}.navbar-logo{height:40px;transition:all .3s ease;transition:var(--transition);width:auto}.brand-text{display:flex;flex-direction:column;gap:.25rem;line-height:1.1}.brand-title{-webkit-text-fill-color:#0000;background:linear-gradient(45deg,#ff8c00,gold);-webkit-background-clip:text;font-family:JetBrains Mono,monospace;font-size:1.3rem;font-weight:900;letter-spacing:1px;text-shadow:0 2px 4px #0000004d;text-transform:uppercase;transition:transform .3s ease}.brand-title:hover{transform:scale(1.05)}.brand-slogan{color:#ffffffd9;font-family:JetBrains Mono,monospace;font-size:.7rem;font-style:italic;overflow:visible;text-overflow:clip;white-space:normal}.nav-content{gap:.75rem;z-index:1001}.nav-content,.nav-search{align-items:center;display:flex}.nav-search{position:relative;width:280px}.nav-search input{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#ffffff26;border:none;border-radius:20px;color:#fff;color:var(--white);height:40px;padding:0 1rem;transition:all .3s ease;transition:var(--transition);width:100%}.nav-search input:focus{background:#ffffff40;box-shadow:0 0 0 2px #ff8c00;box-shadow:0 0 0 2px var(--accent);outline:none}.nav-search input::placeholder{color:#ffffffb3}.search-btn{background:none;border:none;color:#fff;color:var(--white);cursor:pointer;font-size:1.1rem;height:48px;position:absolute;right:12px;transition:all .3s ease;transition:var(--transition);width:48px}.search-btn:hover{color:#ff8c00;color:var(--accent);transform:rotate(10deg)}.nav-links{gap:2rem;list-style:none;margin:0;padding:0}.nav-item,.nav-links{align-items:center;display:flex}.nav-item{color:#ffffffd9;flex-direction:column;font-size:1.2rem;padding:.4rem;position:relative;text-decoration:none}.nav-item,.nav-item svg{transition:all .3s ease;transition:var(--transition)}.nav-item svg{font-size:1.35rem}.nav-label{bottom:-20px;font-size:.7rem;opacity:0;position:absolute;transition:all .3s ease;transition:var(--transition)}.nav-item:hover{color:#fff;color:var(--white);transform:translateY(-2px)}.nav-item:hover svg{filter:drop-shadow(0 0 5px #ff8c00);filter:drop-shadow(0 0 5px var(--accent));transform:scale(1.1)}.nav-item:hover .nav-label{bottom:-15px;opacity:1}.nav-item.active{animation:pop .3s ease;color:#ff8c00;color:var(--accent)}.nav-item.active:after{background:#ff8c00;background:var(--accent);border-radius:50%;bottom:0;content:"";height:5px;left:50%;position:absolute;transform:translateX(-50%);width:5px}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.12)}to{transform:scale(1)}}.dropdown-toggle,.mobile-search-bar button,.search-toggle{align-items:center;background:none;border:none;color:#fff;color:var(--white);display:flex;font-size:1.2rem;height:48px;justify-content:center;width:48px}@media (max-width:768px){.brand-slogan,.nav-links,.nav-search{display:none}.brand-title{font-size:1rem}.dropdown-menu{animation:fadeIn .2s ease-in-out;background:#fff;background:var(--white);border-radius:8px;box-shadow:0 4px 20px #0000001a;box-shadow:var(--shadow);overflow:hidden;position:absolute;right:1rem;top:60px;z-index:1000}.dropdown-menu a{align-items:center;border-bottom:1px solid #f1f1f1;border-bottom:1px solid var(--light-gray);color:#3b1c8b;color:var(--primary);display:flex;gap:.5rem;padding:.75rem 1rem;text-decoration:none;transition:all .3s ease;transition:var(--transition)}.mobile-search-bar{background:#fff;background:var(--white);display:flex;gap:.5rem;left:0;padding:.5rem 1rem;position:absolute;right:0;top:60px;z-index:1000}.mobile-search-bar input{border:1px solid #f1f1f1;border:1px solid var(--light-gray);border-radius:20px 0 0 20px;flex:1 1;font-size:.9rem;padding:.5rem .75rem}.mobile-search-bar button{background:#ff8c00;background:var(--accent);border:none;border-radius:0 20px 20px 0;color:#fff;color:var(--white);cursor:pointer}}.Text{color:#000}.App{text-align:center}.App-logo{height:40vmin}.divfont{font-family:JetBrains Mono,monospace}.App-header{align-items:flex-center;background-color:#f7f1e3;color:#fff;display:flex;flex-direction:row;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.deletePost{width:100%}.deleteIcon{float:right}.settings{color:#000;font-family:Lucida Sans,Lucida Sans Regular,Lucida Grande,Lucida Sans Unicode,Geneva,Verdana,sans-serif;width:100%}.settings-button{align-items:center;align-self:center;background-color:grey;border-radius:22px;font-size:36px;margin-bottom:25px;width:400px}.delete-popup-overlay{align-items:center;background:#0000;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%}.delete-popup{background:orange;border-radius:10px;color:#000;padding:20px;text-align:center}.link-button{background-color:initial;border:none;cursor:pointer;display:inline;margin:0;outline:none;padding:0}.link-button:active,.link-button:focus,.link-button:hover{outline:none;text-decoration:none}.submitbutton{background-color:blue;border-radius:5px;margin:10px}.no-suggestions{color:#999;padding:.5rem}.autocomplete input{width:calc(300px + 1rem)}.autocomplete{min-height:165px}.suggestions{border:1px solid #999;border-top:0 solid #999;display:inline-block;list-style:none;margin-top:0;max-height:143px;overflow-y:scroll;padding-left:0;position:relative;width:calc(300px + 1rem)}.suggestions li{padding:.5rem}.suggestion-active,.suggestions li:hover{background-color:#008f68;color:#fae042;cursor:pointer;font-weight:700}.suggestions li:not(:last-of-type){border-bottom:1px solid #999}.profileform label{display:block}.App-link{color:#09d3ac}.postlist,.userlist{background:blue;border-radius:20px;display:inline-flex;margin:10px;padding:30px;text-align:left;width:60%}.userlist{justify-content:space-between}.comments{background:#fff}.commentlist,.comments{border-radius:20px;color:#000;display:block;margin:10px;padding:10px;width:90%}.commentlist{background:#add8e6;font-size:12px;text-align:left}.hide{display:none}.maincontent{flex-grow:1;justify-content:center}.maincontent,.posts{display:flex;flex-direction:column}.posts{align-items:center;justify-content:flex-start}.postbody{color:red;max-width:650px}.comment-block,.postbody{align-items:flex-start;flex-direction:column}.comment-block,.postbody,.sidenav{display:flex;justify-content:center;width:100%}.sidenav{align-items:center;background-color:grey;height:auto;left:0;padding:0 2vw;position:fixed;top:0;z-index:1000}#side-menu-items{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;list-style:none;margin:0;padding:0;width:100%}#side-menu-items li{display:inline;flex-grow:1;text-align:center}#side-menu-items li a,.link-button{color:#000;display:block;font-size:clamp(20px,2.5vw,32px);font-weight:700;padding:1vh 1vw;text-decoration:none;white-space:nowrap;width:100%}#side-menu-items li a:hover,.link-button:hover{text-decoration:underline}.tag-active{border:thick solid red}.sidenav ul{list-style-type:none;margin:40px 0 0;padding:10px}.sidenav-icon{height:40px;margin-bottom:15px;width:40px}.comment-indicator{display:block;float:right;margin-top:10px;text-align:right;width:100%}.comment-icon{float:right;height:40px;width:40px}.comment-indicator-text{background-color:#add8e6;border-radius:10px;color:#000;float:right;font-size:16px;font-weight:700;margin-left:10px;padding:5px;text-align:center;width:120px}.modal{background-color:#0006;display:block;height:100%;left:0;overflow:auto;position:fixed;top:0;width:100%;z-index:0}.modal-content{background-color:#d9d9d9;border:1px solid #d9d9d9;height:200px;margin:15% auto;padding:1px 10px 20px 20px;width:50%}.close{color:#aaa;float:right;font-size:35px;font-weight:700;line-height:42px}.close:focus,.close:hover{color:#000;cursor:pointer;text-decoration:none}.chat{align-items:center;justify-content:center}.chat__main{flex:0.6 1}.message__container{background-color:purple;height:60vh;overflow-y:scroll;padding:20px;width:100%}.chat__footer{background-color:#000;padding:20px;width:100%}.form{height:100%;justify-content:space-between}.message{height:100%;padding:12px;width:80%}.messageIcon{height:40px;transition:transform .3s ease;width:40px}.messageIcon:hover{cursor:pointer;transform:scale(1.1)}.sendBtn{background-color:green;color:#ff0;outline:none;padding:10px;width:150px}.message__recipient{background-color:#000;color:#fff;text-align:start}.message__recipient,.message__sender{font-size:15px;padding:8px;width:fit-content}.message__sender{background-color:blue;margin-left:auto;max-width:400px;text-align:right}.recipient__name{color:#000;font-size:13px;text-align:left}.sender__name{color:#000;font-size:13px;text-align:right}body,html{max-width:100%;overflow-x:hidden}.container,.maincontent,.sidenav{max-width:100vw;overflow-x:hidden}.maincontent{margin-top:0}.background-img{background-image:url(/hci/teams/claem/static/media/Frame%203.6e4570afdf25af965a2c.png);background-position:50%;background-repeat:no-repeat;background-size:100%;display:flex;flex-direction:column;height:60%;padding-top:2.5%;width:60%}body.register-page .App-header{background:none!important;min-height:0!important;padding:0!important}.next-button{font-Family:JetBrains Mono;background-color:coral;border:none;border-radius:10px;cursor:pointer;font-size:18px;font-weight:700;height:45px;width:260px}.next-button,.title{color:#000;margin-top:10px}.register-group{align-items:center;display:flex;flex-direction:column;margin-bottom:25px}.register-group input{background-color:#080707;border:none;border-radius:10px;font-size:18px;height:100%;padding-left:10px;width:200px}.register-container{background:purple;border-radius:30px;box-shadow:0 4px 15px #0000001a;left:50%;max-width:600px;padding:2.5rem;position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}.register-wrapper{margin:0 auto;max-width:400px;position:relative}.registration-header{margin-bottom:1rem;text-align:center}.registration-logo{height:20%;margin:0 auto;width:20%}@media (max-width:430px){.registration-logo{width:50px}.register-container{border-radius:10px;padding:1.5rem}.register-group input{font-size:20px;width:100%}.next-button{width:100%}.title{font-size:28px}}:root{--brand-purple:#7e57c2;--brand-orange:coral;--soft-purple-bg:#f6f3ff;--bubble-gray:#e5e5ea;--brand-purple-dark:#5e3fa3;--transition-speed:0.3s;--chat-font:"Helvetica Neue",Arial,sans-serif;--body-bg:linear-gradient(135deg,var(--brand-purple) 0%,var(--brand-orange) 100%)}body{background:linear-gradient(135deg,#7e57c2,coral);background:var(--body-bg);color:#333;font-family:Helvetica Neue,Arial,sans-serif;font-family:var(--chat-font);min-height:100vh}.chat,body{display:flex;flex-direction:column}.chat{background-color:initial;height:calc(100vh - 4rem);margin:2rem auto;max-width:600px;width:95%}.chat__main{backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);background:#ffffff26;border:1px solid #ffffff4d;border-radius:12px;box-shadow:0 6px 12px #0000001a;display:flex;flex-direction:column;height:80vh;max-height:80vh;overflow:hidden;width:100%}.chat__header{background-color:#7e57c2;background-color:var(--brand-purple);border-bottom:1px solid #0000001a;display:flex;flex-shrink:0;font-size:16px;padding:12px 16px}.chat__header,.toggle-starter-btn{align-items:center;color:#fff;font-weight:600;justify-content:center}.toggle-starter-btn{background-color:coral;background-color:var(--brand-orange);border:none;border-radius:6px;box-shadow:0 2px 4px #0000001a;cursor:pointer;display:inline-flex;font-family:Helvetica Neue,Arial,sans-serif;font-family:var(--chat-font);font-size:14px;gap:.5rem;padding:8px 16px;transition:background-color .3s ease,transform .3s ease;transition:background-color var(--transition-speed) ease,transform var(--transition-speed) ease}.toggle-starter-btn:hover{background-color:coral;transform:translateY(-1px)}.conversation-starter{animation:fadeInSlideDown .5s ease forwards;background-color:#fafafa;border:1px solid #eee;border-radius:8px;box-shadow:0 1px 3px #00000014;flex-shrink:0;margin:10px auto;max-width:420px;padding:14px 16px;text-align:center;width:calc(100% - 20px)}@keyframes fadeInSlideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.starter-title{color:#7e57c2;color:var(--brand-purple);font-size:15px;font-weight:600;margin-bottom:8px}.starter-options{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.starter-option{background-color:#fff;border:1px solid #7e57c2;border:1px solid var(--brand-purple);border-radius:16px;box-shadow:0 1px 2px #0000000d;color:#7e57c2;color:var(--brand-purple);cursor:pointer;font-size:13px;padding:6px 12px;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease;transition:background-color var(--transition-speed) ease,box-shadow var(--transition-speed) ease,transform var(--transition-speed) ease}.starter-option:hover{background-color:#7e57c2;background-color:var(--brand-purple);box-shadow:0 4px 12px #0000001a;color:#fff;transform:translateY(-2px)}.message__container{background-color:#f6f3ff;background-color:var(--soft-purple-bg);display:flex;flex:1 1;flex-direction:column;min-height:0;overflow-x:hidden;overflow-y:auto;padding:12px 16px;scrollbar-color:#0003 #0000;scrollbar-width:thin}.message__container::-webkit-scrollbar{width:6px}.message__container::-webkit-scrollbar-thumb{background-color:#0003;border-radius:3px}.message__chats{display:flex;flex-direction:column;gap:8px;width:100%}.message__recipient,.message__sender{word-wrap:break-word;border-radius:16px;box-shadow:0 1px 3px #00000014;font-family:Helvetica Neue,Arial,sans-serif;font-family:var(--chat-font);font-size:14px;line-height:1.5;max-width:80%;overflow-wrap:break-word;padding:10px 14px;white-space:pre-wrap}.message__sender{align-self:flex-end;background-color:#7e57c2;background-color:var(--brand-purple);border-radius:16px 16px 0 16px;color:#fff;margin-left:20%}.message__recipient{align-self:flex-start;background-color:#e5e5ea;background-color:var(--bubble-gray);border-radius:16px 16px 16px 0;color:#000;margin-right:20%}.recipient__name,.sender__name{color:#555;font-size:12px;margin-bottom:2px;padding:0 4px}.chat__footer{background-color:#fff;border-top:1px solid #eee;display:flex;flex-shrink:0;gap:8px;padding:12px 16px}.form{align-items:center;display:flex;gap:10px;width:100%}.message{background-color:#fff;border:1px solid #ddd;border-radius:12px;flex:1 1;font-family:Helvetica Neue,Arial,sans-serif;font-family:var(--chat-font);font-size:14px;min-width:0;outline:none;padding:10px 14px;transition:border .3s ease;transition:border var(--transition-speed) ease}.message:focus{border-color:#7e57c2;border-color:var(--brand-purple)}.sendBtn{background-color:coral;background-color:var(--brand-orange);border:none;border-radius:12px;box-shadow:0 2px 4px #0000001f;color:#fff;cursor:pointer;flex-shrink:0;font-family:Helvetica Neue,Arial,sans-serif;font-family:var(--chat-font);font-size:14px;padding:10px 16px;transition:all .3s ease;transition:all var(--transition-speed) ease}.sendBtn:hover{background-color:#e69837;box-shadow:0 3px 8px #00000026;transform:translateY(-1px)}@media (max-width:480px){.chat{height:100vh;margin:0;width:100%}.chat__main{border-radius:0;box-shadow:none;height:100vh;max-height:100vh}.conversation-starter{margin:8px auto;width:calc(100% - 16px)}.starter-option{font-size:12px;padding:5px 10px}.message,.sendBtn{font-size:13px;padding:8px 12px}.chat__footer{padding:10px 12px}.message__recipient,.message__sender{max-width:85%;padding:8px 12px}}body,html{height:100vh}.account-container{font-Family:JetBrains Mono;align-items:center;background-color:#f8f2e6;display:flex;flex-direction:column;padding:20px;text-align:center}.account-title{color:#000;font-size:32px;font-weight:700;margin-bottom:20px}.image-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(3,1fr);max-width:600px}.image-box{align-items:center;background-color:#eaeaea;border:2px dashed #aaa;border-radius:10px;color:#000;cursor:pointer;display:flex;font-size:18px;height:150px;justify-content:center;overflow:hidden;position:relative;width:120px}.image-box img{border-radius:10px;height:100%;object-fit:cover;width:100%}.upload-text{color:#000!important}.activity-button,.upload-text{font-size:18px;font-weight:700}.activity-button{font-Family:JetBrains Mono;background-color:gray;border:none;border-radius:10px;color:#fff;cursor:pointer;margin-top:20px;padding:10px 20px}.activity-button:hover{background-color:#a9a9a9}.like-button{background-color:#4285f4;border:none;border-radius:10px;box-shadow:0 2px 5px #0003;color:#fff;cursor:pointer;font-family:JetBrains Mono;font-size:18px;font-weight:700;height:45px;margin:10px 5px;transition:all .3s ease;width:120px}.like-button:hover{background-color:#3367d6;transform:translateY(-2px)}.like-button:active{transform:translateY(0)}.reject-button{background-color:#9a001a;border:none;border-radius:10px;box-shadow:0 2px 5px #0003;color:#fff;cursor:pointer;font-family:JetBrains Mono;font-size:18px;font-weight:700;height:45px;margin:10px 5px;transition:all .3s ease;width:120px}.reject-button:hover{background-color:#d33426;transform:translateY(-2px)}.reject-button:active{transform:translateY(0)}.button-container{display:flex;gap:10px;justify-content:center;margin-top:20px}.like-button:disabled,.reject-button:disabled{background-color:#ccc;cursor:not-allowed;transform:none}body,html{height:auto;overflow-y:auto}.login-container{min-height:100vh;overflow-x:hidden;overflow-y:auto}.Text,.login-container{display:flex;flex-direction:column}.Text{background-color:initial!important;flex-grow:1;padding-bottom:120px}.my-profile-card{background-color:#fff;border-radius:16px;box-shadow:0 4px 8px #0000001a;font-size:16px;line-height:1.6;margin:10px;padding:30px;text-align:center;width:300px}.my-profile-hover{position:absolute;right:15px;top:15px;z-index:10}.profile-card{overflow:visible;position:relative}.hover-trigger{display:inline-block;position:relative}.hover-trigger img{border-radius:50%;cursor:pointer;height:45px;transition:transform .2s ease;width:45px}.hover-trigger:hover img{transform:scale(1.05)}.hover-card{background-color:#fff;border-radius:12px;box-shadow:0 4px 8px #0000001a;display:none;font-size:13px;line-height:1.4;max-height:320px;overflow-y:auto;padding:12px;position:absolute;right:0;top:100%;width:330px;word-break:break-word;z-index:1001}.hover-trigger:hover .hover-card{display:block}.account-activity-title{color:#000;font-size:20px;font-weight:700;margin-bottom:50px}.success-message{color:#42c640;font-size:20px;font-weight:medium;margin-bottom:20px}.add-song-button{margin-bottom:10px}.add-instrument-button,.add-song-button{background-color:#fc3;border:none;border-radius:15px;color:#000;cursor:pointer;font-size:18px;font-weight:700;height:45px;margin-top:10px;width:260px}.add-song-button{margin-top:15px}.submit-button{background-color:coral}.submit-button:hover{background-color:#e6b800}.url-input-container{align-items:center;display:flex;flex-direction:column;justify-content:center;margin-top:20px;width:100%}.url-input{border:none;border-radius:10px;color:#000;font-size:18px;font-weight:700;height:45px;padding-left:10px;width:260px}.delete-button{background-color:red;box-shadow:3px 3px 0 #0003;color:#fff;margin-top:10px;transition:.2s ease-in-out}.decor-container{position:fixed}.decor-image{animation:float 10s ease-in-out infinite;filter:grayscale(100%) blur(.2px);opacity:.15;-webkit-user-select:none;user-select:none;width:48px}@media (max-width:768px){.decor-image{animation:float 5s ease-in-out infinite;opacity:.12;opacity:.25;width:32px;width:36px}.decor-5{top:65%!important}.decor-6{top:72%!important}.decor-7{top:76%!important}.decor-8{top:80%!important}.decor-9{top:85%!important}.decor-19{top:78%!important}.decor-20{top:82%!important}.decor-21{top:86%!important}.decor-22{top:88%!important}.decor-23{top:91%!important}.decor-24{top:93%!important}.decor-25{top:94%!important}.decor-26{top:95%!important}.decor-31{top:96%!important}.decor-32{top:97%!important}}:root{--bg-start:#faf3f0;--bg-end:#f2e6fb;--text-col:#000;--border-col:#000;--input-bg:#d1d1d1;--code-bg:#fff;--button-bg:coral;--error-col:red;--success-col:#42c640}*{box-sizing:border-box;margin:0;padding:0}.sr-only{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.styleguide-container{background:linear-gradient(90deg,#faf3f0,#f2e6fb);background:linear-gradient(90deg,var(--bg-start),var(--bg-end));height:calc(100vh - 60px);margin-top:60px;overflow-x:hidden;overflow-y:auto;padding:2rem}.styleguide-container,.styleguide-inner{align-items:center;display:flex;flex-direction:column}.styleguide-inner{color:#000;color:var(--text-col);font-family:JetBrains Mono,monospace;max-width:800px;padding:1rem 0;width:100%}.title{font-size:40px;font-weight:700;margin:2rem 0 1rem;text-align:center;word-break:break-word}.subtext{margin:1.5rem 0;text-align:left}.description,.subtext{font-size:18px;word-break:break-word}.description{margin:1rem 0;text-align:center}.section-title{font-size:25px;font-weight:800;letter-spacing:2px;margin-top:3rem}.grey-input{background-color:#d1d1d1;background-color:var(--input-bg);border:none;border-radius:10px;font-size:16px;height:32px;margin:1rem 0;max-width:220px;padding:0 8px;width:100%}.grey-input::placeholder{color:#7a7a7a;font-style:italic}.login-button{background-color:coral;background-color:var(--button-bg);border:none;border-radius:10px;color:#000;color:var(--text-col);cursor:pointer;font-size:16px;font-weight:700;height:42px;margin:1.5rem 0;max-width:240px;width:100%}.code-snippet{background-color:#fff;background-color:var(--code-bg);border-radius:8px;font-size:16px;margin-bottom:1rem;padding:1rem;white-space:pre-wrap;width:100%;word-break:break-word}.color-list{flex-direction:column;gap:.75rem;margin:1rem 0 2rem}.color-item,.color-list{align-items:center;display:flex;width:100%}.color-item{justify-content:flex-start}.color-box{border:1px solid #000;border:1px solid var(--border-col);flex-shrink:0;height:30px;margin-right:10px;width:30px}.color-item p{color:#000;color:var(--text-col);font-size:18px;margin:0;white-space:normal;word-break:break-word}.input-error{font-size:14px;font-weight:700;margin:1rem 0;text-align:center}.input-error.success{color:#42c640;color:var(--success-col)}.input-error.error{color:red;color:var(--error-col)}@media (max-width:768px){.styleguide-container{height:calc(100vh - 56px);margin-top:56px;padding:1.5rem}.title{font-size:32px}.description,.subtext{font-size:16px}.grey-input{font-size:14px;height:30px;max-width:180px}.login-button{height:40px;max-width:200px}.code-snippet,.login-button{font-size:14px}.section-title{font-size:22px}.color-box{height:24px;width:24px}.color-item p{font-size:16px}.input-error{font-size:12px}}@media (max-width:480px){.styleguide-container{height:calc(100vh - 52px);margin-top:52px;padding:1rem}.title{font-size:28px;margin:1.5rem 0 1rem}.subtext{margin:1rem 0}.description,.subtext{font-size:14px}.section-title{font-size:20px;margin-top:2rem}.grey-input{font-size:12px;height:28px;max-width:140px}.login-button{font-size:14px;height:36px;max-width:160px}.code-snippet{font-size:12px;padding:.75rem}.color-box{height:20px;margin-right:8px;width:20px}.color-item p{font-size:14px}.input-error{font-size:12px}}.requests-page{align-items:flex-start;background-color:#f8f2e6;display:flex;font-family:JetBrains Mono,monospace;justify-content:center;min-height:100vh;overflow:hidden;padding:100px 1rem 2rem;position:relative}.decor-container{inset:0;pointer-events:none;position:absolute;z-index:0}.decor-image{animation:float 7s ease-in-out infinite;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1));opacity:.3;position:absolute;transition:transform .3s ease;width:60px}@keyframes float{0%,to{transform:translateY(0) rotate(0deg);transform:translateY(0) rotate(var(--angle,0deg))}50%{transform:translateY(-8px) rotate(0deg);transform:translateY(-8px) rotate(var(--angle,0deg))}}@media (hover:hover){.decor-image:hover{transform:scale(1.1) rotate(5deg)}}.decor-0{--angle:-10deg;left:8%;top:5%}.decor-1{--angle:8deg;left:25%;top:12%}.decor-2{--angle:-6deg;left:45%;top:8%}.decor-3{--angle:4deg;left:68%;top:15%}.decor-4{--angle:-5deg;left:88%;top:7%}.decor-5{--angle:3deg;left:12%;top:25%}.decor-6{--angle:-8deg;left:38%;top:28%}.decor-7{--angle:6deg;left:58%;top:22%}.decor-8{--angle:-4deg;left:78%;top:30%}.decor-9{--angle:5deg;left:92%;top:26%}.decor-10{--angle:-6deg;left:8%;top:42%}.decor-11{--angle:7deg;left:48%;top:40%}.decor-12{--angle:-5deg;left:72%;top:44%}.decor-13{--angle:3deg;left:90%;top:38%}.decor-14{--angle:-4deg;left:5%;top:55%}.decor-15{--angle:6deg;left:22%;top:58%}.decor-16{--angle:-7deg;left:52%;top:54%}.decor-17{--angle:4deg;left:72%;top:60%}.decor-18{--angle:-6deg;left:90%;top:57%}.decor-19{--angle:5deg;left:10%;top:70%}.decor-20{--angle:-3deg;left:30%;top:74%}.decor-21{--angle:4deg;left:50%;top:72%}.decor-22{--angle:-2deg;left:70%;top:76%}.decor-23{--angle:3deg;left:88%;top:80%}.decor-24{--angle:-4deg;left:18%;top:82%}.decor-25{--angle:2deg;left:40%;top:85%}.decor-26{--angle:-3deg;left:62%;top:88%}.decor-27{--angle:7deg;animation-delay:.5s;left:30%;top:40%}.decor-28{--angle:-4deg;left:1%;top:22%}.decor-29{--angle:5deg;left:20%;top:42%}.decor-30{--angle:-3deg;left:38%;top:52%}.decor-31{--angle:2deg;left:82%;top:86%}.decor-32{--angle:-2deg;left:8%;top:88%}@media (max-width:768px){.decor-image{animation:float 5s ease-in-out infinite;opacity:.25;width:36px}.requests-page{padding-top:120px}.decor-container,.requests-page{overflow-x:hidden}.decor-0,.decor-13,.decor-18,.decor-23,.decor-31,.decor-32,.decor-4,.decor-9{left:auto!important;right:2%}.decor-10,.decor-19,.decor-24,.decor-28{left:2%!important}}.requests-box{animation:fadeIn .8s ease-out .2s forwards;background:#fff;border-radius:20px;box-shadow:0 10px 25px #0000001a;max-width:600px;opacity:0;padding:2rem;position:relative;transform:translateY(30px);width:100%;z-index:1}@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}.requests-heading{color:#4b1981;font-size:1.8rem;margin-bottom:2rem;text-align:center}.requests-list{display:flex;flex-direction:column;gap:1.5rem}.request-card{align-items:center;background:#f5edfc;border:1px solid #d7c3ef;border-radius:14px;box-shadow:0 3px 10px #5e2ca514;display:flex;justify-content:space-between;padding:1.25rem 1.5rem;transition:transform .2s ease}.request-card:hover{transform:translateY(-2px)}.request-name{color:#1a1a1a;flex:1 1;font-size:1.2rem;font-weight:600;word-break:break-word}.request-buttons{display:flex;gap:1rem}.btn{border:none;border-radius:10px;cursor:pointer;font-size:1rem;font-weight:700;min-width:48px;padding:.6rem 1.2rem;transition:transform .2s ease}.accept{background-color:#5b2ca0;color:#fff}.accept:hover{transform:scale(1.05)}.reject{background-color:#c62828;color:#fff}.reject:hover{transform:scale(1.05)}.no-requests{color:#555;font-size:1rem;margin-top:1rem;text-align:center}@media (max-width:768px){.decor-5{top:65%!important}.decor-6{top:72%!important}.decor-7{top:76%!important}.decor-8{top:80%!important}.decor-9{top:85%!important}.decor-19{top:78%!important}.decor-20{top:82%!important}.decor-21{top:86%!important}.decor-22{top:88%!important}.decor-23{top:91%!important}.decor-24{top:93%!important}.decor-25{top:94%!important}.decor-26{top:95%!important}.decor-31{top:96%!important}.decor-32{top:97%!important}}body,html{margin:0;overflow:hidden;padding:0}.conversations-container{align-items:center;box-sizing:border-box;color:#000;display:flex;flex-direction:column;height:100%;margin-top:3%;overflow:hidden;padding:20px;width:100%}.error-message{color:orange;font-size:14px;margin-bottom:15px}.bubble-buttons,.create-a-group{background-color:#fff;border:1px solid #ccc;border-radius:2rem;box-sizing:border-box;font-family:Inter,sans-serif;font-size:1rem;line-height:1.5;margin-bottom:10px;margin-right:10px;min-width:100px;padding:2%;transition:border-color .15s ease-in-out,shadow-sm .15s ease-in-out}.create-a-group{align-self:center;max-width:20%}.create-a-group-box{font-size:1rem;justify-self:center;line-height:1.5;margin-bottom:10px;margin-right:10px;padding:2%;width:100%}.bubble-buttons:active,.create-a-group:active{background-color:#000;color:#fff}.file-upload-group{background-color:#f9f9f9;border:1px solid #ccc;border-radius:20px;color:#333;font-size:1rem;margin-bottom:2%;margin-top:3%;padding:1%;width:23.5%}.submit-button{font-Family:JetBrains Mono;background-color:teal;border:none;border-radius:10px;color:#000;cursor:pointer;font-size:18px;font-weight:700;height:45px;margin-top:10px;width:260px}.users-list{background:#f8f9fa;border:1px solid #ddd;border-radius:8px;box-shadow:0 2px 6px #0000001a;margin-bottom:5px;max-height:calc(100vh - 200px);overflow-y:scroll;padding:5px 5px 10%;transition:box-shadow .3s ease;width:60%}.select-chat{background-color:"#000000"}.users-list:hover{box-shadow:0 4px 12px #00000026}.users-list h2{color:#333;font-size:1.5rem;margin-bottom:20px;text-align:center}.users-list-container{display:flex;flex-direction:column;gap:10px;overflow-x:hidden;overflow-y:auto}.user-item{align-items:center;border:1px solid #ddd;border-radius:10px;cursor:pointer;display:flex;gap:10px;overflow:visible;padding:10px;position:relative;transition:background-color .3s,border-color .3s}.search-input{background-color:#fff;border:1px solid #ccc;border-radius:2rem;box-sizing:border-box;font-family:Inter,sans-serif;font-size:1rem;line-height:1.5;margin-bottom:10px;margin-right:10px;padding:2%;transition:border-color .15s ease-in-out,shadow-sm .15s ease-in-out;width:50%}.user-item:hover{background-color:#e9ecef;border-color:#ccc}.user-avatar{border-radius:50%;height:40px;object-fit:cover;width:40px}.user-details{flex:1 1;min-width:0}.user-name{color:#333;font-weight:700;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.email-tooltip{background-color:#333;border-radius:5px;bottom:100%;color:#fff;font-size:12px;left:50%;opacity:0;padding:5px 10px;pointer-events:none;position:absolute;transform:translateX(-50%) translateY(-8px);transition:opacity .2s;z-index:10}.user-item:hover .email-tooltip{opacity:1}.messaging-modal-overlay{align-items:center;background:#00000080;display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:9999}.messaging-modal-content{background:#0000;border-radius:8px;max-height:90vh;max-width:600px;overflow:hidden;position:relative;width:95%}.close-modal-btn{background:#0000;border:none;color:#333;cursor:pointer;font-size:2rem;position:absolute;right:15px;top:10px;transition:color .3s}.close-modal-btn:hover{color:#000}.group-item{align-items:center;border:1px solid #ddd;border-radius:10px;cursor:pointer;display:flex;gap:10px;overflow:visible;padding:10px;position:relative;transition:width .3s ease}.group-item.open{width:250px}.group-item:hover{background-color:#e9ecef;border-color:#ccc}.group-item:hover .email-tooltip{opacity:1}.post-contain-all{animation:fadeInSlideDown .5s ease forwards;padding:1%;transition:height .3s ease;width:100%}.posts-container-big{border:#000;border-radius:10px;border-width:3px;color:#000;font-weight:700;margin:0;overflow:hidden;padding-bottom:2%;text-overflow:ellipsis;white-space:nowrap;width:100%}.posts-container-big:hover{background-color:#e9ecef}@media (max-width:768px){.conversations-container{margin:0 auto;padding:0 15px}.users-list{margin-bottom:15px;max-height:calc(100vh - 140px);padding:15px}.users-list h2{font-size:1.25rem}.group-item,.user-item{padding:8px}.user-avatar{height:35px;width:35px}.user-name{font-size:.95rem}}.page-heading{color:#1e1e1e;font-family:JetBrains Mono,monospace;font-size:1.8rem;font-weight:700;margin-bottom:1.5rem;margin-top:1px;text-align:center}@media (max-width:768px){.page-heading{font-size:1.6rem;margin-top:70px}}
/*# sourceMappingURL=main.4ab7135a.css.map*/