2016 ROBLOX settings page add-on for RLOT

A new userstyle

/* ==UserStyle==
@name           2016 ROBLOX settings page add-on for RLOT
@namespace      github.com/openstyles/stylus
@version        2.0
@description    A new userstyle
@author         Me
@preprocessor   less
@var checkbox NC "NO BC" 0
@var checkbox ST "Social Tab" 0
@var checkbox RP "ROBLOX+ Tab" 0
==/UserStyle== */

@-moz-document url-prefix("https://www.roblox.com/my/account") {
[data-internal-page-name="Settings"] .settings-left-navigation .menu-vertical {
  display: flex;
  width: 1000px !important;
height: 40px;
box-shadow: 0 1px 3px rgba(0,0,0,0.15)!important;
margin-top: 0px!important;
}
}

#settings-container #account-country-id.form-group.account-country-container {
display: none!important;
}

.form-group.save-settings-container {
  margin-top: -50px;
}

.setting-section:has(.passkey-upsell-banner), .setting-section:has(.passkey-manage-region) {
  margin-top: -60px;
}

#rbx-account-info-header.setting-section > div:not([class]):not(:has(.section-content)) {
height: 210px;
}



.light-theme .setting-section > div:has(.passkey-upsell-banner) {
background-color: transparent!important;
box-shadow: none!important;
}

[data-internal-page-name="Settings"] #security .font-caption-header::before when (@ST = 1) {
  font-size: 18px !important;
  content: "Social";
  left: 10px;
  position: relative;
}

[data-internal-page-name="Settings"] #security .font-caption-header when (@ST = 1) {
  font-size: 0px !important;
}

[data-internal-page-name="Settings"] .content .page-content .rbx-tab-content h2 {
font-size: 24px!important;
  font-weight: 300!important;
}

[data-internal-page-name="Settings"] .menu-vertical .menu-option-content when (@RP = 1) {
  width: 200px!important;
}

[data-internal-page-name="Settings"] #info .font-caption-header when (@RP = 1) {
  margin-left: -25px;
  position: relative !important;
}

[data-internal-page-name="Settings"] #security .font-caption-header when (@RP = 1) {
  margin-left: -25px;
  position: relative !important;
}

[data-internal-page-name="Settings"] #privacy .font-caption-header::before when (@RP = 1) {
  margin-left: -20px;
  position: relative !important;
}

[data-internal-page-name="Settings"] #billing .font-caption-header::before when (@RP = 1) {
  margin-left: -25px;
  position: relative !important;
}

[data-internal-page-name="Settings"] #app-permissions::before when (@RP = 1) {
content: "ROBLOX+";
font-weight: 400;
line-height: 38px;
margin-left: 65px;
font-size: 18px!important;
position: relative !important;
}

#billing-react-app-container {
background-color: #fff!important;
height: 150px;
padding: 20px;
box-shadow: 0 1px 3px rgba(0,0,0,0.15)!important;
position: relative;
top: 43px;
margin-bottom: 45px;
}

.settings-list-item-container {
background-color: #fff!important;
box-shadow: 0 1px 3px rgba(0,0,0,0.15)!important;
padding-left: 10px;
width: 990px;
}

#settings-container .icon-chevron-heavy-right {
transform: rotate(90deg);
margin-right: 10px;
}

#settings-container .rbx-divider {
display: none;
}

.settings-list-item-container .settings-list-item-info .setting-name {
font-weight: 300!important;
}

#billing-react-app-container .add-card-button.btn-secondary-md.btn-primary-md.btn-min-width::before {
content: "Upgrading Membership";
font-size: 18px;
line-height: 15px;
}

#billing-react-app-container .saved-payment-method-header-container:after {
content: "Cancel Renewal"!important;
transition: box-shadow 200ms ease-in-out;
line-height: 34px;
width: 140px !important;
font-weight: 400;
height: 37px;
font-size: 18px;
background-color: #fff;
border: 1px solid #B8B8B8;
position: absolute;
border-radius: 3px;
color: #191919;
text-align: center;
top: 50px;
left: 820px;
cursor: pointer;
}

#billing-react-app-container .saved-payment-method-header-container:before {
content: "Membership status"!important;
font-weight: 400;
font-size: 16px!important;
cursor: text;
}

#billing-react-app-container .saved-payment-method-header-container:hover::after {
box-shadow: 0 1px 3px rgba(150,150,150,0.74)!important;
}

#billing-react-app-container .add-card-button.btn-secondary-md.btn-primary-md.btn-min-width {
font-size: 0px;
}

#billing-react-app-container .add-card-button.btn-secondary-md.btn-primary-md.btn-min-width {
background-color: #02b757!important;
border: 1px solid #02b757!important;
width: 195px;
height: 36px;
}

#billing-react-app-container .add-card-button.btn-secondary-md.btn-primary-md.btn-min-width:hover {
background-color: #3FC679!important;
border: 1px solid #3FC679!important;
}

#settings-container .saved-payment-method-header-container {
color: #b8b8b8;
}

#settings-container .no-payment-methods-text:before {
content: "OutrageousBuilders Club membership";
font-size: 16px!important;
cursor: text;
}

#settings-container .no-payment-methods-text {
font-size: 0px!important;
margin-top: 5px!important;
}

#settings-container .payment-method-image.cardIcon.robloxCredit:before {
content: "Automatically renew on 12/25/2016."!important;
font-size: 16px!important;
font-weight: 400!important;
color: #02b757;
cursor: text;
}

#settings-container .payment-method-image.cardIcon.robloxCredit {
width: 300px;
}

#settings-container .saved-payment-method-header-container h5 {
font-weight: 400!important;
font-size: 0px!important;
}

#settings-container .other-payment-methods-container h5 {
font-weight: 400!important;
font-size: 0px!important;
}

#settings-container .other-payment-methods-container:before {
content: "Renewal date"!important;
font-weight: 400;
font-size: 16px!important;
cursor: text;
}


#settings-container .other-payment-methods-container {
color: #b8b8b8;
font-weight: 400;
font-size: 16px;
position: relative;
margin-top: -10px;
}

#settings-container .roblox-credit-container {
position: relative;
margin-top: -20px;
}

#settings-container .other-payment-methods-container when (@NC = 1) {
display: none;
}

#billing-react-app-container .saved-payment-method-header-container::after when (@NC = 1) {
display: none;
}
#billing-react-app-container .add-card-button.btn-secondary-md.btn-primary-md.btn-min-width::before when (@NC = 1) {
  content: "Join"!important;
}

#billing-react-app-container .add-card-button.btn-secondary-md.btn-primary-md.btn-min-width when (@NC = 1) {
width: 60px!important;
min-width: 1px!important;
}

#settings-container .no-payment-methods-text::before when (@NC = 1) {
  content: "You're not a nember yet. Join ROBLOX Builders club today!" !important;
}

#billing-react-app-container when (@NC = 1) {
  height: 100px!important;
}


#settings-container .roblox-credit-header.text-emphasis:before {
content: "For billing and payment questions:"!important;
font-weight: 300;
font-size: 16px!important;
color: #191919;
cursor: text;
}

#settings-container .roblox-credit-header.text-emphasis {
width: 300px;
display: block!important;
font-size: 0px!important;
position: relative;
top: 10px;
left: -69px!important;
}

#settings-container .roblox-credit-balance:before {
content: "[email protected]"!important;
font-weight: 300;
font-size: 16px!important;
color: #00abff;
position: relative;
top: -4px;
left: -140px!important;
cursor: pointer;
}

#settings-container .balance-prefix  {
font-size: 0px!important;
}

#settings-container .d-flex-inline.gap-1.justify-content-start.align-items-center  {
font-size: 0px!important;
}

#settings-container .payment-methods-settings-container {
position: relative;
top: -70px;
}

#settings-container .payment-method-image {
background: none;
}

#billing-react-app-container .main-header::before {
font-size: 24px!important;
padding: 0px!important;
content: "Billing";
position: relative;
top: -48px;
left: -20px;
cursor: text;
}

.social-networks-container {
background-color: #fff!important;
box-shadow: 0 1px 3px rgba(0,0,0,0.15)!important;
padding: 15px;
}

#billing-react-app-container .main-header {
font-size: 0px!important;
}

[data-internal-page-name="Settings"] #billing .font-caption-header::before {
font-size: 18px!important;
content: "Billing";
left: 30px;
position: relative;
}

[data-internal-page-name="Settings"] #billing .font-caption-header {
font-size: 0px!important;
}

[data-internal-page-name="Settings"] #privacy .font-caption-header::before {
font-size: 18px!important;
content: "Privacy";
left: 20px;
position: relative;
}

[data-internal-page-name="Settings"] #privacy .font-caption-header {
font-size: 0px!important;
}

[data-internal-page-name="Settings"] #security .font-caption-header {
left: 80px!important;
position: relative!important;
}

[data-internal-page-name="Settings"] #info .font-caption-header {
left: 70px!important;
position: relative!important;
}

[data-internal-page-name="Settings"] #settings-container .menu-vertical .menu-option .font-caption-header {
height: 22px;
font-size: 18px;
font-weight: 400;
text-align: left!important;
left: 60px;
position: relative;
}

[data-internal-page-name="Settings"] .menu-vertical .menu-option:hover {
box-shadow: inset 0 -4px 0 0 #00a2ff!important;
}

[data-internal-page-name="Settings"] .menu-option-content:hover {
box-shadow: inset 0 -4px 0 0 #00a2ff!important;
}

[data-internal-page-name="Settings"] .menu-option-content:focus {
box-shadow: inset 0 -4px 0 0 #00a2ff!important;
}

[data-internal-page-name="Settings"] .menu-vertical .menu-option .menu-option-content.active {
box-shadow: inset 0 -4px 0 0 #00a2ff!important;
}

[data-internal-page-name="Settings"] .menu-vertical .menu-option-content {
  display: flex;
  width: 250px;
}

[data-internal-page-name="Settings"] .tab-content > .active {
width: 1000px;
left: -12px;
position: relative;
}

[data-internal-page-name="Settings"] #react-user-account-base h1::before {
  content: "My ";
cursor: text;
}

[data-internal-page-name="Settings"] #subscriptions.menu-option {
  display: none;
}

[data-internal-page-name="Settings"] #notifications.menu-option {
  display: none;
}

[data-internal-page-name="Settings"] #parental-controls.menu-option {
  display: none;
}

[data-internal-page-name="Settings"] #gender-selector.col-xs-12.col-sm-6 {
width: 75%;
  position: relative;
margin-right: 1px;
border-radius: 3px;
gap: 10px;
}

[data-internal-page-name="Settings"] .gender-setting .gender-button {
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
border-color: #b8b8b8;
}

[data-internal-page-name="Settings"] #gender-selector.col-xs-12.col-sm-6:before {
content: "Gender ";
line-height: 36px;
width: 242px !important;
font-weight: 400;
height: 38px;
  background-color: #fff;
  border: 1px solid #b8b8b8;
  padding-left: 20px;
  max-height: 76px;
  position: absolute;
  margin-bottom: 5px;
  left: -241px;
  border-bottom-right-radius: 0px;
  border-top-right-radius: 0px;;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
color: #b8b8b8;
}

[data-internal-page-name="Settings"] #gender-selector.col-xs-12.col-sm-6:after {
content: "";
  border-left: 1px solid #fff !important;
  width: 8px !important;
  height: 38px;
  background-color: #fff;
  border: 1px solid #b8b8b8;
  padding-left: 20px;
  max-height: 76px;
  position: absolute;
  margin-bottom: 5px;
  left: 343px;
}

[data-internal-page-name="Settings"] #locale-list.col-xs-12.col-sm-6 {
  left: -484px;
  position: relative;
}

[data-internal-page-name="Settings"] #account-country-id.form-group.settings-text-field-container {
display: none;
}

[data-internal-page-name="Settings"] #locale-list .icon-down-16x16 {
scale: 1.9;
top: 11px!important;
  right: 16px!important;
}

[data-internal-page-name="Settings"] .content {
max-width: 1020px!important;
}