.friend-gallery.friend-gallery{flex-direction:column;gap:22px;min-width:0;display:flex;container:friends-layout/inline-size}.friend-directory{min-width:0}.friend-directory-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin:8px 0 12px;display:flex}.friend-directory-heading h2{letter-spacing:-.4px;margin:0;font-size:19px}.friend-directory-heading>span{color:#d5bbeb;font-size:12px}.friend-about{margin-top:14px;font-size:13px}.friend-about summary{cursor:pointer;color:#dfc4f0;align-content:center;min-height:40px;display:list-item}.friend-about .friend-bio{margin:8px 0;font-size:14px}.friend-gallery .friend-profile-panel{scroll-margin-top:90px}@container friends-layout (width<=700px){.friend-gallery.friend-gallery .friend-directory{order:2}.friend-gallery.friend-gallery .friend-profile-panel{box-shadow:none;border-radius:18px;flex-direction:column;order:1;align-items:stretch;gap:12px;min-width:0;margin:0;padding:12px;display:flex}.friend-gallery.friend-gallery .friend-panel-stream{order:1;width:100%}.friend-gallery.friend-gallery .friend-profile-details{order:2;grid-template-columns:44px minmax(0,1fr);align-items:start;gap:12px;display:grid}.friend-gallery.friend-gallery .friend-panel-avatar{width:44px;box-shadow:none;border-width:2px}.friend-gallery.friend-gallery .friend-panel-copy{display:block}.friend-gallery.friend-gallery .friend-panel-copy h3{letter-spacing:-.4px;overflow-wrap:anywhere;font-size:20px;line-height:1.2}.friend-gallery.friend-gallery .friend-handle{display:none}.friend-gallery.friend-gallery .friend-panel-stats{gap:8px;margin-top:7px;font-size:11px}.friend-gallery.friend-gallery .friend-about{margin-top:4px}.friend-gallery.friend-gallery .friend-channel-link{min-height:44px;margin-top:6px;padding:9px 12px;font-size:12px}.friend-gallery.friend-gallery .friend-extra-link{margin-top:6px;font-size:12px}.friend-gallery.friend-gallery .friend-stream-label{margin:0 0 8px;font-size:11px}.friend-gallery.friend-gallery .stream-frame-wrap{aspect-ratio:16/9;width:100%;height:auto;min-height:0;overflow:hidden}.friend-gallery.friend-gallery .stream-placeholder{height:100%;min-height:0}.friend-gallery.friend-gallery .stream-placeholder-content{gap:7px;padding:12px}.friend-gallery.friend-gallery .stream-placeholder-content>strong{font-size:20px;line-height:1.1}.friend-gallery.friend-gallery .stream-placeholder-content>span{font-size:9px}.friend-gallery.friend-gallery .stream-placeholder-content>small{display:none}.friend-gallery.friend-gallery .stream-load-button{min-height:44px;padding:8px 14px;font-size:12px}.friend-gallery.friend-gallery .friend-profile-rail{scroll-snap-type:none;grid-template-columns:minmax(0,1fr);gap:9px;width:100%;margin:0;padding:0;display:grid;overflow:visible}.friend-gallery.friend-gallery .friend-profile-trigger{text-align:left;background:#30233d;border:1px solid #ab84c343;border-radius:15px;grid-template-rows:auto auto;grid-template-columns:54px minmax(0,1fr) 28px;place-items:center start;gap:4px 13px;width:100%;min-width:0;padding:12px;display:grid}.friend-gallery.friend-gallery .friend-profile-trigger.is-active{border-color:var(--friend-tone);background:color-mix(in srgb,var(--friend-tone) 10%,#30233d)}.friend-gallery.friend-gallery .friend-profile-avatar{width:54px;box-shadow:none;border-width:2px;grid-area:1/1/3}.friend-gallery.friend-gallery .friend-profile-avatar img{animation:none}.friend-gallery.friend-gallery .friend-profile-name{grid-area:1/2;max-width:100%;margin:0;font-size:15px}.friend-gallery.friend-gallery .friend-profile-stats{flex-flow:row-reverse wrap;grid-area:2/2;justify-content:flex-end;align-items:center;gap:7px;min-height:0;display:flex}.friend-gallery.friend-gallery .friend-profile-stats :is(.friend-status,.friend-followers){font-size:10px}.friend-gallery.friend-gallery .friend-profile-cue{grid-area:1/3/3;width:26px;height:26px;margin:0;transform:rotate(-90deg)}.friend-gallery.friend-gallery .friend-profile-trigger.is-active .friend-profile-cue{transform:rotate(180deg)}.friend-gallery.friend-gallery .friend-directory-heading{margin:0 0 12px}.friend-gallery.friend-gallery .friend-directory-heading h2{font-size:18px}}@container friends-layout (width>=701px){.friend-gallery .friend-profile-panel:has(.has-chat){grid-template-columns:minmax(0,1fr);gap:22px}.friend-gallery .friend-profile-panel:has(.has-chat) .friend-profile-details{align-items:center;gap:20px;display:flex}.friend-gallery .friend-profile-panel:has(.has-chat) .friend-panel-avatar{flex:none;width:80px}.friend-gallery .friend-profile-panel:has(.has-chat) .friend-panel-copy{flex:1;min-width:0}.friend-gallery .friend-profile-panel:has(.has-chat) .friend-panel-copy h3{font-size:26px}.friend-gallery .friend-profile-panel:has(.has-chat) .friend-handle{display:none}.friend-gallery .friend-profile-panel:has(.has-chat) .friend-channel-link{margin-top:8px}}.twitch-chat-container{min-width:0;container:twitch-stream/inline-size}.twitch-chat-layout{grid-template-columns:minmax(0,1fr);align-items:start;gap:16px;min-width:0;display:grid}.twitch-chat-video{min-width:0}.twitch-chat-toggle{color:#f4eaff;cursor:pointer;background:#30223f;border:1px solid #9775b6;border-radius:10px;justify-content:center;align-items:center;gap:8px;min-height:44px;margin:14px 0 0 auto;padding:9px 15px;font-size:14px;display:flex}.twitch-chat-panel{color:#f6edff;background:#181020;border:1px solid #775294;border-radius:14px;flex-direction:column;min-width:0;display:flex;overflow:hidden}.twitch-chat-panel>header{justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;display:flex}.twitch-chat-panel>header strong{overflow-wrap:anywhere;align-items:center;gap:8px;min-width:0;font-size:16px;display:flex}.twitch-chat-panel>header>a{color:#d5b0ff;place-items:center;min-width:44px;min-height:44px;display:grid}.twitch-chat-panel>p{color:#c8b7d9;margin:0;padding:0 14px 12px;font-size:14px;line-height:1.5}.twitch-chat-panel>iframe{background:#18181b;border:0;width:100%;height:500px;display:block}.twitch-chat-panel a{color:#d8b7ff;text-underline-offset:3px;text-decoration:underline}.twitch-chat-toggle:focus-visible{outline-offset:3px;outline:3px solid #c496ff}.twitch-chat-panel a:focus-visible{outline-offset:3px;outline:3px solid #c496ff}.twitch-chat-panel button:focus-visible{outline-offset:3px;outline:3px solid #c496ff}@container twitch-stream (width>=760px){.twitch-chat-layout.has-chat{grid-template-columns:minmax(0,1fr) 310px}}@media (max-width:600px){.twitch-chat-panel>iframe{height:460px;max-height:70dvh}}
