/* Phone samples need the same readable image area as desktop samples. */
@media(max-width:700px){
 html body .profile-settings-dialog .tg-select-effect-preview{flex-basis:58px;width:58px;height:58px}
 html body .profile-settings-dialog .tg-select-effect-preview .user-avatar{width:46px!important;height:46px!important;font-size:22px!important}
 html body .profile-settings-dialog .tg-select-nick-preview{flex-basis:60px;width:60px;min-height:46px;font-size:24px}
 html body .profile-settings-dialog [data-select-field] :is(.custom-select-trigger,[role=option]){min-height:80px;gap:14px;padding:12px;font-size:13px;line-height:1.4}
 html body .profile-settings-dialog [data-select-field] .custom-select-menu{max-height:min(360px,44dvh);padding:10px;background:#1a192b}
 html body .profile-settings-dialog [data-select-field] .custom-select-trigger>i{flex:0 0 auto}
}
/* Use the full settings column for both selectors and their menus. */
html body .profile-settings-dialog .appearance-grid{grid-template-columns:minmax(0,1fr)}
html body .profile-settings-dialog .appearance-grid>.effect-preview{grid-column:1/-1;grid-row:1;min-height:132px}
html body .profile-settings-dialog .appearance-grid>[data-select-field=avatar_effect]{grid-column:1/-1;grid-row:2;width:100%;min-width:0}
html body .profile-settings-dialog .appearance-grid>[data-select-field=nickname_style]{grid-column:1/-1;grid-row:3;width:100%;min-width:0}
html body .profile-settings-dialog .appearance-grid>.nickname-preview{grid-column:1/-1;grid-row:4}
html body .profile-settings-dialog [data-select-field] .custom-select,html body .profile-settings-dialog [data-select-field] .custom-select-trigger{width:100%;min-width:0}
html body .profile-settings-dialog [data-select-field] .custom-select-menu{left:0;right:0;width:100%;min-width:0;box-sizing:border-box;background:#1a192b}

html body .profile-settings-dialog .tg-effect-premium{color:#f1d59c;font-weight:750;text-shadow:0 0 6px #e6b96750;white-space:nowrap}