.friends-overlay{position:fixed;inset:0;z-index:35;background:#183f39d9;backdrop-filter:blur(10px);overflow:auto;padding:24px;color:#315b47}.friends-shell{width:min(1000px,100%);margin:0 auto;background:#fffbed;border:1px solid #fff;border-radius:26px;box-shadow:0 20px 65px #123f3833;padding:24px}.friends-shell .friends-heading{position:static;display:flex;justify-content:space-between;align-items:center;gap:15px;pointer-events:auto}.friends-heading small{font-size:8px;letter-spacing:2px;color:#8c9e7b}.friends-heading h1{font-size:25px;letter-spacing:-.7px;margin:7px 0}.friends-heading button{font-size:11px;background:#e9efdc;white-space:nowrap}.friends-status{font-size:11px;min-height:18px;margin:10px 0 14px;line-height:1.5;color:#729368}.friends-status.error{color:#a85f43}.friends-layout{display:grid;grid-template-columns:330px 1fr;gap:20px;min-height:470px}.friends-sidebar{border-right:1px solid #e2e9d5;padding-right:20px;min-width:0}.friend-code-card{background:#edf0de;border:1px solid #e0e7d1;border-radius:15px;padding:14px}.friends-sidebar label{display:block;font-size:10px;font-weight:800;color:#718465;margin-bottom:8px}.friends-sidebar input{min-width:0;width:100%;border:1px solid #dce5ce;border-radius:10px;background:#fffef7;color:#3f644b;padding:11px 9px;font:12px ui-rounded,Arial,sans-serif}.friends-sidebar form{margin:17px 0 12px}.friend-code-card>div,.friends-sidebar form>div{display:flex;gap:6px}.friend-code-card input{font-size:11px;font-weight:700;letter-spacing:.3px}.friend-code-card button,.friends-sidebar form button{font-size:10px;padding:10px;box-shadow:none;background:#dce7ca}.friend-code-card small{display:block;font-size:9px;line-height:1.6;color:#8b9a7a;margin-top:10px}.social-tabs{display:flex;gap:4px;margin-top:14px}.social-tabs button{font-size:10px;flex:1;padding:10px 5px;border-radius:9px;background:#edf0e2;box-shadow:none}.social-tabs button[aria-selected=true]{background:#397b60;color:#fffbe7}#friendsList{max-height:285px;overflow:auto;margin-top:12px}.friends-empty{font-size:12px;line-height:1.8;color:#8c9b7c;text-align:center;padding:22px 12px}.friend-row{display:flex;align-items:center;gap:9px;padding:13px 0;border-bottom:1px solid #e7ebdc}.friend-row.selected{background:#edf0df;border-radius:12px;padding:12px 7px}.friend-avatar{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border:2px solid #fff7e5;border-radius:13px;font-weight:800;color:#fffbed;box-shadow:0 3px #ae9e7422}.friend-info{flex:1;min-width:0}.friend-info b{font-size:12px;display:block;overflow-wrap:anywhere}.friend-info small{display:block;font-size:9px;color:#94a285;margin-top:5px}.friend-actions{display:flex;align-items:center;gap:4px}.friend-actions button{font-size:9px;padding:8px 9px;box-shadow:none;background:#ecf0dd}.friend-actions .friend-chat{background:#d9e8ce;color:#43714f}.friend-more{position:relative}.friend-more summary{cursor:pointer;font-weight:800;color:#8f9e7b;padding:8px 4px}.friend-more[open]{padding:5px;background:#f2efdb;border-radius:10px}.friend-more button{display:block;white-space:nowrap;margin-top:4px;background:#fffbed}#refreshFriends{display:block;font-size:10px;padding:9px 12px;background:transparent;box-shadow:none;margin:10px auto 0;color:#8e9e7d}#friendConversation{display:flex;flex-direction:column;background:#f2f2e4;border:1px solid #e5e9d8;border-radius:18px;min-width:0;height:510px;overflow:hidden}.chat-placeholder{margin:auto;padding:35px;text-align:center;font-size:14px;color:#90a181;max-width:300px;line-height:1.8}.chat-heading{display:flex;align-items:center;gap:10px;padding:16px;border-bottom:1px solid #dfe6d0;background:#edf0df}.chat-heading b{font-size:14px}.chat-heading small{margin-left:auto;color:#91a180;font-size:9px}.chat-messages{flex:1;overflow:auto;padding:18px;display:flex;flex-direction:column;gap:10px;min-height:0;overscroll-behavior:contain}.chat-message{align-self:flex-start;max-width:85%;padding:10px 13px;background:#fffdf1;border-radius:15px 15px 15px 4px;box-shadow:0 2px #3a61350d;overflow-wrap:anywhere}.chat-message.mine{align-self:flex-end;background:#dce8ca;border-radius:15px 15px 4px 15px}.chat-message p{font-size:13px;line-height:1.6;color:#476343;margin:0;white-space:pre-wrap}.chat-message time{display:block;font-size:8px;color:#9aa389;margin-top:6px;text-align:right}.chat-compose{display:flex;align-items:flex-end;gap:8px;padding:12px 12px 4px}.chat-compose textarea{flex:1;min-width:0;max-height:110px;resize:vertical;border:1px solid #d8e3c9;border-radius:12px;background:#fffef5;padding:11px;color:#426245;font:12px Arial,sans-serif;line-height:1.5}.chat-compose .friend-send{background:#37795d;color:#fffbed;padding:13px 15px;font-size:11px;border-radius:12px;box-shadow:0 3px #2c6347}.chat-compose button:disabled{opacity:.5;cursor:wait}.chat-hint{display:block;padding:7px 14px 12px;color:#99a88b;font-size:8px}.friends-overlay button:hover{transform:none}.friends-overlay input:focus-visible,.friends-overlay textarea:focus-visible{outline:2px solid #d6ad62;outline-offset:2px}@media(max-width:750px){.friends-overlay{padding:12px}.friends-shell{padding:18px}.friends-layout{grid-template-columns:270px 1fr;gap:13px}.friends-sidebar{padding-right:13px}.chat-heading small{display:none}.friends-heading h1{font-size:22px}.friends-heading button{font-size:10px;padding:10px}.friend-code-card input{font-size:10px}#friendConversation{height:530px}}@media(max-width:600px){.friends-layout{display:flex;flex-direction:column}.friends-sidebar{border:0;padding:0}.friends-heading h1{font-size:20px}.friends-shell{padding:16px;border-radius:20px}#friendsList{max-height:200px}#friendConversation{height:400px}.friends-status{margin-bottom:10px}.friends-heading small{font-size:7px}.friend-row{padding:10px 0}.friends-overlay{padding:8px}.friend-code-card input{font-size:12px}.friend-code-card{padding:12px}.friends-sidebar form{margin-top:13px}}
.friend-actions{flex-wrap:wrap;justify-content:flex-end;max-width:135px}.friend-actions .friend-play{background:#327d60;color:#fffbea}