.squad-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 24px}.squad-tools>button{min-height:46px;padding:12px 18px;font:14px var(--font)}.squad-tools>p{margin-left:auto;font-size:14px;color:var(--muted)}.friends-trigger{font:14px var(--font);padding:12px 16px;background:#252a2c;color:var(--amber);border:1px solid #b68c43}.friends-trigger [data-friend-count]:not(:empty){background:var(--amber);color:#151a1c;padding:3px 6px;margin-left:6px}.social-dialog,.room-dialog{background:#171d20;color:#eeeee4;border:2px solid #e3ad45;border-radius:0;width:min(690px,calc(100vw - 32px));max-height:88vh;padding:30px;box-shadow:8px 8px 0 #090d0f}.social-dialog::backdrop,.room-dialog::backdrop{background:#060a0ddb;backdrop-filter:blur(4px)}.social-heading{display:flex;gap:18px;align-items:center;margin:0 30px 26px 0}.social-heading img{width:45px;height:54px;object-fit:contain}.social-heading h2,.room-dialog h2{font:30px var(--font);margin:5px 0 0;letter-spacing:0}.social-dialog .eyebrow,.room-dialog .eyebrow{font-size:12px;color:var(--amber)}.social-self{background:#20292d;border:1px solid #3b484c;padding:20px;margin-bottom:22px}.social-dialog label,.room-dialog label{display:block;font:14px var(--font);color:#d2d9d7;margin-bottom:9px}.social-dialog input,.room-dialog input,.room-dialog select{width:100%;min-width:0;background:#101619;color:#faf5e6;border:1px solid #667479;padding:12px;font:16px var(--body);border-radius:0}.social-dialog input:focus,.room-dialog input:focus,.room-dialog select:focus{outline:2px solid var(--amber);outline-offset:2px}.social-inline{display:flex;gap:10px}.social-inline input{flex:1}.social-inline button{flex-shrink:0;font:14px var(--font);padding:10px 14px}.friend-code-line{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #3b484c;margin-top:20px;padding-top:17px}.friend-code-line small{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}.friend-code-line strong{font:22px var(--font);color:#ffc94b;letter-spacing:1px}.friend-code-line button,.friend-row button{font:12px var(--font);padding:10px 12px;min-height:39px}.social-self>p,.social-status,.friends-empty p,.room-dialog p{font-size:14px;line-height:1.7;color:#b8c5c8}.social-self>p{margin:15px 0 0}.social-status{margin:18px 0 0;min-height:24px;color:#efd5a0}.friend-section h3{font:16px var(--font);margin:26px 0 12px}.friend-section h3 span{color:var(--amber)}.friend-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #334044}.friend-row>div{flex:1;min-width:0}.friend-row strong{display:block;font:16px var(--font);overflow-wrap:anywhere}.friend-row small{display:block;font:13px var(--body);line-height:1.5;color:#aebcbe;margin-top:5px}.friend-avatar{width:39px;height:39px;border:2px solid #526165;background:#252f33;display:grid;place-items:center;color:#b2bcbc;font:18px var(--font);flex-shrink:0}.friend-avatar.online{border-color:#b4d278;color:#d5e995}.friend-row .button{font:13px var(--font);padding:11px 15px;min-height:40px}.friend-remove{color:#a8b4b8}.friends-empty,.custom-empty{padding:28px 20px;text-align:center;background:#1c2529;border:1px dashed #465358}.friends-empty strong,.custom-empty strong{font:18px var(--font);color:#d5dedc}.friends-empty p,.custom-empty p{margin:12px auto 0;max-width:420px;line-height:1.7;font-size:14px;color:#b1bec1}.custom-empty{grid-column:1/-1}.custom-empty .button{margin-top:20px;font-size:14px}.custom-room-section{margin:32px 0}.custom-room-heading{display:flex;justify-content:space-between;gap:18px;align-items:baseline;margin-bottom:18px}.custom-room-heading h2{font:23px var(--font)}.custom-room-heading p{color:#b1bec1;font-size:14px}.custom-rooms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.custom-room{background:#20282b;border:1px solid #465154;display:flex;min-width:0;flex-direction:column}.custom-room>img{width:100%;height:130px;object-fit:cover;border-bottom:3px solid #bc963a}.custom-room-body{padding:20px}.custom-room .eyebrow{font-size:12px;color:#b9c7c9}.custom-room h3{font:24px var(--font);overflow-wrap:anywhere;margin:12px 0}.custom-room p{font-size:14px;color:#b9c7c9}.custom-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.custom-actions>*{font:12px var(--font);min-height:40px;padding:11px 12px}.custom-actions>a{margin-right:auto}.custom-actions [data-room-close]{color:#dcb2a6}.room-dialog form>label{margin-top:24px}.room-dialog form>.button{width:100%;margin-top:24px;font:16px var(--font);padding:16px}.room-dialog p{margin:17px 0}.room-dialog #roomFormStatus,.room-dialog #joinRoomStatus{color:#efd5a0}.created-room-title{display:block;font:25px var(--font);color:var(--amber);margin:28px 0}.created-room-actions{display:flex;gap:12px;margin-top:20px}.created-room-actions>*{flex:1;font:14px var(--font);padding:14px;text-align:center}.server-help{border-left:3px solid var(--amber);padding:16px 20px;background:#20282b;margin:25px 0}.server-help summary{cursor:pointer;font:16px var(--font);color:#eddba6}.server-help p{font:14px/1.8 var(--body);margin:12px 0 0;color:#c2cccc}.social-dialog [hidden],.room-dialog [hidden]{display:none!important}
@media(max-width:900px){.header>.friends-trigger{font-size:12px;padding:10px}.custom-rooms{grid-template-columns:1fr}.squad-tools>p{width:100%;margin-left:0}.custom-room-heading{display:block}.custom-room-heading p{margin-top:10px}}
@media(max-width:550px){.social-dialog,.room-dialog{padding:22px 17px}.social-heading h2,.room-dialog h2{font-size:26px}.social-self{padding:15px}.social-inline{flex-wrap:wrap}.social-inline input{flex-basis:65%}.friend-code-line{align-items:flex-start}.friend-code-line strong{font-size:17px}.friend-row{flex-wrap:wrap}.friend-row>div{flex-basis:60%}.friend-row .friend-remove{margin-left:auto}.squad-tools>button{flex:1;font-size:12px;padding:12px}.social-heading{gap:12px}.social-heading img{width:33px}.custom-room-heading h2{font-size:20px}.created-room-actions{flex-direction:column}.header>.friends-trigger{display:none}}

.portrait-renderer{position:fixed;left:-10000px;top:0;width:192px;height:192px;border:0;pointer-events:none}.social-identity{display:flex;gap:18px;align-items:center;padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid #3b484c}.social-identity>div{min-width:0;flex:1}.social-identity strong{display:block;font:21px var(--font);margin-top:7px;overflow-wrap:anywhere}.social-identity p{font:14px/1.6 var(--body);color:#b8c5c8;margin:9px 0 12px}.social-identity button{font:12px var(--font);padding:10px 12px}.friend-avatar{position:relative;overflow:hidden;width:80px;height:80px;border:2px solid #53666e;background:repeating-linear-gradient(0deg,#172329 0 3px,#1b2a30 3px 4px);box-shadow:3px 3px #090f12}.friend-avatar img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.friend-avatar.portrait-ready img{object-fit:cover}.friend-avatar.online{border-color:#a9d366;box-shadow:3px 3px #233519}.friend-self-avatar{width:112px;height:112px;border-color:#d3a344}.friend-row{padding:16px 0;gap:16px}.friend-row strong{line-height:1.5}.friend-row small{font-size:14px}.friend-section>h3>span{color:var(--amber)}@media(max-width:550px){.social-identity{gap:13px;align-items:flex-start}.friend-self-avatar{width:80px;height:80px}.social-identity strong{font-size:18px}.friend-avatar{width:72px;height:72px}.friend-row>div{flex-basis:calc(100% - 100px)}.friend-row .button{margin-left:88px}.social-identity button{font-size:12px;line-height:1.5}}

.lobby-friends{border:0;background:none;cursor:pointer;width:100%;text-align:left;font-family:var(--font);color:var(--amber)}