.friends-page{align-content:start;gap:24px;display:grid}.friend-directory,.friend-own-site,.friend-application,.friend-requirements{min-width:0;padding:32px}.friend-directory-header,.friend-own-header,.friend-application-heading{align-items:center;gap:16px;display:flex}.friend-heading-icon,.friend-application-heading>span{width:48px;height:48px;color:var(--accent);background:var(--accent-soft);border-radius:14px;flex:0 0 48px;place-items:center;display:grid}.friend-heading-icon .lucide,.friend-application-heading>span .lucide{width:24px;height:24px}.friend-directory h1{margin:0;font-size:clamp(2rem,4vw,2.8rem);line-height:1.25}.friend-directory-header p{color:var(--text-soft);margin:8px 0 0}.friend-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0 0;padding:0;list-style:none;display:grid}.friend-grid>li{min-width:0}.friend-card{border:1px solid var(--line);background:var(--control-soft);border-radius:15px;grid-template-columns:56px minmax(0,1fr) 16px;align-items:center;gap:12px;min-width:0;height:100%;min-height:100px;padding:16px 14px;transition:border-color .2s,background-color .2s;display:grid}.friend-card:hover{border-color:var(--line-strong);background:var(--accent-soft)}.friend-card>.lucide{width:16px;height:16px;color:var(--accent)}.friend-avatar{border:1px solid var(--line-strong);background:var(--bg-soft);border-radius:13px;width:56px;height:56px;display:grid;overflow:hidden}.friend-avatar>*{grid-area:1/1}.friend-avatar img{object-fit:contain;width:100%;height:100%;display:block;position:relative}.friend-avatar-fallback{color:var(--accent);place-items:center;font-size:1.6rem;font-weight:650;display:grid}:root:not([data-js]) .friend-avatar-fallback{display:none}.friend-card-content{gap:5px;min-width:0;display:grid}.friend-card-content strong{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:1rem;overflow:hidden}.friend-card-content>span{color:var(--text-soft);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.8rem;line-height:1.55;display:-webkit-box;overflow:hidden}.friend-empty{color:var(--text-soft);text-align:center;place-items:center;gap:10px;margin-top:24px;padding:24px;display:grid}.friend-empty>.lucide{color:var(--accent)}.friend-empty p{margin:0}.friend-application-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:24px;display:grid}.friend-own-header,.friend-application-heading{min-height:72px;margin-bottom:24px}.friend-own-header h2,.friend-application-heading h2{margin:0;font-size:1.4rem;line-height:1.45}.friend-own-header p,.friend-application-heading p{color:var(--text-soft);margin:5px 0 0}.friend-own-avatar{border:2px solid var(--accent-decor);object-fit:contain;border-radius:16px;flex:0 0 72px;width:72px;height:72px;display:block}.friend-own-site{flex-direction:column;display:flex}.friend-field-list{flex:1;grid-template-rows:repeat(4,minmax(76px,1fr));gap:12px;margin:0;display:grid}.friend-field{border:1px solid var(--line);background:var(--control-soft);border-radius:12px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;min-width:0;min-height:76px;padding:12px 14px;display:grid}.friend-field>div{min-width:0}.friend-field dt{color:var(--text-soft);font-size:.78rem}.friend-field dd{color:var(--text);text-overflow:ellipsis;white-space:nowrap;margin:3px 0 0;font-size:.88rem;font-weight:600;overflow:hidden}.friend-field a:hover{color:var(--accent)}.friend-copy-button{width:40px;height:40px;color:var(--accent);background:var(--accent-soft);cursor:pointer;border:0;border-radius:10px;flex:none;place-items:center;padding:0;display:none;position:relative}.friend-copy-button .lucide{width:19px;height:19px}.friend-copy-button:after{z-index:2;color:var(--accent-ink);background:var(--accent);box-shadow:var(--shadow-soft);content:attr(data-copy-feedback);opacity:0;pointer-events:none;white-space:nowrap;border-radius:6px;padding:5px 8px;font-size:.75rem;transition:opacity .18s;position:absolute;bottom:calc(100% + 8px);right:0}.friend-copy-button.is-copied:after{opacity:1}:root[data-js] .friend-copy-button{display:grid}.friend-application{flex-direction:column;display:flex}.friend-steps{flex-direction:column;flex:1;justify-content:space-between;gap:0;margin:0;padding:0;list-style:none;display:flex}.friend-steps li{grid-template-columns:36px minmax(0,1fr);align-content:start;align-items:start;gap:14px;display:grid;position:relative}.friend-steps li:not(:last-child){flex:1;padding-bottom:24px}.friend-steps li:not(:last-child):after{background:var(--line);content:"";width:1px;position:absolute;top:36px;bottom:0;left:17px}.friend-steps h3{margin:3px 0 5px;font-size:1rem}.friend-steps p{color:var(--text-soft);margin:0;font-size:.88rem;line-height:1.7}.friend-steps a{color:var(--accent);overflow-wrap:anywhere}.friend-step-number{width:36px;height:36px;color:var(--accent);background:var(--accent-soft);border-radius:50%;place-items:center;font-weight:750;display:grid}.friend-request-template{border:1px solid var(--line);background:var(--control-soft);border-radius:12px;margin-top:12px;position:relative}.friend-request-template pre{color:var(--text-soft);font:inherit;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;padding:14px 62px 14px 14px;font-size:.8rem;line-height:1.75}.friend-request-template .friend-copy-button{position:absolute;top:10px;right:10px}.friend-requirements-heading{align-items:center;gap:11px;margin-bottom:18px;display:flex}.friend-requirements-heading>.lucide{width:22px;height:22px;color:var(--accent)}.friend-requirements-heading h2{margin:0;font-size:1.3rem}.friend-requirements ul{gap:10px;margin:0;padding:0;list-style:none;display:grid}.friend-requirements li{color:var(--text-soft);padding-left:20px;font-size:.9rem;line-height:1.8;position:relative}.friend-requirements li:before{background:var(--accent);content:"";border-radius:50%;width:5px;height:5px;position:absolute;top:.75em;left:2px}.friend-requirements strong{color:var(--text)}@media (max-width:1000px){.friend-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.friend-directory,.friend-own-site,.friend-application,.friend-requirements{padding:24px}}@media (max-width:760px){.friend-application-grid{grid-template-columns:minmax(0,1fr)}}@media (max-width:680px){.friends-page,.friend-application-grid{gap:18px}.friend-directory,.friend-own-site,.friend-application,.friend-requirements{padding:20px}.friend-directory-header{gap:12px}.friend-directory-header p{font-size:.88rem}.friend-grid{grid-template-columns:minmax(0,1fr);gap:12px}.friend-card{grid-template-columns:48px minmax(0,1fr) 16px;gap:10px;padding:14px 12px}.friend-avatar{width:48px;height:48px}.friend-own-avatar{flex-basis:64px;width:64px;height:64px}.friend-own-header,.friend-application-heading{min-height:64px}.friend-copy-button{width:44px;height:44px}.friend-steps li{grid-template-columns:32px minmax(0,1fr);gap:10px}.friend-step-number{width:32px;height:32px}.friend-steps li:not(:last-child):after{top:32px;left:15px}}
