.friend-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}.friend-row{display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 8px 6px 10px;border:2px solid var(--bb-ink);border-radius:var(--bb-radius);background:var(--bb-navy-3)}.friend-row.off{background:var(--bb-navy-2)}.friend-row .bb-btn{min-height:34px;padding:0 12px;font-size:15px;box-shadow:3px 3px 0 var(--bb-ink)}.friend-dot{flex:none;width:10px;height:10px;border:2px solid var(--bb-ink);border-radius:2px;background:var(--bb-muted);transform:skew(var(--bb-skew))}.friend-dot.on{background:var(--bb-green)}.friend-who{display:grid;flex:1;min-width:0}.friend-who strong{overflow:hidden;color:var(--bb-text);font-family:var(--bb-font-display);font-style:italic;font-weight:800;font-size:18px;letter-spacing:.02em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.friend-who small{color:var(--bb-muted);font-size:12px}.friend-invite.primary:disabled{opacity:1}.friends-link{padding:4px 6px;border:0;background:none;color:var(--bb-muted);font-family:var(--bb-font-display);font-style:italic;font-weight:800;font-size:13px;letter-spacing:.08em;text-decoration:underline;text-transform:uppercase;cursor:pointer}.friends-link:hover,.friends-link:focus-visible{color:var(--bb-text)}.friends-hint{margin:0 0 10px;color:var(--bb-muted);font-size:13px;line-height:1.4}.friends-dock{--bb-accent: var(--bb-green);position:fixed;right:18px;bottom:18px;z-index:6;box-sizing:border-box;width:min(300px,calc(100vw - 32px));max-height:min(420px,55vh);padding:12px 12px 14px;overflow:auto}.friends-dock-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}.friends-dock-head h2{flex:1;margin:0;color:var(--bb-text);font-family:var(--bb-font-display);font-style:italic;font-weight:800;font-size:18px;letter-spacing:.04em;text-transform:uppercase}.friends-dock-icon{display:grid;place-items:center;flex:none;width:30px;height:30px;border:2px solid var(--bb-ink);border-radius:var(--bb-radius);background:var(--bb-green);color:var(--bb-ink);transform:skew(var(--bb-skew))}.friends-dock-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.friends-requests-note{display:block;width:100%;margin:0 0 10px;padding:8px 10px;border:2px solid var(--bb-ink);border-radius:var(--bb-radius);background:var(--bb-coral);color:var(--bb-ink);font-family:var(--bb-font-display);font-style:italic;font-weight:800;font-size:15px;letter-spacing:.04em;text-align:left;text-transform:uppercase;cursor:pointer}@media(max-width:760px){.friends-dock{position:relative;right:auto;bottom:auto;flex:none;width:calc(100% - 32px);max-width:520px;max-height:none;margin:8px auto 24px;overflow:visible}}@media(max-width:480px){#home-friends{display:none}}#home-friends{position:relative}#home-friends.has-online{color:var(--bb-green)}.friends-badge{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 4px;box-sizing:border-box;border:2px solid var(--bb-ink);border-radius:3px;background:var(--bb-coral);color:var(--bb-ink);font:italic 800 11px/14px var(--bb-font-display);text-align:center}dialog.friends-dialog{width:min(480px,calc(100vw - 32px))}.friends-title{margin-bottom:14px;font-size:42px;text-shadow:3px 3px 0 var(--bb-ink)}.friends-dialog section{margin-top:18px}.friends-dialog h3{display:flex;align-items:baseline;gap:8px;margin:0 0 8px;color:var(--bb-coral);font-family:var(--bb-font-display);font-style:italic;font-weight:800;font-size:14px;letter-spacing:.14em;text-transform:uppercase}.friends-dialog h3 b{color:var(--bb-muted)}.friends-add label{display:block;margin-bottom:6px;color:var(--bb-text);font-family:var(--bb-font-display);font-style:italic;font-weight:800;font-size:16px;letter-spacing:.06em;text-transform:uppercase}.friends-add div{display:flex;gap:10px}.friends-add input{flex:1;min-width:0;height:44px;padding:0 12px;box-sizing:border-box;border:var(--bb-stroke) solid var(--bb-ink);border-radius:var(--bb-radius);background:var(--bb-navy);color:var(--bb-text);font:600 16px var(--bb-font-body)}.friends-add input:focus-visible{outline:2px solid var(--bb-green);outline-offset:1px}.friends-add .bb-btn{min-height:44px;font-size:16px}.friends-notice{min-height:18px;margin:6px 0 0;color:var(--bb-gold);font-size:13px}.friends-invite{--bb-accent: var(--bb-gold);position:fixed;top:76px;left:50%;z-index:60;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px 12px;box-sizing:border-box;width:min(380px,calc(100vw - 32px));padding:14px;transform:translate(-50%);animation:friends-in .25s ease-out}.friends-invite p{margin:0;color:var(--bb-text);font-size:15px;line-height:1.3}.friends-invite strong{font-family:var(--bb-font-display);font-style:italic;font-weight:800;text-transform:uppercase}.friends-invite-actions{display:flex;grid-column:1 / -1;gap:10px}.friends-invite-actions .bb-btn{flex:1;min-height:40px;font-size:16px}.friends-flash{position:fixed;top:18px;left:50%;z-index:70;transform:translate(-50%) skew(var(--bb-skew))}@keyframes friends-in{0%{opacity:0;transform:translate(-50%,-10px)}}@media(prefers-reduced-motion:reduce){.friends-invite{animation:none}}.reduced-motion .friends-invite{animation:none}.ms-friends .friend-list{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.ms-friends .friend-row .bb-btn{white-space:nowrap}.ms-friends .friend-closed{color:var(--bb-muted);font-size:12px;text-align:right}.sala-friends .friend-row{min-height:38px;padding:4px 6px 4px 8px}.sala-friends .friend-who strong{font-size:15px}.ms-friends[hidden]{display:none}
