/* Страница «Друзья». Тема и переменные берутся из /css/style.css */
.fr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.fr{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:24px 18px 20px}
.fr:hover{border-color:color-mix(in srgb,var(--blue) 50%,var(--bd));transform:translateY(-3px)}
.fr-ring{width:104px;height:104px;border-radius:50%;padding:3px;margin-bottom:8px;background:conic-gradient(var(--blue),var(--green),var(--yellow),var(--red),var(--blue))}
.fr-ring img,.fr-ring .fr-ph{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid var(--card);background:var(--bg)}
.fr-ring .fr-ph{display:grid;place-items:center;font-size:2.2rem;font-weight:700;color:var(--blue)}
.fr h3{margin:0;font-size:1.15rem;overflow-wrap:anywhere}
.fr-u{color:var(--mu);font-size:.9rem}
.fr-bio{color:var(--mu);font-size:.92rem;margin:6px 0 10px;min-height:1.4em;overflow-wrap:anywhere;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.fr .btn{margin-top:auto;width:100%;justify-content:center}
.fr-search{display:block;width:100%;max-width:420px;margin:0 auto 22px}
.fr-empty{text-align:center}
.fr-adm{margin-top:10px;justify-content:center;width:100%}.fr .fr-adm .btn{width:auto;margin-top:0}
.fr-form-photo{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.fr-form-photo img,.fr-form-photo .fr-ph{width:56px;height:56px;border-radius:50%;object-fit:cover;background:var(--bg);border:1px solid var(--bd);display:grid;place-items:center;color:var(--blue);font-weight:700}
.fr-by{margin:8px 0 0;overflow-wrap:anywhere}
.pbar{margin-bottom:18px}.pbar .card.form{animation:none}
.pbar .chk{display:flex;align-items:flex-start;gap:8px;color:var(--mu);font-size:.88rem}.pbar .chk input{margin-top:4px}
.prep{display:grid;gap:10px;margin-bottom:18px}.prep .card{border-color:var(--red);animation:none}
.prep-i{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--bd)}.prep-i:first-of-type{border-top:0}
.prep-i>div:first-child{min-width:0;flex:1 1 220px;overflow-wrap:anywhere}
.rules{margin:0 0 16px;padding:12px 14px;border:1px dashed var(--bd);border-radius:12px;color:var(--mu);font-size:.9rem}
.rules b{color:var(--tx)}