/* Browser auth pages only; decorative vectors never depend on an icon font. */
body.browser-page .sign_forms .col-md-5:has(#SignUpForm) {
  flex:0 1 760px; width:100%; max-width:760px; min-width:0;
}
body.browser-page .sign_forms .gm-auth-field {
  position:relative; display:block; width:100%; height:50px; min-width:0;
}
body.browser-page .sign_forms .gm-auth-field > :is(input,select) {
  box-sizing:border-box; width:100%; min-width:0; height:50px;
  padding-left:48px!important; margin-bottom:0!important;
}
body.browser-page .sign_forms .gm-auth-field__icon {
  position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:20px; height:20px; display:block; color:#aeb7c4;
  pointer-events:none; fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round; z-index:1;
}
body.browser-page .sign_forms .gm-auth-label {
  display:block; margin:0 0 7px; color:#adb5bd; font-size:12px; line-height:18px;
  position:static; inset:auto; padding:0;
}
body.browser-page .sign_forms .gm-auth-field > select {
  appearance:none; -webkit-appearance:none; padding-right:40px;
  background:#242731; color:#fff; border:0; border-radius:5px;
  font:inherit; font-size:14px; cursor:pointer; color-scheme:dark;
}
body.browser-page .sign_forms .gm-auth-field--select::after {
  content:""; position:absolute; right:18px; top:20px; width:7px; height:7px;
  border-right:1.5px solid #aeb7c4; border-bottom:1.5px solid #aeb7c4;
  transform:rotate(45deg); pointer-events:none;
}
body.browser-page .sign_forms .gm-auth-field > input[type="date"] {
  appearance:none; -webkit-appearance:none; color-scheme:dark;
  padding-right:14px; line-height:normal;
}
body.browser-page .sign_forms .gm-auth-field > input[type="date"]::-webkit-date-and-time-value {
  text-align:left;
}
body.browser-page .sign_forms .gm-auth-field > select:focus-visible {
  outline:2px solid #ff777c; outline-offset:2px;
}
/* Only the signup controls opt into these existing picker libraries. */
body.browser-page .sign_forms .gm-auth-sex-control {width:100%!important;}
body.browser-page .sign_forms .gm-auth-sex-control .select2-selection--single {
  display:flex; align-items:center; height:50px!important; padding:0 40px 0 48px!important;
  background:#242731; border:1px solid transparent!important; border-radius:5px!important;
}
body.browser-page .sign_forms .gm-auth-sex-control .select2-selection__rendered {
  padding:0!important; color:#fff; font-size:14px; line-height:20px!important;
}
body.browser-page .sign_forms .gm-auth-sex-control .select2-selection__arrow {
  top:0!important; right:13px!important; height:50px!important;
}
body.browser-page .sign_forms .gm-auth-sex-control .select2-selection__arrow::before {content:none!important;}
body.browser-page .sign_forms .gm-auth-sex-control .select2-selection__arrow b {
  display:block!important; width:7px; height:7px; margin-top:-5px; border:0;
  position:absolute; top:50%!important; left:50%; margin-left:-4px;
  border-right:1.5px solid #aeb7c4; border-bottom:1.5px solid #aeb7c4; transform:rotate(45deg);
}
body.browser-page .sign_forms .gm-auth-field--select:has(.gm-auth-sex-control)::after {display:none;}
body.browser-page .sign_forms .gm-auth-sex-control {position:relative; z-index:0;}
body.browser-page .sign_forms .gm-auth-field .select2-container--open:not(.gm-auth-sex-control) {z-index:10000;}
body.browser-page .sign_forms .gm-auth-field .select2-dropdown {
  margin-top:6px; padding:5px; border:1px solid #454b59; border-radius:8px;
  background:#242731; box-shadow:0 12px 28px rgb(0 0 0 / 30%);
}
body.browser-page .sign_forms .gm-auth-field .select2-results__option {
  padding:11px 14px; border-radius:5px; color:#dce1e8; font-size:14px; line-height:20px;
}
body.browser-page .sign_forms .gm-auth-field .select2-results__option[aria-disabled="true"] {display:none;}
body.browser-page .sign_forms .gm-auth-field .select2-results__option[aria-selected="true"] {background:#343b47; color:#fff;}
body.browser-page .sign_forms .gm-auth-field .select2-results__option--highlighted[aria-selected] {background:#ff4343; color:#fff;}
body.browser-page .sign_forms .gm-auth-picker-open {
  position:absolute; top:5px; right:6px; width:40px; height:40px; padding:10px;
  display:flex; align-items:center; justify-content:center; border:0; border-radius:5px;
  background:transparent; color:#aeb7c4; cursor:pointer;
}
body.browser-page .sign_forms .gm-auth-picker-open svg {display:none;}
body.browser-page .sign_forms .gm-auth-picker-open::after {
  content:""; position:absolute; right:12px; top:15px; width:7px; height:7px;
  border-right:1.5px solid #aeb7c4; border-bottom:1.5px solid #aeb7c4; transform:rotate(45deg);
}
body.browser-page .sign_forms .gm-auth-field--date-open .gm-auth-picker-open::after {top:18px; transform:rotate(225deg);}
body.browser-page .sign_forms .gm-auth-field > input.hasDatepicker {padding-right:50px!important;}
body.browser-page #ui-datepicker-div.gm-auth-datepicker {
  box-sizing:border-box; width:292px; max-width:calc(100vw - 24px); padding:12px;
  background:#242731; color:#e1e5ec; border:1px solid #454b59; border-radius:10px;
  box-shadow:0 14px 36px rgb(0 0 0 / 35%); z-index:100000!important;
  transition:none; animation:none;
}
body.browser-page #ui-datepicker-div.gm-auth-datepicker:not(.gm-auth-datepicker-ready) {visibility:hidden;}
body.browser-page .gm-auth-datepicker .ui-datepicker-header {position:relative; padding:0 0 10px; background:transparent; border:0;}
body.browser-page .gm-auth-datepicker .ui-datepicker-title {margin:0 26px; line-height:32px; display:flex; gap:6px;}
body.browser-page .gm-auth-datepicker .ui-datepicker-title select {
  box-sizing:border-box; width:50%; height:32px; padding:0 5px; margin:0;
  background:#343b47; color:#fff; border:1px solid #4c5563; border-radius:5px;
  font-size:12px; color-scheme:dark;
}
body.browser-page .gm-auth-datepicker :is(.ui-datepicker-prev,.ui-datepicker-next) {position:absolute; top:2px; width:24px; height:28px; border:0; background:transparent; cursor:pointer;}
body.browser-page .gm-auth-datepicker :is(.ui-datepicker-prev,.ui-datepicker-next) > span {display:none;}
body.browser-page .gm-auth-datepicker :is(.ui-datepicker-prev,.ui-datepicker-next)::before {
  content:""; position:absolute; top:9px; left:9px; width:7px; height:7px;
  border-right:1.5px solid #bac4d0; border-bottom:1.5px solid #bac4d0; transform:rotate(-45deg);
}
body.browser-page .gm-auth-datepicker .ui-datepicker-prev::before {transform:rotate(135deg);}
body.browser-page .gm-auth-datepicker .ui-datepicker-prev {left:0;}
body.browser-page .gm-auth-datepicker .ui-datepicker-next {right:0;}
body.browser-page .gm-auth-datepicker th {padding:7px 0; color:#aeb7c4; font-size:11px;}
body.browser-page .gm-auth-datepicker td {padding:2px; background:transparent; border:0;}
body.browser-page .gm-auth-datepicker td :is(a,span) {
  display:flex; align-items:center; justify-content:center; min-height:30px; padding:0;
  background:transparent; color:#e1e5ec; border:0; border-radius:5px; font-size:13px;
}
body.browser-page .gm-auth-datepicker td a:hover {background:#343b47;}
body.browser-page .gm-auth-datepicker td a.ui-state-active {background:#ff4343; color:#fff;}
body.browser-page .gm-auth-datepicker .ui-state-disabled {opacity:.3;}
/* Joined calendar selectors are bounded DOM lists, never OS popups. */
body.browser-page .gm-auth-datepicker .ui-datepicker-title {min-height:32px;}
body.browser-page .gm-auth-datepicker .ui-datepicker-title > select {visibility:hidden;}
body.browser-page .sign_forms .gm-auth-field--date-open > input {border-bottom-left-radius:0!important; border-bottom-right-radius:0!important;}
body.browser-page .sign_forms .gm-auth-field--date-open::after,
body.browser-page .sign_forms .gm-auth-sex-picker[open]::before {
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  border:1px solid #454b59; border-bottom:0; border-radius:5px 5px 0 0;
}
body.browser-page #ui-datepicker-div.gm-auth-datepicker {border-top:0; border-radius:0 0 10px 10px;}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-select {position:relative; flex:1; min-width:0;}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-select > select {display:none;}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-toggle {
  position:relative; box-sizing:border-box!important; width:100%; height:32px; padding:0 23px 0 8px; margin:0;
  text-align:left; background:#343b47; color:#fff; border:1px solid #4c5563; border-radius:5px; cursor:pointer;
  line-height:18px; transition:background-color .15s, color .15s; transform:none;
}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-toggle span {display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px;}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-toggle::after {
  content:""; position:absolute; top:10px; right:9px; width:6px; height:6px;
  border-right:1.5px solid #bac4d0; border-bottom:1.5px solid #bac4d0; transform:rotate(45deg);
}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-select.is-open .gm-auth-calendar-toggle {border-bottom-left-radius:0; border-bottom-right-radius:0;}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-select.is-open .gm-auth-calendar-toggle::after {top:13px; transform:rotate(225deg);}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-options {
  box-sizing:border-box!important; position:absolute; left:0; top:100%; width:100%; max-height:180px;
  overflow-y:auto; overscroll-behavior:contain; padding:4px; margin:0; z-index:2;
  transition:none; animation:none;
  background:#343b47; border:1px solid #4c5563; border-top:0; border-radius:0 0 5px 5px;
}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-options[hidden] {display:none;}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-option {
  box-sizing:border-box; display:flex; align-items:center; width:100%; height:30px; min-height:30px;
  padding:4px 7px; margin:0; border:0; border-radius:3px;
  background:transparent; color:#e1e5ec; text-align:left; font-size:12px; line-height:18px; cursor:pointer;
  white-space:nowrap; transition:background-color .15s, color .15s; transform:none;
}
body.browser-page .gm-auth-datepicker .gm-auth-calendar-option:is(:hover,:focus-visible),
body.browser-page .gm-auth-datepicker .gm-auth-calendar-option[aria-selected="true"] {background:#ff4343; color:#fff; outline:0;}
/* Stable initial HTML controls: scripts never replace or resize these fields. */
body.browser-page .sign_forms .gm-auth-sex-picker {position:relative; width:100%; height:50px;}
body.browser-page .sign_forms .gm-auth-sex-toggle {
  box-sizing:border-box; display:flex; align-items:center; width:100%; height:50px;
  padding:0 40px 0 48px; list-style:none; background:#242731; color:#787d88; border-radius:5px; cursor:pointer;
  font-size:14px; line-height:20px; white-space:nowrap;
}
body.browser-page .sign_forms .gm-auth-sex-toggle::-webkit-details-marker {display:none;}
body.browser-page .sign_forms .gm-auth-sex-toggle:hover {box-shadow:0 0 3px 0 #ffffff42;}
body.browser-page .sign_forms .gm-auth-sex-toggle::after {
  content:""; position:absolute; right:18px; top:20px; width:7px; height:7px;
  border-right:1.5px solid #aeb7c4; border-bottom:1.5px solid #aeb7c4; transform:rotate(45deg);
}
body.browser-page .sign_forms .gm-auth-field--select:has(.gm-auth-sex-picker)::after {display:none;}
body.browser-page .sign_forms .gm-auth-sex-toggle :is(.gm-auth-sex-female,.gm-auth-sex-male) {display:none;}
body.browser-page .sign_forms .gm-auth-sex-picker:has([value="1"]:checked) .gm-auth-sex-female,
body.browser-page .sign_forms .gm-auth-sex-picker:has([value="2"]:checked) .gm-auth-sex-male {display:block; color:#fff;}
body.browser-page .sign_forms .gm-auth-sex-picker:has(:checked) .gm-auth-sex-placeholder {display:none;}
body.browser-page .sign_forms .gm-auth-sex-picker[open] > summary {border-bottom-left-radius:0; border-bottom-right-radius:0;}
body.browser-page .sign_forms .gm-auth-sex-picker[open] > summary::after {top:23px; transform:rotate(225deg);}
body.browser-page .sign_forms .gm-auth-sex-options {
  position:absolute; box-sizing:border-box; left:0; top:100%; width:100%; z-index:10; padding:5px;
  background:#242731; border:1px solid #454b59; border-top:0; border-radius:0 0 8px 8px;
  box-shadow:0 12px 28px rgb(0 0 0 / 30%);
}
body.browser-page .sign_forms label.gm-auth-sex-option {
  position:relative; inset:auto; display:block; padding:11px 14px; margin:0;
  border-radius:5px; color:#dce1e8; font-size:14px; line-height:20px; cursor:pointer;
}
body.browser-page .sign_forms .gm-auth-sex-option:has(:checked),body.browser-page .sign_forms .gm-auth-sex-option:hover {background:#ff4343; color:#fff;}
body.browser-page .sign_forms .gm-auth-sex-option > input {
  position:absolute; width:1px; height:1px; padding:0; margin:0; opacity:0;
}
body.browser-page .sign_forms .gm-auth-sex-option:focus-within {outline:1px solid #ff8585;}
body.browser-page .sign_forms .gm-auth-birthday {padding-right:50px!important;}
body.browser-page .sign_forms .gm-auth-validation-message {padding:12px; color:#fff; background:#a62d35; border-radius:5px;}
/* Mark only the missing controls after a registration attempt, without reflow. */
body.browser-page .sign_forms .gm-auth-required-form .gm-auth-field.gm-auth-invalid > input,
body.browser-page #SignUpForm .gm-auth-field.gm-auth-invalid > input,
body.browser-page #SignUpForm .gm-auth-field.gm-auth-invalid .gm-auth-sex-toggle {
  box-shadow:inset 0 0 0 1px #ff4343!important;
}
body.browser-page #SignUpForm .gm-auth-field.gm-auth-invalid .gm-auth-sex-picker[open]::before,
body.browser-page #SignUpForm .gm-auth-field.gm-auth-invalid .gm-auth-sex-options,
body.browser-page #SignUpForm .gm-auth-field.gm-auth-invalid.gm-auth-field--date-open::after {border-color:#ff4343;}
body.browser-page #SignUpForm input[name="terms"].gm-auth-invalid {outline:1px solid #ff4343; outline-offset:2px;}
/* Tablet browser layouts only: the legacy Bootstrap third-column is too narrow. */
@media (min-width:768px) and (max-width:1366px) {
  body.browser-mobile .sign_forms .col-md-4:has(#SignInForm),
  body.browser-mobile .sign_forms .col-md-4:has(.gm-auth-reset-form) {
    flex:0 1 520px; width:100%; max-width:520px; min-width:0;
  }
  body.browser-mobile #SignInForm .check-group {
    align-items:center; gap:24px;
  }
  body.browser-mobile #SignInForm .check-group .check { flex:0 0 auto; }
  body.browser-mobile #SignInForm .check-group .check label {
    display:inline-flex; align-items:center; white-space:nowrap; line-height:20px; margin:0;
  }
  body.browser-mobile #SignInForm .check-group > a {
    padding-top:0; white-space:nowrap; line-height:20px;
  }
  body.browser-mobile :is(#SignInForm,.gm-auth-reset-form) .actions-btn {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; align-items:stretch;
  }
  body.browser-mobile :is(#SignInForm,.gm-auth-reset-form) .actions-btn > :is(a,button) {
    box-sizing:border-box; display:flex; align-items:center; justify-content:center;
    float:none; width:100%; min-width:0; min-height:50px; margin:0; padding:14px 12px;
    line-height:1.5; white-space:nowrap;
  }
}