*{box-sizing:border-box}body{margin:0;background:#f5f5fa;color:#292936;font:14px Arial,sans-serif}.app{min-height:100vh;display:grid;grid-template-columns:280px 1fr 270px;background:#fff}aside{padding:24px 18px;background:#fcfcfe;border-right:1px solid #e8e8ef}h1{font-size:22px;margin:0 10px 30px}h1:first-letter{color:#6d5be7}h1 span{color:#aaa;font-weight:400}.user{padding:0 10px 20px;font-weight:700}.user small,header small{display:block;color:#55b987;font-size:11px;margin-top:5px}.new,footer button,.members{display:block;width:100%;padding:12px;border:0;border-radius:8px;background:#6d5be7;color:#fff;font-weight:700;text-align:left}label{display:block;color:#999;font-size:10px;margin:28px 10px 12px}input{width:100%;padding:11px;border:1px solid #e5e5ed;border-radius:8px;margin-bottom:10px}.chat{display:block;width:100%;padding:12px 10px;border:0;border-radius:9px;background:none;text-align:left;font-weight:700}.chat.active{background:#eeecff}.chat small{display:block;color:#999;font-size:11px;margin:5px 0 0 25px;font-weight:400}main{display:flex;flex-direction:column;min-width:0}header{padding:25px 30px;border-bottom:1px solid #eee;display:flex;justify-content:space-between;font-size:18px}header span{color:#777}.messages{flex:1;padding:30px;overflow:auto}.messages>i{display:block;text-align:center;color:#aaa;font-size:10px;font-style:normal;margin-bottom:25px}article{display:flex;gap:10px;margin:20px 0;max-width:650px}article>strong{width:38px;height:38px;border-radius:11px;background:#6d5be7;color:#fff;display:grid;place-items:center;font-size:11px}article p{margin:0;background:#f1f0f6;border-radius:4px 14px 14px;padding:11px 14px;line-height:1.5}article p small{color:#aaa;margin-left:12px}footer{padding:18px 30px;border-top:1px solid #eee}textarea{width:100%;height:50px;border:0;resize:none;outline:0;font:14px Arial}footer button{float:right;width:auto}.right{text-align:center;border:0;border-left:1px solid #e8e8ef;padding-top:38px}.right h2{font-size:16px}.big{margin:25px auto 12px;width:60px;height:60px;border-radius:16px;background:#6d5be7;color:#fff;display:grid;place-items:center;font-weight:700}.right h3{margin:0 0 6px}.members{width:auto;margin:18px auto;background:#eeecff;color:#6d5be7}.right hr{border:0;border-top:1px solid #e5e5ed;margin:24px 0}.files{margin-top:18px;color:#6d5be7;font-weight:700}@media(max-width:850px){.app{grid-template-columns:230px 1fr}.right{display:none}}@media(max-width:560px){.app{display:block}.app>aside{display:none}main{min-height:100vh}header,.messages,footer{padding-left:18px;padding-right:18px}}