:root{--bg:#0e111a;--panel:#171d2a;--panel2:#20293a;--line:#2c364d;--text:#f5f3fa;--muted:#8993aa;--purple:#9d8cff;--mint:#80e0bd;--sans:'DM Sans',sans-serif;--display:'Space Grotesk',sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans)}.friends-app{min-height:100vh;max-width:1180px;margin:auto;padding:0 28px}header{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:45px}.brand{color:var(--text);font:700 20px var(--display);text-decoration:none;letter-spacing:-.05em}.brand:first-letter{color:var(--mint)}nav{display:flex;gap:24px;flex:1}nav a{color:var(--muted);text-decoration:none;font-size:13px}nav a.active,nav a:hover{color:var(--text)}header>button{border:0;border-radius:7px;padding:8px 13px;background:#29334a;color:#bac2d2;cursor:pointer}.friends-layout{display:grid;grid-template-columns:320px 1fr;min-height:calc(100vh - 78px)}aside{border-right:1px solid var(--line);padding:30px 24px 30px 0}.aside-title{display:flex;align-items:center;justify-content:space-between}.aside-title h1{font:600 24px var(--display);margin:0}.aside-title button{border:0;border-radius:7px;background:var(--purple);padding:8px 10px;color:#fff;font-weight:700;font-size:11px;cursor:pointer}.tabs{display:flex;gap:18px;margin:30px 0 18px;border-bottom:1px solid var(--line)}.tabs button{border:0;background:none;color:var(--muted);padding:0 0 11px;cursor:pointer;font-size:12px}.tabs button.active{color:var(--text);border-bottom:2px solid var(--purple)}.person{display:flex;align-items:center;gap:10px;padding:10px 8px;border-radius:8px;cursor:pointer}.person:hover,.person.active{background:var(--panel2)}.avatar{width:35px;height:35px;border-radius:11px;display:grid;place-items:center;background:#b9a5ff;color:#28334b;font-size:11px;font-weight:700}.person-copy{flex:1;min-width:0}.person-copy strong,.person-copy span{display:block}.person-copy strong{font-size:12px}.person-copy span{color:var(--muted);font-size:10px;margin-top:3px}.request-actions{display:flex;gap:4px}.request-actions button{border:0;border-radius:5px;background:var(--purple);color:#fff;padding:5px 7px;font-size:10px;cursor:pointer}.request-actions .decline{background:#303a50}.dm-panel{padding:30px 0 25px 35px}.dm-empty{text-align:center;margin-top:25vh;color:var(--muted)}.dm-empty>div{margin:auto auto 15px;width:48px;height:48px;border-radius:15px;background:#2d3150;color:var(--purple);display:grid;place-items:center;font-size:24px}.dm-empty h2{color:var(--text);font:600 24px var(--display);margin:0 0 8px}.dm-empty p{font-size:12px}.dm-view{height:100%;display:flex;flex-direction:column}.dm-head{display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:18px}.dm-head h2{font:600 17px var(--display);margin:0}.dm-head p{color:var(--mint);font-size:11px;margin:4px 0 0}.dm-messages{flex:1;overflow:auto;padding:20px 0}.dm-message{max-width:70%;margin:7px 0;padding:9px 12px;border-radius:11px;background:var(--panel2);font-size:12px;line-height:1.5}.dm-message.mine{margin-left:auto;background:#4c458c}.dm-message time{display:block;color:#93a0b7;font-size:9px;margin-top:4px}#dm-form{display:flex;gap:9px}#dm-form input{flex:1;border:1px solid var(--line);border-radius:8px;padding:12px;background:var(--panel);color:var(--text);outline:0}#dm-form button{border:0;border-radius:8px;background:var(--purple);color:#fff;padding:0 18px;font-weight:700}.toast{position:fixed;bottom:22px;right:22px;background:#28334a;border:1px solid #415070;border-radius:8px;padding:11px 14px;font-size:12px;opacity:0;transition:.2s}.toast.show{opacity:1}@media(max-width:700px){.friends-app{padding:0 15px}header{gap:18px}.friends-layout{grid-template-columns:1fr}.friends-layout aside{border-right:0;padding-right:0}.dm-panel{padding:22px 0}.dm-view{min-height:55vh}}