.friends{min-block-size:100dvh;padding:0 clamp(1rem,4vw,2.5rem) 6rem;overflow-x:clip}.friends>.topbar{padding-inline:0}.friends .topbar a{min-block-size:2.75rem}.friends .back{color:var(--ink-soft)}.friends-frame{inline-size:min(100%,40rem);margin-inline:auto}.friends-frame>.he-heading{font-size:var(--step-3);letter-spacing:-.02em;border-block-end:0;margin-block:2rem .5rem;padding-block-end:0;font-weight:300;line-height:1.15}.friends-section{padding-block-start:2.75rem}.friends-section>.he-heading:focus{outline:none}.friends-section>.he-heading:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.friends-section>.he-heading{font-size:var(--step-2);letter-spacing:-.01em;flex-wrap:wrap;row-gap:.25rem;margin-block-end:1.25rem;font-weight:400;line-height:1.2}.friends-hint{font-size:var(--step--1);color:var(--ink-faint);max-inline-size:62ch;margin:0}.friends-lede{color:var(--ink-soft);max-inline-size:52ch;margin:0 0 1.25rem;font-weight:300}.friends-label{font-size:var(--step-0);margin:0 0 .6rem;font-weight:500;display:block}.friends-sub{font-size:var(--step-0);margin:2rem 0 .5rem;font-weight:500}.friends-failed{margin-block:1.25rem 0}.invite-link{border:1px solid var(--line-strong);border-radius:var(--radius-s);min-block-size:2.75rem;font-size:var(--step-0);overflow-wrap:anywhere;align-items:center;margin:0;padding:.75rem 1rem;display:flex}.invite-link .host{color:var(--ink-faint)}.invite-link .code{letter-spacing:.06em;font-weight:500}.link-actions{flex-wrap:wrap;gap:.75rem;margin-block-start:.75rem;display:flex}.friends .btn{white-space:nowrap;min-block-size:2.75rem}.friends-note{font-size:var(--step--1);color:var(--ink-soft);margin:.5rem 0 0}.friends-note:empty{margin:0}.friends-note[data-tone=alert]{color:var(--alert)}.friends-email{margin-block-start:1.75rem}.friends-inline{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.friends-inline .field-input{flex:16rem;min-block-size:2.75rem;min-inline-size:0}.friends-regen{margin:1rem 0 0}.friends-regen .text-link{min-block-size:2.75rem;color:var(--ink-soft);align-items:center;display:inline-flex}.friend-list{margin:0;padding:0;list-style:none}.friend-list li{border-block-end:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:.5rem .9rem;padding-block:.75rem;display:flex;position:relative}.friend-list li:first-child{border-block-start:1px solid var(--line)}.friend-list .initial{border:1px solid var(--line-strong);background:var(--dome-deep);border-radius:999px;flex:none;place-items:center;block-size:2.5rem;inline-size:2.5rem;font-weight:500;line-height:1;display:inline-grid}.friend-who{flex:4rem;min-inline-size:0;display:grid}.friend-name{overflow-wrap:anywhere;text-align:start;font-weight:500}.friend-meta{font-size:var(--step--1);color:var(--ink-faint)}.friend-actions{flex-wrap:wrap;gap:.5rem;margin-inline-start:auto;display:flex}.friend-actions .btn{padding-inline:1.1rem}.friend-actions .btn-icon{inline-size:2.75rem;padding:0}.friend-email{overflow-wrap:anywhere;min-inline-size:0;color:var(--ink-soft);flex:12rem}.row-menu-wrap{position:relative}.row-menu-wrap .btn-icon[aria-expanded=true]{border-color:var(--ink)}.row-menu{z-index:5;background:var(--dome);border:1px solid var(--line-strong);border-radius:var(--radius-s);min-inline-size:11rem;box-shadow:var(--shadow-soft);padding:.5rem;position:absolute;inset-block-start:calc(100% + .4rem);inset-inline-end:0}.row-menu button{border-radius:var(--radius-s);min-block-size:2.75rem;inline-size:100%;color:var(--ink);text-align:start;cursor:pointer;background:0 0;border:0;align-items:center;padding:0 .75rem;display:flex}.row-menu button:hover,.row-menu button:focus-visible{background:var(--light-band)}.row-menu button:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}.friend-toast{z-index:60;pointer-events:none;justify-content:center;display:flex;position:fixed;inset-block-end:calc(max(1.25rem, env(safe-area-inset-bottom)) + var(--consent-h,0px));inset-inline:1rem}.friend-toast>span{background:var(--capsule);max-inline-size:min(32rem,100%);color:var(--capsule-ink);box-shadow:var(--shadow-soft);font-size:var(--step-0);overflow-wrap:anywhere;text-align:center;border-radius:999px;padding:.75rem 1.25rem}.friends a.friend-name{min-block-size:2.75rem;min-inline-size:2.75rem;color:var(--ink);align-items:center;margin-block:-.5rem;text-decoration:none;display:inline-flex}.friends a.friend-name:hover{text-underline-offset:.2em;text-decoration:underline}.friend-stat{color:var(--ink-soft)}.friends-me{margin:.25rem 0 0}.friends-me .text-link{min-block-size:2.75rem;color:var(--ink-soft);align-items:center;display:inline-flex}
