.af-portrait{position:relative;display:inline-block;width:64px;height:64px;flex:none;isolation:isolate;vertical-align:middle;overflow:visible;background:none;border-radius:0}
.af-portrait>img.avatar,.af-portrait>img.profile-sidebar-avatar{position:absolute;width:65%;height:65%;left:17.5%;top:17.5%;border-radius:50%;object-fit:cover;margin:0;background:var(--surface-3);z-index:0}
.af-portrait>.af-ring{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:none;border:0;border-radius:0;pointer-events:none;z-index:2;filter:drop-shadow(0 2px 3px #0008)}
.af-particles{position:absolute;inset:0;pointer-events:none;z-index:3}.af-particles>i{position:absolute;left:var(--x);top:var(--y);width:4%;height:4%;border-radius:50%;background:var(--af-light);opacity:0;animation-delay:var(--delay)!important}
.af-phoenix{--af-light:#ffd270}.af-phoenix>.af-ring{animation:af-ember-glow 3s ease-in-out infinite}.af-phoenix .af-particles>i{box-shadow:0 0 5px #ff783c;animation:af-embers 2.8s ease-out infinite}
.af-forest{--af-light:#bdff89}.af-forest .af-particles>i{width:3%;height:3%;box-shadow:0 0 7px 2px #6feeaa88;animation:af-fireflies 4.8s ease-in-out infinite}.af-forest>.af-ring{animation:af-forest-glow 5s ease-in-out infinite}
.af-orbit{--af-light:#f5d18b}.af-orbit .af-particles{animation:af-orbit 18s linear infinite}.af-orbit .af-particles>i{width:5%;height:5%;border-radius:0;clip-path:polygon(50% 0,62% 36%,100% 50%,62% 63%,50% 100%,37% 63%,0 50%,37% 36%);animation:af-twinkle 3s ease-in-out infinite}.af-orbit>.af-ring{filter:drop-shadow(0 0 5px #a187dd65)}
.af-frost{--af-light:#d5f6ff}.af-frost .af-particles>i{width:5%;height:5%;border-radius:0;clip-path:polygon(40% 0,60% 0,60% 40%,100% 40%,100% 60%,60% 60%,60% 100%,40% 100%,40% 60%,0 60%,0 40%,40% 40%);animation:af-snowfall 4.5s ease-in-out infinite}.af-frost>.af-ring{animation:af-ice-glow 4s ease-in-out infinite}
.cosmetic-frame .af-portrait{width:158px;height:158px}.cosmetic-frame{overflow:visible}.seat .af-portrait{margin:-3px 3px -3px -3px}.af-plain:after{content:"";position:absolute;inset:17%;border:1px solid #ffffff1f;border-radius:50%;pointer-events:none}
.lobby-frame-picker{margin-top:20px;border:1px solid #b09bd82b;border-radius:14px;background:linear-gradient(120deg,#7560940d,#4b7d840a)}.lobby-frame-picker>summary{display:flex;align-items:center;gap:12px;cursor:pointer;padding:15px 17px;list-style:none}.lobby-frame-picker>summary::-webkit-details-marker{display:none}.lobby-frame-picker>summary>span{font-size:13px;font-weight:650}.lobby-frame-picker>summary>small{color:#b3a5c8;font-size:10px;margin-left:auto}.lobby-frame-picker>summary>b{color:#b3a5c8;transition:transform .2s}.lobby-frame-picker[open]>summary>b{transform:rotate(180deg)}.lobby-frame-body{padding:0 17px 15px}.lobby-frame-body>p:first-child{font-size:11px;color:var(--muted);line-height:1.7;margin-bottom:13px}.lobby-frame-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px}.lobby-frame-option{display:grid;justify-items:center;gap:7px;padding:10px 5px;border:1px solid var(--line);border-radius:11px;background:#ffffff03;color:var(--text)}.lobby-frame-option .cosmetic-preview{height:90px;min-height:0;margin:0}.lobby-frame-option .af-portrait{width:86px;height:86px}.lobby-frame-option strong{font-size:10px}.lobby-frame-option small{font-size:9px;color:var(--muted)}.lobby-frame-option.selected{border-color:#e7c68666;background:#e7c68609}.lobby-frame-option:disabled{opacity:1;cursor:default}.lobby-frame-option.selected small{color:var(--accent)}.lobby-frame-option:hover:not(:disabled){border-color:#b3a5c888;background:#ffffff06}.lobby-frame-footer{display:flex;justify-content:space-between;gap:12px;margin-top:16px;font-size:11px;color:#d8c499;flex-wrap:wrap}.lobby-frame-footer>button{color:var(--muted);font-size:11px}.shop-frame-phoenix{background:radial-gradient(at 50% 15%,#ba572425,transparent 65%)}.shop-frame-forest{background:radial-gradient(at 50% 15%,#3e9d6c25,transparent 65%)}.shop-frame-orbit{background:radial-gradient(at 50% 15%,#8662b830,transparent 65%)}.shop-frame-frost{background:radial-gradient(at 50% 15%,#7fcee525,transparent 65%)}
.profile-sidebar-portrait>[data-profile-frame]{width:100%;height:100%}.profile-sidebar-portrait>[data-profile-frame]>.af-portrait{width:100%;height:100%}.profile-sidebar-portrait.has-frame:before,.profile-sidebar-portrait.has-frame:after{display:none}.profile-frame-card .profile-skin-preview{min-height:205px}.profile-frame-card .cosmetic-frame .af-portrait{width:170px;height:170px}.profile-frames-note{font-size:11px;line-height:1.8;color:var(--muted);margin:16px 0}
@keyframes af-embers{0%{opacity:0;transform:translate(0,3px) scale(.3)}25%{opacity:1}100%{opacity:0;transform:translate(calc(var(--drift)*8px),-20px) scale(.2)}}
@keyframes af-ember-glow{0%,100%{filter:drop-shadow(0 0 2px #ff803c55)}50%{filter:drop-shadow(0 0 5px #ffad5a9c)}}
@keyframes af-fireflies{0%,100%{opacity:.15;transform:translate(0,0)}40%{opacity:.9;transform:translate(calc(var(--drift)*7px),-7px)}70%{opacity:.4;transform:translate(calc(var(--drift)*-4px),4px)}}
@keyframes af-forest-glow{0%,100%{filter:drop-shadow(0 0 2px #64c69933)}50%{filter:drop-shadow(0 0 5px #a2edaa66)}}
@keyframes af-orbit{to{transform:rotate(360deg)}}@keyframes af-twinkle{0%,100%{opacity:.2;transform:scale(.6)}50%{opacity:1;transform:scale(1.2)}}
@keyframes af-snowfall{0%{opacity:0;transform:translate(0,-9px) rotate(0)}25%{opacity:.9}100%{opacity:0;transform:translate(calc(var(--drift)*8px),18px) rotate(120deg)}}
@keyframes af-ice-glow{0%,100%{filter:drop-shadow(0 0 3px #8adaf855)}50%{filter:drop-shadow(0 0 6px #a8ebff88)}}
@media(prefers-reduced-motion:reduce){.af-portrait>.af-ring,.af-portrait .af-particles,.af-portrait .af-particles>i{animation:none!important}.af-portrait .af-particles>i{opacity:.45}.lobby-frame-picker>summary>b{transition:none}}
@media(max-width:640px){.lobby-frame-picker>summary{padding:13px}.lobby-frame-picker>summary>small{max-width:100px;text-align:right}.lobby-frame-body{padding:0 12px 13px}.lobby-frame-options{grid-template-columns:repeat(3,minmax(0,1fr))}.lobby-frame-option .af-portrait{width:72px;height:72px}.lobby-frame-option .cosmetic-preview{height:76px}.lobby-frame-option strong{font-size:9px}.profile-tabs{overflow-x:auto;scrollbar-width:thin}.profile-tabs button{flex-shrink:0;min-width:45px}.profile-sidebar-person{padding-bottom:18px}.profile-frame-card .cosmetic-frame .af-portrait{width:155px;height:155px}}
.cosmetic-option .cosmetic-frame .af-portrait{width:96px;height:96px}.cosmetic-option .cosmetic-frame{min-height:104px}.af-portrait .af-particles{contain:layout}