*,
:after,
:before {
  box-sizing: border-box
}

:after,
:before {
  text-decoration: inherit;
  vertical-align: inherit
}

html {
  -webkit-tap-highlight-color: transparent;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -moz-tab-size: 2;
  -o-tab-size: 2;
  tab-size: 2;
  word-break: break-word
}

body {
  margin: 0
}

h1 {
  font-size: 2em;
  margin: .67em 0
}

dl dl,
dl ol,
dl ul,
ol dl,
ol ol,
ol ul,
ul dl,
ul ol,
ul ul {
  margin: 0
}

hr {
  color: inherit;
  height: 0;
  overflow: visible
}

main {
  display: block
}

nav ol,
nav ul {
  list-style: none;
  padding: 0
}

nav li:before {
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(100%);
  clip-path: inset(100%);
  content: "​";
  height: .0625rem;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: .0625rem
}

pre {
  -ms-overflow-style: scrollbar;
  font-family: monospace, monospace;
  font-size: 1em;
  overflow: auto
}

a {
  background-color: transparent
}

abbr[title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted
}

b,
strong {
  font-weight: bolder
}

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em
}

small {
  font-size: 80%
}

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle
}

audio,
video {
  display: inline-block
}

audio:not([controls]) {
  display: none;
  height: 0
}

iframe,
img {
  border-style: none
}

svg:not([fill]) {
  fill: currentColor
}

svg:not(:root) {
  overflow: hidden
}

table {
  border-collapse: collapse;
  border-color: inherit;
  text-indent: 0
}

button,
input,
select {
  margin: 0
}

button {
  overflow: visible;
  text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
  -webkit-appearance: button
}

fieldset {
  border: .0625rem solid #a0a0a0;
  padding: .35em .75em .625em
}

input {
  overflow: visible
}

legend {
  color: inherit;
  display: table;
  max-width: 100%;
  white-space: normal
}

progress {
  display: inline-block;
  vertical-align: baseline
}

select {
  text-transform: none
}

textarea {
  margin: 0;
  overflow: auto;
  resize: vertical;
  resize: block
}

[type=checkbox],
[type=radio] {
  padding: 0
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -.125rem
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto
}

::-webkit-input-placeholder {
  color: inherit;
  opacity: .54
}

::-webkit-search-decoration {
  -webkit-appearance: none
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit
}

::-moz-focus-inner {
  border-style: none;
  padding: 0
}

:-moz-focusring {
  outline: .0625rem dotted ButtonText
}

:-moz-ui-invalid {
  box-shadow: none
}

details,
dialog {
  display: block
}

dialog {
  background-color: #fff;
  border: solid;
  color: #000;
  height: -moz-fit-content;
  height: fit-content;
  left: 0;
  margin: auto;
  padding: 1em;
  position: absolute;
  right: 0;
  width: -moz-fit-content;
  width: fit-content
}

dialog:not([open]) {
  display: none
}

summary {
  display: list-item
}

canvas {
  display: inline-block
}

template {
  display: none
}

[tabindex],
a,
area,
button,
input,
label,
select,
summary,
textarea {
  -ms-touch-action: manipulation
}

[hidden] {
  display: none
}

[aria-busy=true] {
  cursor: progress
}

[aria-controls] {
  cursor: pointer
}

[aria-disabled=true],
[disabled] {
  cursor: not-allowed
}

[aria-hidden=false][hidden] {
  display: initial
}

[aria-hidden=false][hidden]:not(:focus) {
  clip: rect(0, 0, 0, 0);
  position: absolute
}

:root {
  --font-base: 16px;
  --font-factor: 1;
  --post-font-factor: 1;
  --title-font-fallback: Georgia, Times, "Times New Roman", serif;
  --body-font-fallback: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --post-body-font-fallback: Georgia, Times, "Times New Roman", serif;
  --code-font: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  --quote-font: Georgia, Times, "Times New Roman", serif;
  --wrapper-max-width: 73.75rem;
  --wrapper-medium-width: 61.25rem;
  --wrapper-small-width: 45rem;
  --show-glow: block;
  --accent: #635bff;
  --text-on-accent: #fff;
  --background: #fff;
  --foreground: #2f303a;
  --body-text: #404040;
  --light-text: #6b6b6b;
  --border: #f2f2f2;
  --slate: #f1f5f9;
  --shine: #fabf17;
  --success: #16a34a;
  --danger: #b91c1c;
  --gradient-background: hsla(0, 0%, 100%, 0);
  --translucent: hsla(0, 0%, 100%, .5);
  --glow-opacity: 1;
  --logo-invert: 0
}

[theme-mode=dark] {
  --accent: #635bff;
  --text-on-accent: #fff;
  --background: #0c1117;
  --foreground: #fff;
  --body-text: #c7cbd2;
  --light-text: #808392;
  --border: #1f2937;
  --slate: #161c22;
  --shine: #fabf17;
  --success: #16a34a;
  --danger: #b91c1c;
  --gradient-background: rgba(13, 17, 23, 0);
  --translucent: rgba(12, 17, 23, .5);
  --glow-opacity: 0.5;
  --logo-invert: 1
}

.body-text {
  font-size: calc(1rem*var(--post-font-factor));
  line-height: 1.6
}

@media only screen and (min-width:45rem) {
  .body-text {
    font-size: calc(1.125rem*var(--post-font-factor))
  }
}

.gl-button,
.gl-footer__action,
.gl-header button,
.no-appearance,
input.gl-field,
label.gl-checkbox input,
label.gl-radio input,
select.gl-field,
textarea.gl-field {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  -o-appearance: none !important;
  appearance: none !important;
  background-color: transparent;
  border: 0;
  outline: 0;
  padding: 0
}

.sr-only {
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(100%);
  clip-path: inset(100%);
  height: 1px;
  left: -10000px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px
}

.gl-avatar,
.gl-footer__action,
.gl-footer__footnote a,
.gl-footer__nav-section ul li a,
.gl-header button,
.gl-header__nav ul li a,
.gl-social-links li a,
.hoverable,
div.gh-announcement-bar a,
div.gh-announcement-bar button {
  transition: opacity .2s linear
}

.gl-avatar:hover,
.gl-footer__action:hover,
.gl-footer__footnote a:hover,
.gl-footer__nav-section ul li a:hover,
.gl-header button:hover,
.gl-header__nav ul li a:hover,
.gl-social-links li a:hover,
.hoverable:hover,
div.gh-announcement-bar a:hover,
div.gh-announcement-bar button:hover {
  opacity: .8
}

.gl-logo span,
.truncable {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.space-top-page {
  padding-top: 4.5rem
}

@media only screen and (min-width:45rem) {
  .space-top-page {
    padding-top: 6.25rem
  }
}

.space-top-page.in-tag {
  padding-top: 2rem
}

@media only screen and (min-width:45rem) {
  .space-top-page.in-tag {
    padding-top: 2.5rem
  }
}

.space-bottom-page {
  padding-bottom: 6.25rem
}

@media only screen and (min-width:45rem) {
  .space-bottom-page {
    padding-bottom: 9.375rem
  }
}

.focusable:focus-visible,
input.gl-field:focus-visible,
select.gl-field:focus-visible,
textarea.gl-field:focus-visible {
  box-shadow: 0 0 0 4px var(--border);
  outline: 0
}

.flex-start {
  align-self: flex-start
}

.x-hidden {
  overflow-x: hidden
}

html {
  font-size: var(--font-base)
}

[theme-mode=dark] {
  color-scheme: dark
}

#announcement-bar-root,
#sodo-search-root,
[id^=ghost-] {
  color-scheme: auto
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: var(--background);
  color: var(--body-text);
  display: flex;
  flex-direction: column;
  font-family: var(--body-font, var(--body-font-fallback));
  font-size: calc(1rem*var(--font-factor));
  min-height: 100vh;
  overflow-x: hidden;
  width: 100%
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
  font-family: var(--title-font, var(--title-font-fallback));
  font-weight: 700
}

p {
  line-height: 1.5;
  margin: 0
}

a {
  color: inherit;
  text-decoration: none
}

::-moz-selection {
  background-color: var(--accent);
  color: var(--text-on-accent)
}

::selection {
  background-color: var(--accent);
  color: var(--text-on-accent)
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
  position: relative
}

img.lazy {
  opacity: 0
}

img:not(.initial) {
  transition: opacity 1s linear
}

img.error,
img.initial,
img.loaded {
  opacity: 1
}

img:not([src]) {
  visibility: hidden
}

button,
input,
label,
select,
textarea {
  font-family: var(--body-font)
}

select::-ms-expand {
  display: none
}

::-webkit-input-placeholder {
  color: var(--light-text);
  font-family: var(--body-font);
  font-weight: 400
}

::-moz-placeholder {
  color: var(--light-text);
  font-family: var(--body-font);
  font-weight: 400
}

:-ms-input-placeholder {
  color: var(--light-text);
  font-family: var(--body-font);
  font-weight: 400
}

:-moz-placeholder {
  color: var(--light-text);
  font-family: var(--body-font);
  font-weight: 400
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
  -webkit-appearance: none
}

[x-cloak] {
  display: none !important
}

.lightense-target {
  transition: transform var(--lightense-duration) var(--lightense-timing-func) !important
}

.lightense-open {
  border-radius: 0 !important
}

.lightense-backdrop {
  background-color: var(--background-color) !important
}

.gl-main-container {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  overflow-x: hidden
}

@media only screen and (min-width:90rem) {
  .gl-main-container {
    overflow-x: unset
  }
}

.gl-main-container__content {
  flex-grow: 1
}

div.gh-announcement-bar {
  display: flex;
  font-size: calc(.875rem*var(--font-factor));
  gap: 1.25rem;
  justify-content: space-between;
  line-height: 1.5;
  min-height: 0;
  padding: .75rem 1.25rem;
  text-align: unset
}

@media only screen and (min-width:45rem) {
  div.gh-announcement-bar {
    padding-left: 2rem;
    padding-right: 2rem
  }
}

div.gh-announcement-bar.accent {
  background-color: var(--accent)
}

div.gh-announcement-bar a,
div.gh-announcement-bar button {
  cursor: pointer;
  font-weight: 500
}

div.gh-announcement-bar button {
  flex-shrink: 0;
  height: 1.5rem;
  margin-top: 0;
  position: relative;
  right: auto;
  top: auto;
  width: 1.5rem
}

div.gh-announcement-bar button svg {
  height: .75rem;
  width: .75rem
}

div.gh-announcement-bar button svg path {
  stroke: transparent
}

div.gh-announcement-bar b,
div.gh-announcement-bar strong {
  font-weight: 600
}

div.gh-announcement-bar-content {
  flex: 1 !important
}

@media only screen and (min-width:45rem) {
  div.gh-announcement-bar-content {
    text-align: center !important
  }
}

.gl-header {
  background-color: var(--background);
  border-bottom: 1px solid var(--border);
  padding: .75rem 1.25rem;
  position: sticky;
  top: 0;
  transition: transform .2s ease;
  z-index: 10
}

@media only screen and (min-width:45rem) {
  .gl-header {
    padding-bottom: 1rem;
    padding-top: 1rem
  }
}

.gl-header.headroom--pinned {
  pointer-events: all;
  transform: translateY(0)
}

.gl-header.headroom--unpinned {
  pointer-events: none;
  transform: translateY(-100%)
}

.gl-header button {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: center
}

.gl-header__wrapper {
  align-items: center;
  display: flex;
  gap: 2rem;
  justify-content: space-between;
  margin: 0 auto;
  max-width: var(--wrapper-max-width)
}

.gl-header__brand {
  align-items: center;
  display: flex;
  gap: 1rem;
  min-width: 1px
}

@media only screen and (min-width:64rem) {
  .gl-header__brand {
    flex-shrink: 0
  }
}

.gl-header__menu-btn {
  flex-direction: column;
  flex-shrink: 0;
  gap: .25rem;
  height: 2rem;
  width: 2rem
}

@media only screen and (min-width:64rem) {
  .gl-header__menu-btn {
    display: none !important
  }
}

.gl-header__menu-btn.open div:first-child {
  transform: translateY(.375rem) rotate(45deg)
}

.gl-header__menu-btn.open div:nth-child(2) {
  opacity: 0
}

.gl-header__menu-btn.open div:nth-child(3) {
  transform: translateY(-.375rem) rotate(-45deg)
}

.gl-header__menu-btn div {
  background-color: var(--foreground);
  border-radius: 2rem;
  height: .125rem;
  transition: all .2s ease-out;
  width: 1rem
}

.gl-header__actions {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  justify-content: flex-end
}

@media only screen and (min-width:64rem) {
  .gl-header__actions {
    flex: 1;
    min-width: 1px
  }
}

.gl-header__actions__ctas {
  align-items: center;
  display: flex;
  gap: 1rem
}

@media only screen and (min-width:64rem) {
  .gl-header__actions__ctas {
    gap: 1.5rem
  }
}

.gl-header__search-btn {
  color: var(--foreground);
  height: 2rem;
  width: 2rem
}

.gl-header__actions__account-cta:not(.is-member) {
  display: none
}

@media only screen and (min-width:64rem) {
  .gl-header__actions__account-cta:not(.is-member) {
    display: block
  }
}

.gl-header__menu-nav {
  -webkit-overflow-scrolling: touch;
  background-color: var(--background);
  left: 0;
  max-height: 70vh;
  opacity: 0;
  overflow-y: auto;
  position: absolute;
  right: 0;
  top: calc(100% + 1px);
  transform: rotateX(15deg);
  transform-origin: 50% 3.125rem;
  transition: all .25s ease;
  transition-property: transform, opacity, visibility;
  visibility: hidden;
  will-change: transform, opacity, visibility
}

@media only screen and (min-width:64rem) {
  .gl-header__menu-nav {
    align-items: center;
    box-shadow: none;
    display: flex;
    flex: 1;
    justify-content: flex-end;
    left: auto;
    max-height: none;
    min-width: 1px;
    opacity: 1;
    overflow-y: hidden;
    position: relative;
    right: auto;
    top: auto;
    transform: none;
    transition: none;
    visibility: visible
  }
}

.gl-header__menu-nav.open {
  border-bottom: 1px solid var(--border);
  box-shadow: 0 3.34838px 2.21381px 0 rgba(0, 0, 0, .02), 0 8.04662px 5.32008px 0 rgba(0, 0, 0, .03), 0 15.15108px 10.01724px 0 rgba(0, 0, 0, .04), 0 27.02693px 17.86905px 0 rgba(0, 0, 0, .04), 0 50.55091px 33.42209px 0 rgba(0, 0, 0, .05), 0 121px 80px 0 rgba(0, 0, 0, .07);
  opacity: 1;
  transform: rotateX(0);
  visibility: visible
}

@media only screen and (min-width:64rem) {
  .gl-header__menu-nav.open {
    box-shadow: none;
    transform: none
  }
}

.gl-header__nav {
  padding: 2rem 4.5rem
}

@media only screen and (min-width:64rem) {
  .gl-header__nav {
    margin-bottom: -5rem;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 1.5rem, #000 calc(100% - 1.5rem), transparent);
    mask-image: linear-gradient(90deg, transparent, #000 1.5rem, #000 calc(100% - 1.5rem), transparent);
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 1.5rem 5rem
  }
}

.gl-header__nav ul {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  list-style-type: none;
  margin: 0;
  padding: 0
}

@media only screen and (min-width:64rem) {
  .gl-header__nav ul {
    align-items: center;
    flex-direction: row;
    padding: .5rem 0;
    white-space: nowrap
  }
}

.gl-header__nav ul li {
  color: var(--foreground);
  font-size: calc(.875rem*var(--font-factor));
  font-weight: 500
}

.gl-header__nav ul li.nav-current {
  color: var(--accent)
}

@media only screen and (min-width:64rem) {
  .gl-header__nav ul li.gl-header__nav__account-cta {
    display: none
  }
}

.gl-logo {
  display: inline-block;
  min-width: 1px
}

.gl-logo img {
  filter: invert(var(--logo-invert));
  height: 2rem;
  width: auto
}

.gl-logo span {
  color: var(--foreground);
  display: block;
  font-family: var(--title-font);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3
}

@media only screen and (min-width:64rem) {
  .gl-logo span {
    font-size: 1.25rem
  }
}

.gl-avatar {
  background-color: var(--slate);
  border-radius: 50%;
  cursor: pointer;
  display: block;
  height: 2rem;
  overflow: hidden;
  position: relative;
  width: 2rem
}

.gl-avatar img {
  border-radius: 50%;
  -o-object-fit: cover;
  object-fit: cover;
  position: absolute
}

.gl-avatar__default {
  height: calc(100% - 2px);
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: calc(100% - 2px);
  z-index: 1
}

.gl-avatar__gravatar {
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 2
}

.gl-footer {
  flex-shrink: 0
}

.gl-footer__wrapper {
  display: flex;
  flex-direction: column;
  gap: 1.5rem
}

.gl-footer__main {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 2rem 0
}

@media only screen and (min-width:64rem) {
  .gl-footer__main {
    flex-direction: row;
    justify-content: space-between;
    padding: 2rem 0 1.5rem
  }
}

.gl-footer__nav-wrapper {
  --cols: 1;
  --gap: 2rem;
  display: flex;
  flex-direction: column;
  gap: var(--gap)
}

@media only screen and (min-width:64rem) {
  .gl-footer__nav-wrapper {
    flex-basis: 50%;
    flex-direction: row;
    justify-content: flex-end
  }
}

@media only screen and (min-width:64rem) and (min-width:64rem) {
  .gl-footer__nav-wrapper {
    --cols: 3
  }
}

.gl-footer__nav-section {
  flex-basis: calc(100%/var(--cols) - var(--gap)/var(--cols)*(var(--cols) - 1))
}

.gl-footer__nav-section ul {
  --cols: 2;
  --gap: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
  list-style-type: none;
  margin: 0;
  padding: 0
}

@media only screen and (min-width:64rem) {
  .gl-footer__nav-section ul {
    --cols: 1
  }
}

.gl-footer__nav-section ul li {
  flex-basis: calc(100%/var(--cols) - var(--gap)/var(--cols)*(var(--cols) - 1))
}

.gl-footer__action,
.gl-footer__nav-section ul li {
  color: var(--light-text);
  font-size: calc(.8125rem*var(--font-factor));
  font-weight: 400
}

.gl-footer__action {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-family: var(--body-font, var(--body-font-fallback));
  gap: .75rem
}

.gl-footer__theme-selector-wrapper {
  display: inline-block
}

.gl-footer__theme-selector {
  background-color: var(--background);
  border: 1px solid var(--border);
  border-radius: .5rem;
  display: flex;
  flex-direction: column;
  left: 0;
  padding: .5rem 0;
  position: absolute;
  top: 0;
  width: -moz-max-content;
  width: max-content
}

.gl-footer__theme-selector button {
  padding: .625rem 1rem
}

.gl-footer__secondary {
  align-items: center;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 2rem 0
}

@media only screen and (min-width:64rem) {
  .gl-footer__secondary {
    flex-direction: row-reverse;
    gap: 2rem;
    justify-content: space-between
  }
}

.gl-footer__footnote {
  color: var(--light-text);
  font-size: calc(.8125rem*var(--font-factor));
  line-height: 1.5;
  text-align: center
}

@media only screen and (min-width:64rem) {
  .gl-footer__footnote {
    text-align: unset
  }
}

.gl-footer__footnote a {
  color: var(--foreground);
  font-weight: 500
}

.gl-wrapper {
  margin: 0 auto;
  max-width: var(--wrapper-max-width);
  padding: 0 1.25rem;
  position: relative;
  width: 100%
}

@media only screen and (min-width:80rem) {
  .gl-wrapper {
    padding: 0
  }
}

.gl-wrapper.medium {
  max-width: var(--wrapper-medium-width)
}

.gl-wrapper.small {
  max-width: var(--wrapper-small-width)
}

.gl-social-links {
  align-items: center;
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  list-style-type: none;
  margin: 0;
  padding: 0
}

@media only screen and (min-width:64rem) {
  .gl-social-links {
    justify-content: flex-end
  }
}

.gl-social-links li {
  color: var(--foreground)
}

.gl-button {
  background-color: var(--accent);
  border-radius: 2rem;
  color: var(--text-on-accent);
  cursor: pointer;
  display: inline-block;
  font-family: var(--body-font, var(--body-font-fallback));
  font-size: calc(1rem*var(--font-factor));
  font-weight: 500;
  height: auto;
  line-height: 1.3;
  padding: .75rem 1.25rem;
  transition: all .1s ease-in-out
}

.gl-button:hover {
  box-shadow: 0 94px 38px rgba(0, 0, 0, .01), 0 53px 32px rgba(0, 0, 0, .05), 0 24px 24px rgba(0, 0, 0, .09), 0 6px 13px rgba(0, 0, 0, .1), 0 0 0 rgba(0, 0, 0, .1);
  opacity: 1;
  transform: translateY(-2px)
}

.gl-button.secondary {
  background-color: transparent;
  border: 1px solid var(--accent);
  color: var(--accent)
}

.gl-button.small {
  padding: .375rem 1rem
}

.gl-glow {
  display: var(--show-glow);
  opacity: var(--glow-opacity);
  pointer-events: none;
  position: absolute;
  z-index: 1
}

.gl-glow.in-404,
.gl-glow.in-home-header,
.gl-glow.in-newsletter {
  animation: glow-rotate 5s linear infinite;
  box-shadow: 10px -55px 30px 15px var(--glow-1), 24px -10px 47px 10px var(--glow-2), -21px -25px 97px 10px var(--glow-2), 51px 5px 17px 10px var(--glow-2), 3px 2px 77px 10px var(--glow-1);
  left: 50%;
  top: 50%;
  transform: translateZ(0) translate(-50%, -50%)
}

@keyframes glow-rotate {
  0% {
    transform: translate3d(-50%, -50%, 0) rotate(0deg)
  }

  to {
    transform: translate3d(-50%, -50%, 0) rotate(1turn)
  }
}

@media only screen and (min-width:80rem) {

  .gl-glow.in-404.glow-1,
  .gl-glow.in-home-header.glow-1,
  .gl-glow.in-newsletter.glow-1 {
    margin-top: 2rem
  }

  .gl-glow.in-404.glow-2,
  .gl-glow.in-home-header.glow-2,
  .gl-glow.in-newsletter.glow-2 {
    margin-top: -2rem
  }
}

.gl-glow.in-home-header {
  border-radius: 100%;
  filter: blur(50px);
  height: 80%;
  width: 80%
}

@media only screen and (min-width:80rem) {
  .gl-glow.in-home-header {
    border-radius: 50%;
    filter: blur(75px);
    height: 28.125rem;
    width: 28.125rem
  }
}

.gl-glow.in-top-page {
  --glow-opacity: 0.5;
  border-radius: 50%;
  box-shadow: none;
  filter: blur(100px);
  height: 21.25rem;
  transform: translateZ(0) translateY(-50%);
  width: 70%
}

@media only screen and (min-width:45rem) {
  .gl-glow.in-top-page {
    height: 26.25rem;
    transform: translateZ(0) translateY(-80%)
  }
}

.gl-glow.in-top-page.glow-1 {
  animation: top-page-glow-1 5s linear infinite alternate;
  background-color: var(--glow-1);
  left: 0
}

@keyframes top-page-glow-1 {
  0% {
    left: 0
  }

  to {
    left: 30%
  }
}

.gl-glow.in-top-page.glow-2 {
  animation: top-page-glow-2 5s linear infinite alternate;
  background-color: var(--glow-2);
  left: unset;
  right: 50%
}

@keyframes top-page-glow-2 {
  0% {
    right: 0
  }

  to {
    right: 30%
  }
}

.gl-glow.in-home-header.in-top-page.large-background {
  top: 0
}

@media only screen and (min-width:45rem) {
  .gl-glow.in-home-header.in-top-page.large-background {
    transform: translateZ(0) translateY(-50%)
  }
}

@media only screen and (min-width:80rem) {

  .gl-glow.in-home-header.in-top-page.large-background.glow-1,
  .gl-glow.in-home-header.in-top-page.large-background.glow-2 {
    margin-top: 0
  }
}

.gl-glow.in-newsletter {
  border-radius: 100%;
  filter: blur(50px);
  height: 50%;
  width: 50%
}

@media only screen and (min-width:64rem) {
  .gl-glow.in-newsletter {
    filter: blur(75px);
    height: 18.75rem;
    width: 18.75rem
  }
}

.gl-glow.in-404 {
  aspect-ratio: 1;
  border-radius: 50%;
  filter: blur(50px);
  height: auto;
  width: 70%
}

@media only screen and (min-width:45rem) {
  .gl-glow.in-404 {
    filter: blur(75px);
    height: 31.25rem;
    width: 31.25rem
  }
}

.gl-glow.glow-1 {
  z-index: 2
}

.gl-glow.glow-2 {
  z-index: 1
}

label.gl-label {
  color: var(--foreground);
  display: block;
  font-size: calc(1rem*var(--font-factor));
  font-weight: 500;
  margin-bottom: .75rem
}

input.gl-field,
select.gl-field,
textarea.gl-field {
  background-color: var(--background);
  border: 1px solid var(--border);
  border-radius: .5rem;
  color: var(--foreground);
  display: block;
  font-size: 1rem;
  padding: .75rem 1.25rem;
  width: 100%
}

input.gl-field.in-auth,
select.gl-field.in-auth,
textarea.gl-field.in-auth {
  border-radius: 2rem
}

textarea.gl-field {
  min-height: 10rem
}

.gl-select-container {
  position: relative
}

.gl-select-container select.gl-field {
  padding-inline-end: 3.75rem;
  position: relative
}

.gl-select-container span {
  background: var(--foreground);
  height: 1.25rem;
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.25 7.5 10 13.75 3.75 7.5' stroke='%2315171A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='20' height='20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.25 7.5 10 13.75 3.75 7.5' stroke='%2315171A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  pointer-events: none;
  position: absolute;
  right: 1.25rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.25rem;
  z-index: 2
}

label.gl-checkbox,
label.gl-radio {
  color: var(--body-text);
  display: flex;
  font-size: calc(1rem*var(--font-factor));
  gap: 1rem;
  line-height: 1.3
}

label.gl-checkbox>div,
label.gl-radio>div {
  background-color: var(--background);
  border: 1px solid var(--border);
  border-radius: .25rem;
  height: 1.5rem;
  position: relative;
  width: 1.5rem
}

label.gl-checkbox input,
label.gl-radio input {
  height: 100%;
  opacity: 0;
  position: relative;
  width: 100%;
  z-index: 1
}

label.gl-checkbox span,
label.gl-radio span {
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2
}

label.gl-checkbox span {
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 100%;
  height: 18px;
  width: 18px
}

label.gl-checkbox input:checked+span {
  background-color: var(--accent);
  -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m15.188 5.063-7.876 7.875L3.376 9' stroke='%2315171A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m15.188 5.063-7.876 7.875L3.376 9' stroke='%2315171A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
}

label.gl-radio>div {
  border-radius: 50%
}

label.gl-radio span {
  border-radius: 50%;
  height: 10px;
  width: 10px
}

label.gl-radio input:checked+span {
  background-color: var(--accent)
}