*{box-sizing:border-box}body{color:#f5f7fb;background:#090b10;margin:0;font:14px system-ui}button,input{font:inherit}button{color:#fff;cursor:pointer;background:#7b5cff;border:0;border-radius:9px;padding:11px 15px}input{color:#fff;background:#0b0f15;border:1px solid #293140;border-radius:9px;outline:0;padding:12px}.auth{background:radial-gradient(circle at 50% 0,#28185d,#090b10 48%);place-items:center;min-height:100vh;display:grid}.brand{font-size:25px;font-weight:900;position:absolute;top:40px}.authcard{background:#11151d;border:1px solid #293140;border-radius:18px;width:min(430px,92%);padding:30px;box-shadow:0 30px 90px #000}.authcard h1{margin-top:0}.authcard p,.muted{color:#8d97a8;line-height:1.5}.authcard input{width:100%;margin:10px 0;display:block}.authcard button{width:100%;margin-top:8px}.app{background:#090b10;grid-template-columns:70px 1fr;height:100vh;display:grid}.app aside{background:#0b0e14;border-right:1px solid #293140;flex-direction:column;align-items:center;gap:10px;padding:14px;display:flex}.logo{background:linear-gradient(135deg,#7b5cff,#4b8dff);border-radius:13px;place-items:center;width:44px;height:44px;margin-bottom:10px;font-size:19px;font-weight:900;display:grid}.app aside button{color:#bfc7d4;background:#171c26;width:44px;height:44px;padding:0}.app aside button.active{color:#fff;background:#7b5cff33}.app main{min-width:0}.app header{border-bottom:1px solid #293140;justify-content:space-between;align-items:center;height:64px;padding:0 24px;display:flex}.app section{height:calc(100vh - 64px);padding:24px;overflow:auto}.hero{background:radial-gradient(circle at 90% 0,#28185d,#141923 50%);border:1px solid #293140;border-radius:16px;padding:30px}.hero h1{margin:0 0 8px;font-size:30px}.hero p{color:#8d97a8;line-height:1.6}.grid{grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px;display:grid}.card{background:#11151d;border:1px solid #293140;border-radius:14px;margin-top:14px;padding:20px}.card strong{font-size:28px}.chat{flex-direction:column;height:100%;display:flex}.messages{flex:1}.message{border-bottom:1px solid #202735;padding:15px}.message p{color:#c7cdd7}.compose{border-top:1px solid #293140;gap:8px;padding-top:14px;display:flex}.compose input{flex:1}.room{align-items:center;gap:15px;display:flex}.room span{color:#8d97a8}.room div{gap:6px;margin-left:auto;display:flex}.search{gap:8px;display:flex}.search input{flex:1}.user{justify-content:space-between;display:flex}@media (width<=700px){.grid{grid-template-columns:1fr}.app{grid-template-columns:58px 1fr}.app section{padding:14px}.room{display:block}.room div{flex-wrap:wrap;margin-top:14px;margin-left:0}}