.friends-page{--red:#c1272d;--grad:linear-gradient(45deg, #9f3a3e, #c1272d);--line:#ffd9d9;--line-2:#f6e6e6;--soft:#fff5f5;--muted:#6b7280;color:#1f2937;background:#fff}.friends-page .account-container{padding-left:300px;padding-right:2rem}.friends-page h1,.friends-page h3,.friends-page p,.friends-page ul{margin:0}.friends-page ul{padding:0;list-style:none}.friends-page b{color:inherit}.friends-page .fr-wrap{padding:16px 0 60px}.friends-page .fr-hero{border:1px solid var(--line);background:linear-gradient(135deg,#fff5f5 0%,#fff 60%,#fff8e6 100%);border-radius:16px;justify-content:space-between;align-items:center;gap:16px;padding:22px 24px;display:flex}.friends-page .fr-hero h1{font-size:26px;font-weight:900}.friends-page .fr-hero p{color:#4b5563;margin-top:4px}.friends-page .fr-stats{gap:10px;display:flex}.friends-page .fr-stats div{border:1px solid var(--line);text-align:center;background:#fff;border-radius:12px;min-width:90px;padding:10px}.friends-page .fr-stats b{color:var(--red);font-size:22px;font-weight:800;display:block}.friends-page .fr-stats .on b{color:#16a34a}.friends-page .fr-stats span{color:var(--muted);font-size:12px}.friends-page .fr-err{color:#dc2626;margin-top:10px}.friends-page .fr-layout{grid-template-columns:minmax(0,1fr) 360px;align-items:start;gap:18px;margin-top:18px;display:grid}.friends-page .fr-main{flex-direction:column;gap:14px;min-width:0;display:flex}.friends-page .fr-card{border:1px solid var(--line);background:#fff;border-radius:16px;padding:18px}.friends-page .fr-card h3{align-items:center;gap:8px;margin-bottom:12px;font-size:17px;font-weight:800;display:flex}.friends-page .fr-card h3 em{background:var(--red);color:#fff;border-radius:99px;padding:0 8px;font-size:12px;font-style:normal}.friends-page .fr-search{position:sticky;top:16px}.friends-page .fr-muted{color:var(--muted);font-size:13px}.friends-page .fr-input{border:1px solid var(--line);width:100%;font:inherit;border-radius:10px;margin-bottom:6px;padding:10px 12px}.friends-page .fr-input:focus{border-color:var(--red);outline:none}.friends-page .fr-list{flex-direction:column;gap:8px;display:flex}.friends-page .fr-list>li{border:1px solid var(--line-2);border-radius:12px;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;display:flex}.friends-page .fr-list.compact{margin-top:8px}.friends-page .fr-list.compact>li{padding:8px}.friends-page .fr-person{align-items:center;gap:10px;min-width:0;display:flex}.friends-page .fr-person>span:last-child{min-width:0}.friends-page .fr-person b{text-overflow:ellipsis;white-space:nowrap;font-size:15px;display:block;overflow:hidden}.friends-page .fr-person small{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:12px;display:block;overflow:hidden}.friends-page .fr-ava{display:inline-flex;position:relative}.friends-page .fr-ava i{background:#d1d5db;border:2px solid #fff;border-radius:50%;width:13px;height:13px;position:absolute;bottom:0;right:0}.friends-page .fr-ava i.on{background:#22c55e;box-shadow:0 0 0 3px #22c55e33}.friends-page .fr-actions{flex-shrink:0;align-items:center;gap:6px;display:flex}.friends-page .fr-btn{border:1px solid var(--line);font:inherit;color:#374151;cursor:pointer;white-space:nowrap;background:#fff;border-radius:10px;align-items:center;gap:4px;padding:7px 12px;font-size:13px;font-weight:700;display:inline-flex}.friends-page .fr-btn:hover:not(:disabled){border-color:var(--red);color:var(--red)}.friends-page .fr-btn:disabled{opacity:.5;cursor:not-allowed}.friends-page .fr-btn.primary{background:var(--grad);color:#fff;border-color:#9f3a3e}.friends-page .fr-btn.primary:hover:not(:disabled){color:#fff;filter:brightness(1.06)}.friends-page .fr-link{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;font-size:12px;text-decoration:underline}.friends-page .fr-tag{color:var(--muted);background:#f3f4f6;border-radius:99px;padding:4px 10px;font-size:12px;font-weight:700}.friends-page .fr-tag.ok{color:#16a34a;background:#e9f8ec}.friends-page .fr-invite{position:relative}.friends-page .fr-pop{z-index:20;border:1px solid var(--line);background:#fff;border-radius:14px;flex-direction:column;gap:8px;width:220px;padding:12px;display:flex;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 12px 28px #9f3a3e26}.friends-page .fr-pop label{flex-direction:column;gap:4px;font-size:12px;font-weight:700;display:flex}.friends-page .fr-pop select{border:1px solid var(--line);font:inherit;border-radius:8px;padding:7px}.friends-page .fr-pop .fr-btn{justify-content:center}@media (max-width:1150px){.friends-page .fr-layout{grid-template-columns:minmax(0,1fr)}.friends-page .fr-search{position:static}}@media (max-width:760px){.friends-page .fr-list>li,.friends-page .fr-hero{flex-direction:column;align-items:stretch}}
.fp{--fp-ink:#1f2937;--fp-muted:#6b7280;--fp-line:#eef0f3;--fp-accent:var(--ui-accent,#c1272d);--fp-accent-2:color-mix(in srgb, var(--fp-accent) 72%, #000);--fp-ok:#16a34a}.fp .fp-hero{color:#fff;background:radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--fp-accent) 70%, #fff) 0%, transparent 45%),linear-gradient(120deg, var(--fp-accent), var(--fp-accent-2));box-shadow:0 16px 34px -20px color-mix(in srgb, var(--fp-accent) 70%, transparent);border-radius:20px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;margin-top:16px;padding:24px 26px;display:grid;position:relative;overflow:hidden}.fp .fp-hero:before{content:"";pointer-events:none;background-image:radial-gradient(#ffffff24 1.2px,#0000 1.3px);background-size:18px 18px;position:absolute;inset:0}.fp .fp-hero-text{position:relative}.fp .fp-hero-text small{background:#ffffff29;border:1px solid #ffffff47;border-radius:99px;align-items:center;gap:6px;padding:4px 11px;font-size:12px;font-weight:700;display:inline-flex}.fp .fp-hero-text small svg{display:block}.fp .fp-hero-text h1{color:#fff;margin:10px 0 6px;font-size:30px;font-weight:900}.fp .fp-hero-text p{color:#ffffffe6;max-width:520px;margin:0;font-size:14.5px;line-height:1.55}.fp .fp-hero-actions{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.fp .fp-hero-stats{grid-template-columns:repeat(2,minmax(120px,1fr));gap:8px;display:grid;position:relative}.fp .fp-hero-stats>div,.fp .fp-hero-stats>button{color:#fff;font:inherit;text-align:left;background:#ffffff24;border:1px solid #ffffff38;border-radius:14px;flex-direction:column;padding:12px 14px;display:flex}.fp .fp-hero-stats>button{cursor:pointer}.fp .fp-hero-stats>button:hover{background:#ffffff38}.fp .fp-hero-stats b{font-size:24px;font-weight:900;line-height:1.1}.fp .fp-hero-stats span{opacity:.9;font-size:12.5px}.fp .fp-hero-stats .on b{color:#86efac}.fp .fp-hero-stats .alert{color:var(--fp-accent);background:#fff}.fp .fp-hero-stats .alert span{color:var(--fp-muted);opacity:1}.fp .fp-err{color:#b91c1c;background:#fef2f2;border-radius:12px;align-items:center;gap:6px;margin:12px 0 0;padding:10px 14px;font-size:13.5px;font-weight:600;display:flex}.fp .fp-err svg{display:block}.fp .fp-btn{border:1.5px solid var(--fp-line);height:36px;font:inherit;color:var(--fp-ink);cursor:pointer;white-space:nowrap;background:#fff;border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:0 14px;font-size:13.5px;font-weight:800;text-decoration:none;transition:all .15s;display:inline-flex}.fp .fp-btn svg{flex-shrink:0;display:block}.fp .fp-btn:hover:not(:disabled){border-color:color-mix(in srgb, var(--fp-accent) 35%, #fff);color:var(--fp-accent)}.fp .fp-btn:disabled{opacity:.5;cursor:default}.fp .fp-btn.primary{background:var(--fp-accent);border-color:var(--fp-accent);color:#fff}.fp .fp-btn.primary:hover:not(:disabled){background:var(--fp-accent-2);color:#fff}.fp .fp-btn.light{color:var(--fp-accent);background:#fff;border-color:#fff;height:40px}.fp .fp-btn.ghost-light{color:#fff;background:0 0;border-color:#ffffff80;height:40px}.fp .fp-btn.ghost-light:hover{color:#fff;background:#ffffff1f}.fp .fp-btn.sm{height:32px;padding:0 10px;font-size:12.5px}.fp .fp-btn.block{width:100%}.fp .fp-icon{border:1.5px solid var(--fp-line);width:34px;height:34px;color:var(--fp-muted);cursor:pointer;background:#fff;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.fp .fp-icon svg{display:block}.fp .fp-icon:hover{color:var(--fp-accent);border-color:color-mix(in srgb, var(--fp-accent) 35%, #fff)}.fp .fp-link{color:var(--fp-accent);margin-top:8px;font-size:13px;font-weight:800;text-decoration:none;display:inline-block}.fp .fp-link:hover{text-decoration:underline}.fp .fp-muted{color:var(--fp-muted);align-items:center;gap:4px;margin:6px 0;font-size:12.5px;display:flex}.fp .fp-muted svg{display:block}.fp .fp-tag{color:var(--fp-muted);background:#f3f4f6;border-radius:99px;flex-shrink:0;align-items:center;gap:3px;padding:3px 9px;font-size:12px;font-weight:800;display:inline-flex}.fp .fp-tag svg{display:block}.fp .fp-tag.ok{color:#15803d;background:#dcfce7}.fp .fp-card{border:1px solid var(--fp-line);background:#fff;border-radius:18px;padding:16px 18px;box-shadow:0 2px 10px #0f172a0a}.fp .fp-card h3{color:var(--fp-ink);align-items:center;gap:8px;margin:0 0 12px;font-size:16px;font-weight:900;display:flex}.fp .fp-card h3 svg{color:var(--fp-accent);display:block}.fp .fp-card h3 em{color:#15803d;background:#dcfce7;border-radius:99px;padding:0 8px;font-size:12px;font-style:normal}.fp .fp-ava{flex-shrink:0;display:inline-flex;position:relative}.fp .fp-ava>i{background:#cbd5e1;border:2.5px solid #fff;border-radius:50%;width:13px;height:13px;position:absolute;bottom:1px;right:1px}.fp .fp-ava>i.on{background:#22c55e}.fp .fp-online{margin-top:16px}.fp .fp-dot{background:#22c55e;border-radius:50%;width:10px;height:10px;animation:1.8s ease-in-out infinite fp-pulse;box-shadow:0 0 0 4px #22c55e2e}.fp .fp-online-row{scrollbar-width:thin;gap:14px;padding:2px 2px 6px;display:flex;overflow-x:auto}.fp .fp-online-item{text-align:center;flex-direction:column;flex-shrink:0;align-items:center;gap:4px;width:86px;display:flex}.fp .fp-online-item b{max-width:100%;color:var(--fp-ink);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;font-weight:800;overflow:hidden}.fp .fp-online-acts{gap:4px;display:flex}.fp .fp-online-acts .fp-icon,.fp .fp-online-acts .fp-btn{width:32px;height:32px;padding:0}.fp .fp-layout{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:16px;margin:16px 0 50px;display:grid}.fp .fp-main{min-width:0}.fp .fp-side{flex-direction:column;gap:16px;display:flex;position:sticky;top:12px}.fp .fp-tabs{background:#f5f3ef;border-radius:14px;flex-wrap:wrap;gap:4px;margin-bottom:14px;padding:4px;display:flex}.fp .fp-tabs button{height:38px;font:inherit;color:#57534e;cursor:pointer;background:0 0;border:0;border-radius:10px;align-items:center;gap:6px;padding:0 16px;font-size:14px;font-weight:800;display:inline-flex}.fp .fp-tabs button small{text-align:center;background:#0000000f;border-radius:99px;min-width:22px;padding:0 6px;font-size:11.5px}.fp .fp-tabs button.hot small{background:var(--fp-accent);color:#fff}.fp .fp-tabs button:hover:not(.on){color:var(--fp-accent)}.fp .fp-tabs button.on{color:var(--fp-accent);background:#fff;box-shadow:0 1px 4px #0000001a}.fp .fp-tools{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px;display:flex}.fp .fp-tools .fp-search{flex:260px}.fp .fp-search{color:#9ca3af;background:#fff;border:1px solid #e5e7eb;border-radius:12px;align-items:center;gap:8px;height:40px;padding:0 12px;display:flex}.fp .fp-search svg{flex-shrink:0;display:block}.fp .fp-search input{min-width:0;font:inherit;color:var(--fp-ink);background:0 0;border:0;outline:0;flex:1;font-size:14px}.fp .fp-search button{color:var(--fp-muted);cursor:pointer;background:0 0;border:0;padding:2px;display:inline-flex}.fp .fp-search:focus-within{border-color:var(--fp-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--fp-accent) 12%, transparent)}.fp .fp-sort{color:var(--fp-muted);align-items:center;gap:8px;font-size:13px;font-weight:700;display:inline-flex;position:relative}.fp .fp-sort select{appearance:none;height:40px;font:inherit;color:var(--fp-ink);cursor:pointer;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:0 32px 0 12px;font-size:13.5px;font-weight:700}.fp .fp-sort svg{pointer-events:none;display:block;position:absolute;right:10px}.fp .fp-grid{grid-template-columns:repeat(auto-fill,minmax(min(270px,100%),1fr));gap:12px;display:grid}.fp .fp-friend{border:1px solid var(--fp-line);background:#fff;border-radius:16px;flex-direction:column;gap:10px;padding:14px;transition:box-shadow .15s,border-color .15s;display:flex}.fp .fp-friend:hover{border-color:color-mix(in srgb, var(--fp-accent) 25%, #fff);box-shadow:0 12px 24px -16px #0f172a4d}.fp .fp-friend.online{background:linear-gradient(#f6fef9,#fff 60%)}.fp .fp-friend-top{align-items:center;gap:10px;display:flex}.fp .fp-friend-name{flex-direction:column;flex:1;min-width:0;display:flex}.fp .fp-friend-name b{color:var(--fp-ink);white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:900;overflow:hidden}.fp .fp-friend-name small{color:var(--fp-muted);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;overflow:hidden}.fp .fp-badges{flex-wrap:wrap;gap:5px;display:flex}.fp .fp-badges i{border-radius:99px;align-items:center;gap:3px;padding:2px 8px;font-size:11.5px;font-style:normal;font-weight:800;display:inline-flex}.fp .fp-badges i svg{display:block}.fp .fp-badges i.lv{color:#1d4ed8;background:#eff6ff}.fp .fp-badges i.rk{color:#b45309;background:#fef3c7}.fp .fp-badges i.st{color:#e11d48;background:#fff1f2}.fp .fp-week{grid-template-columns:1fr auto;align-items:center;gap:4px 8px;display:grid}.fp .fp-week span{color:var(--fp-muted);font-size:12px;font-weight:700}.fp .fp-week b{color:var(--fp-ink);font-size:14px;font-weight:900}.fp .fp-week .fp-week-bar{grid-column:1/-1}.fp .fp-week-bar{background:#f1f2f4;border-radius:99px;height:6px;display:block;overflow:hidden}.fp .fp-week-bar i{border-radius:inherit;background:linear-gradient(90deg, #f59e0b, var(--fp-accent));height:100%;display:block}.fp .fp-friend-foot{border-top:1px dashed var(--fp-line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding-top:10px;display:flex}.fp .fp-friend-foot small{color:var(--fp-muted);font-size:12px}.fp .fp-friend-foot>span{gap:6px;display:flex}.fp .fp-friend.online .fp-friend-foot small{color:var(--fp-ok);font-weight:800}.fp .fp-invite,.fp .fp-more{position:relative}.fp .fp-pop,.fp .fp-menu{z-index:40;box-shadow:0 0 0 1px var(--fp-line),0 18px 40px -12px #0000004d;background:#fff;border-radius:14px;position:absolute;top:calc(100% + 6px);right:0}.fp .fp-pop{flex-direction:column;gap:8px;width:240px;padding:12px;display:flex}.fp .fp-pop>b{color:var(--fp-ink);font-size:13.5px}.fp .fp-pop label{color:var(--fp-muted);justify-content:space-between;align-items:center;gap:8px;font-size:13px;font-weight:700;display:flex}.fp .fp-pop label select{height:34px;font:inherit;border:1px solid #e5e7eb;border-radius:8px;padding:0 8px;font-size:13px}.fp .fp-online-item .fp-pop{left:50%;right:auto;transform:translate(-50%)}.fp .fp-menu{width:200px;padding:6px}.fp .fp-menu a,.fp .fp-menu button{width:100%;font:inherit;color:var(--fp-ink);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:9px;align-items:center;gap:8px;padding:9px 10px;font-size:13.5px;font-weight:600;text-decoration:none;display:flex}.fp .fp-menu a svg,.fp .fp-menu button svg{color:var(--fp-muted);display:block}.fp .fp-menu a:hover,.fp .fp-menu button:hover{background:#f5f5f4}.fp .fp-menu a.danger,.fp .fp-menu button.danger,.fp .fp-menu a.danger svg,.fp .fp-menu button.danger svg{color:#b91c1c}.fp .fp-empty{text-align:center;flex-direction:column;align-items:center;gap:6px;padding:30px 16px;display:flex}.fp .fp-empty>span{width:64px;height:64px;color:var(--fp-accent);background:#fff1f1;border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.fp .fp-empty>span svg{display:block}.fp .fp-empty b{color:var(--fp-ink);font-size:16px}.fp .fp-empty p{max-width:360px;color:var(--fp-muted);margin:0 0 6px;font-size:13.5px}.fp .fp-rows,.fp .fp-suggest{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.fp .fp-rows li,.fp .fp-suggest li{border-top:1px solid var(--fp-line);align-items:center;gap:10px;padding:10px 2px;display:flex}.fp .fp-rows li:first-child,.fp .fp-suggest li:first-child{border-top:0}.fp .fp-row-text{flex-direction:column;flex:1;min-width:0;display:flex}.fp .fp-row-text b{color:var(--fp-ink);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:800;overflow:hidden}.fp .fp-row-text small{color:var(--fp-muted);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.fp .fp-row-acts{flex-shrink:0;gap:6px;display:flex}.fp .fp-race ol{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.fp .fp-race ol li{border-radius:12px;align-items:center;gap:8px;padding:6px 8px;display:flex}.fp .fp-race ol li.me{background:color-mix(in srgb, var(--fp-accent) 7%, #fff);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--fp-accent) 25%, #fff)}.fp .fp-race ol em{color:var(--fp-ink);font-size:13px;font-style:normal;font-weight:900}.fp .fp-place{color:#64748b;background:#f1f5f9;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;font-weight:900;display:inline-flex}.fp .fp-place.p1{color:#92400e;background:#fde68a}.fp .fp-place.p2{color:#334155;background:#e2e8f0}.fp .fp-place.p3{color:#9a3412;background:#fed7aa}.fp .fp-race-name{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.fp .fp-race-name b{color:var(--fp-ink);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:800;overflow:hidden}.fp .fp-find{scroll-margin-top:14px}.fp .fp-find .fp-search{margin-bottom:8px}.fp .fp-phone{width:100%;height:36px;font:inherit;color:var(--fp-muted);cursor:pointer;background:#fafafa;border:1.5px dashed #e5e7eb;border-radius:10px;justify-content:center;align-items:center;gap:6px;margin-bottom:6px;font-size:13px;font-weight:700;display:inline-flex}.fp .fp-phone svg{display:block}.fp .fp-phone:hover{color:var(--fp-accent);border-color:var(--fp-accent)}@media (max-width:1200px){.fp .fp-layout{grid-template-columns:minmax(0,1fr)}.fp .fp-side{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));align-items:start;display:grid;position:static}}@media (max-width:760px){.fp .fp-hero{grid-template-columns:1fr;padding:20px 18px}.fp .fp-hero-text h1{font-size:25px}.fp .fp-hero-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.fp .fp-tabs button{flex:auto;justify-content:center;padding:0 10px}}@keyframes fp-pulse{50%{box-shadow:0 0 0 7px #22c55e0d}}html[data-theme=dark] .fp{--fp-ink:#ece9ff;--fp-muted:#a8a3d6;--fp-line:#8b5cf638}html[data-theme=dark] .fp .fp-card,html[data-theme=dark] .fp .fp-friend,html[data-theme=dark] .fp .fp-btn:not(.primary):not(.light):not(.ghost-light),html[data-theme=dark] .fp .fp-icon,html[data-theme=dark] .fp .fp-search,html[data-theme=dark] .fp .fp-sort select,html[data-theme=dark] .fp .fp-pop,html[data-theme=dark] .fp .fp-menu{background:#1f1a4d}html[data-theme=dark] .fp .fp-friend.online{background:linear-gradient(#22c55e14,#1f1a4d 60%)}html[data-theme=dark] .fp .fp-tabs{background:#ffffff0f}html[data-theme=dark] .fp .fp-tabs button{color:#c9c4f2}html[data-theme=dark] .fp .fp-tabs button.on{background:#2b2566}html[data-theme=dark] .fp .fp-ava>i{border-color:#1f1a4d}html[data-theme=dark] .fp .fp-week-bar{background:#ffffff14}html[data-theme=dark] .fp .fp-menu a:hover,html[data-theme=dark] .fp .fp-menu button:hover{background:#ffffff0f}