@font-face {
  font-family: "Gilroy";
  font-weight: 200;
  font-style: normal;
  src: url(/public/fonts/Gilroy-Thin.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 200;
  font-style: italic;
  src: url(/public/fonts/Gilroy-ThinItalic.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 300;
  font-style: normal;
  src: url(/public/fonts/Gilroy-Light.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 300;
  font-style: italic;
  src: url(/public/fonts/Gilroy-LightItalic.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 400;
  font-style: normal;
  src: url(/public/fonts/Gilroy-Regular.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 400;
  font-style: italic;
  src: url(/public/fonts/Gilroy-RegularItalic.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 500;
  font-style: normal;
  src: url(/public/fonts/Gilroy-Medium.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 500;
  font-style: italic;
  src: url(/public/fonts/Gilroy-MediumItalic.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 600;
  font-style: normal;
  src: url(/public/fonts/Gilroy-SemiBold.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 600;
  font-style: italic;
  src: url(/public/fonts/Gilroy-SemiBoldItalic.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 700;
  font-style: normal;
  src: url(/public/fonts/Gilroy-Bold.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 700;
  font-style: italic;
  src: url(/public/fonts/Gilroy-BoldItalic.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 800;
  font-style: normal;
  src: url(/public/fonts/Gilroy-ExtraBold.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 800;
  font-style: italic;
  src: url(/public/fonts/Gilroy-ExtraBoldItalic.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 900;
  font-style: normal;
  src: url(/public/fonts/Gilroy-Heavy.ttf) format("truetype");
}
@font-face {
  font-family: "Gilroy";
  font-weight: 900;
  font-style: italic;
  src: url(/public/fonts/Gilroy-HeavyItalic.ttf) format("truetype");
}
@font-face {
  font-family: "Atkinson Hyperlegible Next";
  font-style: italic;
  src: url(/public/fonts/AtkinsonHyperlegibleNext-Italic-VariableFont_wght.ttf) format("truetype");
}
@font-face {
  font-family: "Atkinson Hyperlegible Next";
  font-style: normal;
  src: url(/public/fonts/AtkinsonHyperlegibleNext-VariableFont_wght.ttf) format("truetype");
}
@font-face {
  font-family: "Cal Sans";
  font-style: normal;
  font-weight: 600;
  src: url(/public/fonts/CalSans-SemiBold.ttf) format("truetype");
}
@font-face {
  font-family: "Knots";
  src: url(/public/fonts/Knots_238.otf) format("opentype");
}
@layer reset, base, components, utilities, overrides;
*,
*::before,
*::after {
  box-sizing: border-box;
  font-synthesis: none !important;
  -webkit-font-smoothing: antialiased;
}
html {
  -webkit-text-size-adjust: none;
  color-scheme: light dark;
  tab-size: 2;
  scrollbar-gutter: stable;
  interpolate-size: allow-keywords;
  line-height: 1.5;
}
html:has(dialog[open]) {
  overflow: hidden;
  overflow: clip;
}
@media (prefers-reduced-motion: no-preference) {
  html:focus-within {
    scroll-behavior: smooth;
  }
}
html,
body {
  margin: 0;
  padding: 0;
}
body {
  line-height: inherit;
}
:where(input, button, textarea, select) {
  font: inherit;
  color: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
}
:where(textarea) {
  resize: block;
  field-sizing: content;
}
:where(input[type=search])::-webkit-search-cancel-button,
:where(input[type=search])::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
}
:where(a) {
  color: inherit;
  text-underline-offset: 0.2ex;
}
:where(img, picture, svg, video) {
  max-inline-size: 100%;
  block-size: auto;
}
hr {
  border: none;
  border-block-start: 1px solid;
  color: inherit;
  block-size: 0;
  overflow: visible;
}
hr[aria-orientation=vertical] {
  border-block-start: none;
  border-inline-start: 1px solid;
  block-size: auto;
  inline-size: 0;
}
:focus-visible {
  outline: 2px solid CanvasText;
  box-shadow: 0 0 0 5px Canvas;
  outline-offset: 1px;
}
:focus-visible,
:target {
  scroll-margin-block: 8vh;
}
[hidden] {
  display: none !important;
}
:root {
  --font-text:
    Gilroy,
    Futura,
    system-ui,
    sans-serif;
  --font-display: var(--font-text);
  --font-mono: monospace, monospace;
  --color-bg: #E1F2FF;
  --color-bg2: #E1F2FF;
  --color-text: #183D6D;
  --color-fg: #0A202E;
  --color-fg2: #162E53;
  --color-fg3: #051E38;
  --color-fg4: #0C1D2D;
  --color-accent: #FF904F;
  --color-accent2: #FBBA4D;
  --color-accent3: #FE9D4E;
  --color-accent-bg: lch(20 10 186);
  --color-accent-fg: #FF7A53;
  --color-accent-text: #FF8D52;
  --color-complement: lch(84 32 230);
  --color-complement-bg: lch(20 10 230);
  --color-complement-fg: lch(80 50 230);
  --color-alternate: lch(71 70 80);
  --color-alternate-bg: #F7EFDE;
  --color-shadow: rgba(101, 101, 101, 0.15);
  --color-link: var(--color-box-fg);
  --color-faded-text: #3D72B788;
  --color-faded-fg: #9EB8DB;
  --color-scrim-fg: rgb(0 0 0 / 25%);
  --color-box-bg: #FFFFFF;
  --color-box-text: var(--color-text);
  --color-box-fg: #183D6D;
  --color-interact-bg: lch(85 9 249);
  --color-interact-fg: var(--color-fg);
  --color-interact-text: var(--color-text);
  --color-field-bg: #E1F2FF;
  --color-field-text: var(--color-text);
  --color-field-fg: var(--color-fg);
  --color-primary-fg: var(--color-text);
  --color-primary-text: var(--color-bg);
  --color-primary-bg: var(--color-accent);
  --color-destructive-fg: lch(63 80 30);
  --color-destructive-text: lch(80 10 30);
  --color-destructive-bg: lch(25 90 30);
  --shadow: 0px 4px 4px;
  --shadow-small: 0 4px 8px;
  --shadow-big: 0 1em 1.5em;
  --shadow-bigger: 0 1em 2em;
  --sizing-ratio: 1.5;
  --size-text: 1rem;
  --size-big-text: calc(var(--size-text) * 20 / 16);
  --size-h4: calc(var(--size-text) * 24 / 16);
  --size-h3: calc(var(--size-text) * 28 / 16);
  --size-h2: calc(var(--size-text) * 36 / 16);
  --size-h1: calc(var(--size-text) * 40 / 16);
  --size-h0: calc(var(--size-text) * 48 / 16);
  --size-big-heading: clamp(3rem, 8vw, 4.5rem);
  --size-massive: clamp(4rem, 12vw, 6.5rem);
  --size-small: calc(var(--size-text) * 14 / 16);
  --size-smaller: .7rem;
  --size-tiny: .55em;
  --weight-thin: 300;
  --weight-text: 400;
  --weight-medium: 700;
  --weight-heading: 700;
  --weight-massive: 900;
  --rlh: 1.25rem;
  --gap-hairline: 1px;
  --gap-tiny: calc(.25 * var(--rlh));
  --gap-small: calc(.5 * var(--rlh));
  --gap-mid-small: calc(.75 * var(--rlh));
  --gap: calc(1 * var(--rlh));
  --gap-large: calc(2 * var(--rlh));
  --gap-xlarge: calc(3 * var(--rlh));
  --gap-massive: calc(6 * var(--rlh));
  --border-width: 2px;
  --border-style: solid;
  --border: var(--border-width) var(--border-style);
  --border-thin-width: 1px;
  --border-thin-style: solid;
  --border-thin: var(--border-thin-width) var(--border-thin-style);
  --border-thick-width: 4px;
  --border-thick-style: solid;
  --border-thick: var(--border-thick-width) var(--border-thick-style);
  --radius: .8em;
  --radius-small: .3em;
  --radius-large: calc(1 * var(--rlh));
  --radius-full: 999999px;
  --length-medium: 50rem;
  --length-narrow: 28rem;
  --length-card: 18rem;
  --length-sidebar: 36ch;
  --length-wide: calc(1rem * 1200 / 16);
  font-size: clamp(.9rem, 1vw, 3rem);
  background:
    linear-gradient(
      to bottom,
      var(--color-bg),
      var(--color-box-bg));
  color: var(--color-text);
  font-family: var(--font-text);
  font-weight: var(--weight-text);
  accent-color: var(--color-accent);
}
@media (max-width: 1024px) {
  :root {
    font-size: calc(12rem / 16);
    --sizing-ratio: 1.2;
  }
}
body > * {
  width: 100%;
}
* {
  line-height: 1.25em;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: var(--weight-heading);
  margin-block: 1.25em 5pt;
}
:is(h1, h2, h3, h4, h5, h6) + :is(p, ul, ol) {
  margin-block-start: 0;
}
h1 {
  font-size: var(--size-h1);
  font-family: var(--font-display);
}
h2 {
  font-size: var(--size-h2);
  font-family: var(--font-display);
}
h3 {
  font-size: var(--size-h3);
}
h4,
h5,
h6 {
  font-size: var(--size-h4);
}
strong,
b {
  font-weight: var(--weight-medium);
}
input:is(:not([type]), [type=text], [type=search], [type=tel], [type=url], [type=email], [type=password], [type=date], [type=month], [type=week], [type=time], [type=datetime], [type=datetime-local], [type=number]),
select,
textarea {
  padding: var(--gap-small);
  line-height: initial;
  border-radius: var(--radius-small);
  background: var(--color-field-bg);
  color: var(--color-field-text);
  border: none;
  min-width: 0;
}
:is(input:is(:not([type]), [type=text], [type=search], [type=tel], [type=url], [type=email], [type=password], [type=date], [type=month], [type=week], [type=time], [type=datetime], [type=datetime-local], [type=number]), select, textarea):autofill {
  transition:
    background-color calc(infinity * 1s) step-end,
    background-image calc(infinity * 1s) step-end allow-discrete,
    color calc(infinity * 1s) step-end;
}
:is(button, input:is([type=submit], [type=button], [type=reset], [type=color])):not([class]) {
  padding: var(--gap-tiny);
  line-height: initial;
  border-radius: var(--radius-small);
  border: var(--border) var(--color-interact-fg);
  box-shadow: var(--shadow-small) var(--color-scrim-fg);
  background: var(--color-interact-bg);
  color: var(--color-interact-text);
  transition: box-shadow .08s auto;
}
:is(button, input:is([type=submit], [type=button], [type=reset], [type=color])):not([class]):is(:hover, :focus-visible) {
  background-color: lch(calc(5 + 6 + 10) calc(9 + 20) 249);
  color: lch(calc(66 + 40) 9 122);
  box-shadow: none;
}
input[type=checkbox] {
  appearance: none;
  width: 1em;
  height: 1em;
  display: inline-block;
  vertical-align: middle;
  border-radius: var(--radius-small);
  background-color: var(--color-interact-bg);
}
input[type=checkbox]::after {
  content: "\2713";
  display: block;
  visibility: hidden;
  color: var(--color-box-bg);
  width: 1em;
  translate: -.05em -.08em;
  text-align: center;
}
input[type=checkbox]:checked {
  background-color: var(--color-fg);
}
input[type=checkbox]:checked::after {
  visibility: visible;
}
:where(button).\<a\> {
  all: unset;
}
:where(a, .\<a\>) {
  text-decoration: 1px solid underline;
  color: var(--color-link);
}
:where(a, .\<a\>).unlink:not(:hover, :focus-visible) {
  text-decoration: none;
}
:where(a, .\<a\>):where(:hover, :focus-visible) {
  text-decoration: 1px solid underline;
  background-color: transparent;
  color: var(--color-link);
}
th {
  text-align: start;
}
mutable-list,
draggable-list {
  display: flex;
  flex-flow: column nowrap;
  gap: var(--gap-small);
}
collapsible-prose {
  display: block;
}
:host(nagging-toast) {
  position: fixed;
  z-index: 30;
  bottom: var(--gap);
  right: var(--gap);
  display: flex;
  justify-content: end;
  width: max-content !important;
}
:host(nagging-toast) .expanded {
  display: block;
  background: var(--color-box-bg);
  box-shadow: var(--shadow-small) var(--color-shadow);
  border-radius: var(--radius-small);
  max-width: min(var(--length-sidebar), 80vw);
  padding: var(--gap-small);
}
:host(nagging-toast) .expanded .close {
  background: none;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--gap-tiny);
  margin: calc(-1 * var(--gap-tiny)) calc(-1 * var(--gap-tiny)) 0 0;
  float: right;
  border-radius: var(--radius-small);
}
:host(nagging-toast) .expanded .close img {
  display: block;
  width: .9em;
  height: .9em;
  position: relative;
}
:host(nagging-toast) .expanded .close:is(:hover, :focus-visible) {
  background-color: var(--color-destructive-bg);
}
:host(nagging-toast) .collapsed .open {
  background-color: lch(from var(--color-fg) l c h / .2) !important;
  border: 1px solid var(--color-faded-fg) !important;
  -webkit-backdrop-filter: hue-rotate(180deg) invert(1) blur(1.25em) brightness(0.4);
  backdrop-filter: hue-rotate(180deg) invert(1) blur(1.25em) brightness(0.4);
}
:host(nagging-toast) .collapsed .whatsapp-icon {
  display: block;
  width: 100%;
  height: 100%;
  padding: var(--gap-tiny);
}
tiptap-editor {
  display: block;
  background: var(--color-field-bg);
  color: var(--color-field-text);
  border: var(--border) var(--color-field-fg);
  border-radius: var(--radius-small);
}
tiptap-editor .toolbar {
  display: flex;
  flex-flow: row wrap;
}
tiptap-editor .toolbar .button-group {
  display: flex;
  flex-flow: row wrap;
  padding-inline: var(--gap-tiny);
}
tiptap-editor .toolbar .button-group + :is(tiptap-editor .toolbar .button-group) {
  border-inline-start: var(--border-thin) var(--color-faded-fg);
}
tiptap-editor .toolbar .button-group .icon-button {
  padding-inline: var(--gap-tiny) !important;
}
tiptap-editor .tiptap {
  margin: calc(-1 * var(--gap-small)) var(--gap-small);
}
video-interstitial-dialog {
  display: none;
}
p,
ul,
ol,
dl,
blockquote,
figure,
aside,
details {
  margin-block: var(--flow-spacing, var(--gap));
}
ul,
ol {
  padding-inline-start: var(--gap);
}
:where(:is(ul, ol)[role=list]) {
  list-style: none;
  padding-inline-start: 0;
}
details summary {
  -webkit-user-select: none;
  user-select: none;
  touch-action: manipulation;
}
@media (prefers-reduced-motion: no-preference) {
  details {
    interpolate-size: allow-keywords;
  }
}
details::details-content {
  display: flow-root;
  opacity: 0;
  block-size: 0;
  overflow-y: clip;
  transition:
    content-visibility 0.2s allow-discrete,
    opacity 0.2s,
    block-size 0.2s;
}
details[open]::details-content {
  opacity: 1;
  block-size: auto;
}
.lucide {
  width: 1em;
  height: 1em;
  vertical-align: middle;
}
todo {
  color: red;
  background: yellow;
  border: .5em solid red;
  padding: .5em;
  font-weight: 700;
  font-style: italic;
}
todo::before {
  content: "TODO: ";
}
.nav-bar {
  background: var(--color-fg);
  color: var(--color-box-bg);
  -webkit-backdrop-filter: hue-rotate(180deg) invert(1) blur(1.25em) brightness(0.4);
  backdrop-filter: hue-rotate(180deg) invert(1) blur(1.25em) brightness(0.4);
  border-radius: var(--radius);
  border: 1px solid #fff7;
  box-shadow: var(--shadow-big) var(--color-scrim-fg);
  position: sticky;
  top: var(--gap-small);
  z-index: 999;
  max-width: calc(var(--length-wide) - 2 * var(--gap-large));
  margin-inline: auto;
  margin-block-start: var(--gap-tiny);
}
@supports (backdrop-filter: hue-rotate(180deg) invert(1) blur(1.25em) brightness(0.4)) {
  .nav-bar {
    background: lch(from var(--color-fg) l 100 h / 0.2);
  }
}
@media (max-width: 768px) {
  .nav-bar {
    width: auto;
    margin-inline: var(--gap-small);
  }
}
.nav-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  -webkit-backdrop-filter: blur(40px) contrast(1.2);
  backdrop-filter: blur(40px) contrast(1.2);
  mask:
    linear-gradient(
      to right,
      black,
      transparent 1.5em,
      transparent calc(100% - 1.5em),
      black) border-box,
    linear-gradient(
      to bottom,
      black,
      transparent 1.5em,
      transparent calc(100% - 1.5em),
      black) border-box;
  pointer-events: none;
}
.nav-bar :where(:is(a, .\<a\>):not(.drop-down :not(.trigger)):not(.app-logo):not(.woosh-cta)) {
  position: relative;
  text-decoration: none;
  color: var(--color-box-bg);
}
.nav-bar :where(:is(a, .\<a\>):not(.drop-down :not(.trigger)):not(.app-logo):not(.woosh-cta))::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: var(--border-width);
  background-color: currentColor;
  transition: width 0.3s ease;
}
.nav-bar :where(:is(a, .\<a\>):not(.drop-down :not(.trigger)):not(.app-logo):not(.woosh-cta)):hover,
.nav-bar :where(:is(a, .\<a\>):not(.drop-down :not(.trigger)):not(.app-logo):not(.woosh-cta)):focus-visible {
  color: var(--color-accent-text);
}
:is(.nav-bar :where(:is(a, .\<a\>):not(.drop-down :not(.trigger)):not(.app-logo):not(.woosh-cta)):hover, .nav-bar :where(:is(a, .\<a\>):not(.drop-down :not(.trigger)):not(.app-logo):not(.woosh-cta)):focus-visible)::after {
  width: 100%;
}
.nav-bar .collapsed a::after {
  display: none;
}
@media (min-width: 992px) {
  .nav-bar .collapsed {
    display: none;
  }
  .nav-bar .expanded {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
    padding: var(--gap-small) var(--gap);
    gap: var(--gap);
  }
  .nav-bar .left,
  .nav-bar .center,
  .nav-bar .right {
    display: flex;
    align-items: center;
    gap: var(--gap);
  }
  .nav-bar .left {
    justify-content: flex-start;
  }
  .nav-bar .center {
    justify-content: center;
  }
  .nav-bar .right {
    justify-content: flex-end;
  }
}
@media (max-width: 992px) {
  .nav-bar .collapsed {
    display: flex;
    flex-flow: row nowrap;
    justify-content: start;
    align-items: center;
    padding: var(--gap-small);
  }
  .nav-bar .toggle {
    background: none;
    border: none;
    font-size: calc(1 * var(--rlh));
    line-height: 1em;
    padding: var(--gap-small);
  }
  .nav-bar .toggle .icon {
    vertical-align: middle;
  }
  .nav-bar .expanded {
    display: none;
    padding: var(--gap);
  }
  .nav-bar .collapsed .app-logo {
    padding: var(--gap-small);
    margin-inline-end: auto;
  }
  .nav-bar .collapsed .whatsappbtn {
    margin-inline-end: var(--gap);
  }
  .nav-bar .expanded .left {
    display: none;
  }
  .nav-bar .left,
  .nav-bar .center,
  .nav-bar .right {
    display: flex;
    flex-flow: column nowrap;
    align-items: start;
    gap: var(--gap);
  }
  .nav-bar:has(.toggle[aria-expanded=true]) .expanded {
    display: flex;
    flex-flow: column nowrap;
    gap: var(--gap);
    font-size: var(--size-h4);
  }
  .nav-bar.search-mode .navbar-search-form {
    max-width: none;
    width: 100%;
    margin: var(--gap-small) 0;
  }
  .nav-bar.search-mode .navbar-search-form .search-input-container {
    width: 100%;
  }
}
.login-signup .woosh-cta {
  font-weight: var(--weight-text);
  font-size: inherit;
}
.landing-page {
  background:
    linear-gradient(
      to bottom,
      var(--color-box-bg),
      transparent 60vh),
    var(--color-bg);
  margin-block-start: calc(-3 * var(--rlh));
  padding-block-start: calc(3 * var(--rlh));
}
.basic-card {
  background: var(--color-box-bg);
  color: var(--color-box-text);
  padding-inline: var(--gap);
  border-radius: var(--radius);
  border-block: 1px solid transparent;
  border-inline: none;
  position: relative;
}
.basic-card.flex-column {
  padding-block: var(--gap);
}
.basic-card.flex-row {
  padding-block: var(--gap);
}
.basic-card .cardtitle {
  font-size: 1.4em;
}
.basic-card > .cardtitle {
  margin-block: var(--flow-spacing, var(--gap)) var(--gap-tiny);
}
.basic-card.-invert-color {
  background: var(--color-box-fg);
  color: var(--color-box-bg);
}
.basic-card.-dark-bg {
  background: var(--color-fg3);
  color: var(--color-box-bg);
}
.basic-card.-bg {
  background: var(--color-bg);
  color: var(--color-text);
}
.basic-card.-alt-bg {
  background: var(--color-alternate-bg);
  color: var(--color-text);
}
.basic-card.-accent-color {
  background: var(--color-accent);
  color: var(--color-box-bg);
}
.basic-card.-accent-fg {
  background: var(--color-accent-fg);
  color: var(--color-box-bg);
}
.basic-card.-accent3 {
  background: var(--color-accent3);
  color: var(--color-box-bg);
}
.basic-card.-accent {
  background: var(--color-accent);
  color: var(--color-box-bg);
}
.basic-card.-shadow {
  box-shadow: var(--shadow-big) var(--color-shadow);
}
.basic-card.-ribbon {
  border-radius: 0;
  padding: var(--gap) 0;
}
@media (min-width: 768px) {
  .basic-card.-ribbon {
    padding: var(--gap-large);
  }
}
:where(.basic-card :is(h1, h2, h3, h4, h5, h6):not(.section-header *)) {
  margin-block: var(--flow-spacing, var(--gap));
  font-size: var(--size-h3);
}
@media (min-width: 1000px) {
  .nature-bg {
    position: relative;
    overflow-x: clip;
    background:
      url(/public/graphics/bg-boulder.svg) -10em calc(100% + .5em) / 20em 20em no-repeat,
      url(/public/graphics/bg-boulder.svg) calc(100% + 10em) calc(100% + .5em) / 20em 20em no-repeat,
      var(--color-fg3) !important;
  }
  .nature-bg::before,
  .nature-bg::after {
    content: "";
    background: url(/public/graphics/bg-swoosh.png) top left / auto 100% no-repeat;
    display: inline-block;
    position: absolute;
    top: -4em;
    height: 12em;
    width: 100%;
    pointer-events: none;
  }
  .nature-bg::before {
    left: 0;
  }
  .nature-bg::after {
    right: 0;
    transform: rotateY(180deg) rotateZ(5deg) translateY(2em);
  }
}
.checked-list {
  padding-inline-start: 0;
  list-style: none;
}
.checked-list li {
  margin-block: var(--gap-small);
  padding-inline-start: calc(1.5 * var(--rlh));
  position: relative;
}
.checked-list li::before {
  display: inline-block;
  position: absolute;
  top: calc(calc(.5 * var(--rlh)) - .5em);
  left: 0;
  content: "\2713";
  text-align: center;
  font-weight: bold;
  line-height: .8;
  align-content: center;
  background: var(--color-accent);
  color: var(--color-box-bg);
  border-radius: var(--radius-full);
  width: calc(.5em + calc(.5 * var(--rlh)));
  height: calc(.5em + calc(.5 * var(--rlh)));
  margin-inline-end: var(--gap-small);
}
.landing-jumbotron {
  display: grid;
  grid: " text  image " auto " perch perch " auto / 1fr auto;
  align-items: center;
  column-gap: var(--gap-xlarge);
}
.landing-jumbotron .text {
  margin-block-end: var(--gap-large);
}
.landing-jumbotron .title {
  margin-block-end: var(--gap);
  text-wrap: balance;
}
.landing-jumbotron .lede {
  font-size: var(--size-big-text);
  font-weight: 500;
  line-height: 1.4em;
  margin-block-end: 1.5em;
}
.landing-jumbotron .mascot {
  max-height: 32em;
  margin-block-end: -2.5em;
  position: relative;
  z-index: 10;
}
.landing-jumbotron::after {
  grid-area: perch;
  content: "";
  background: var(--color-fg);
  display: block;
  height: calc(1.5 * var(--rlh));
  border-radius: var(--radius-full);
}
@media (max-width: 769px) {
   {
    display: none;
  }
}
.academy-jumbotron {
  display: grid;
  gap: var(--gap-large);
  grid: auto-flow / 1fr auto;
  align-items: center;
}
.academy-jumbotron .mascot {
  max-height: 28em;
  height: 100%;
  width: 100%;
  object-fit: contain;
}
.ribbon-and-card {
  --overlap: calc(2 * var(--rlh));
  display: grid;
  grid-template-rows: auto var(--overlap) auto;
  width: 100%;
}
.ribbon-and-card > .ribbon {
  background: var(--color-fg);
  color: var(--color-box-bg);
  padding: var(--gap);
  padding-block-end: calc(var(--overlap) + var(--gap));
  grid-row: 1 / 3;
  grid-column: 1;
  min-width: 0;
}
.ribbon-and-card > .body {
  border-radius: var(--radius);
  grid-row: 2 / 4;
  grid-column: 1;
  max-width: min(calc(100% - 2 * var(--gap-small)), var(--length-wide));
  min-width: 0;
  margin: auto;
  padding-inline: var(--gap);
}
.ribbon-and-card > .body:not(.-no-card, .basic-card, splide-carousel) {
  background: var(--color-box-bg);
}
.ribbon-and-card > .body:is(splide-carousel) {
  padding-block: 0;
}
@media (min-width: 1000px) {
  .ribbon-and-card > .body:is(splide-carousel) .splide__arrow {
    top: calc(var(--overlap)) !important;
  }
}
.woosh-cta {
  background:
    linear-gradient(
      to right,
      var(--color-accent-fg),
      var(--color-accent2));
  color: var(--color-box-bg);
  border: none;
  border-radius: var(--radius-small);
  padding: var(--gap-tiny) var(--gap);
  display: inline-block;
  max-width: 100%;
  font-family: var(--font-display);
  font-size: var(--size-big-text);
  font-weight: var(--weight-medium);
  text-align: center;
  text-decoration: none;
  opacity: 1;
  transition: all .2s ease;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.woosh-cta.-secondary {
  background: none;
  color: var(--color-accent-text);
  outline: var(--border-thin) var(--color-accent);
  outline-offset: calc(-1 * var(--border-thin-width));
}
.woosh-cta.-tertiary {
  background: none;
  color: currentColor;
  outline: var(--border-thin) currentcolor;
  outline-offset: calc(-1 * var(--border-thin-width));
}
.woosh-cta.-white {
  background: var(--color-box-bg);
  color: var(--color-accent-text);
  text-shadow: none;
}
.woosh-cta.-small {
  padding: var(--gap-tiny) var(--gap);
  font-size: var(--size-text);
}
.woosh-cta.-big {
  padding: var(--gap-mid-small) var(--gap-large);
  font-size: var(--size-big-text);
}
.woosh-cta.-massive {
  padding: var(--gap-small) var(--gap-large);
  width: 100%;
  font-size: var(--size-big-text);
}
@media (min-width: 769px) {
  .woosh-cta.-massive {
    width: auto;
    padding: var(--gap) var(--gap-massive);
  }
}
.woosh-cta.-dark-bg {
  background:
    linear-gradient(
      to right,
      var(--color-fg),
      var(--color-box-fg));
}
.woosh-cta.-destructive {
  background: none;
  color: var(--color-destructive-fg);
  outline: var(--border-thin) currentcolor;
  outline-offset: calc(-1 * var(--border-thin-width));
}
.basic-card > .woosh-cta {
  display: block;
  width: 100%;
  margin-block: var(--gap);
}
.woosh-cta::before {
  content: "";
  background: #fff;
  opacity: .2;
  position: absolute;
  height: 155px;
  width: 50px;
  left: -75px;
  top: -50px;
  transform: rotate(35deg);
  transition: all .55s cubic-bezier(.19, 1, .22, 1);
}
.woosh-cta:hover::before {
  left: 120%;
  transition: all .55s cubic-bezier(.19, 1, .22, 1);
}
.woosh-cta:disabled {
  color: var(--color-faded-text);
  outline-color: var(--color-faded-fg);
  outline-style: dashed;
  outline-width: var(--border-thin-width);
  outline-offset: calc(-1 * var(--border-thin-width));
}
.woosh-cta:disabled::before,
.woosh-cta:disabled::after {
  display: none;
}
.flex-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--gap);
}
.flex-row > * {
  margin: 0;
}
.flex-row.-separators {
  column-rule: var(--border-thin) var(--color-faded-fg);
}
.flex-column {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--gap);
}
.flex-column > * {
  margin-block: 0;
}
.lede-paragraph {
  font-size: var(--size-big-text);
  font-weight: 400;
  line-height: calc(1.1em + .6rem);
}
.layout-grid {
  display: grid;
  gap: var(--gap);
  margin-block: var(--gap);
}
@media (max-width: 768px) {
  .layout-grid {
    display: flex;
    flex-flow: column nowrap;
  }
}
.flow-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--cell-width, var(--length-sidebar))), 1fr));
  gap: var(--gap-small);
  margin-block: var(--gap);
}
.flow-grid.-auto-fit {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--cell-width, var(--length-sidebar))), 1fr));
}
.flow-grid.-even-rows {
  grid-auto-rows: 1fr;
}
.row-grid {
  display: grid;
  width: max-content;
  max-width: 100%;
  margin: auto;
  gap: var(--gap-small);
}
@media (min-width: 769px) {
  .row-grid {
    grid: 1fr / auto-flow 1fr;
  }
}
@media (min-width: 769px) {
  .messy-grid {
    padding: 1.25em;
  }
  .messy-grid > :nth-child(4n+1) {
    translate: -1.25em 0;
  }
  .messy-grid > :nth-child(4n+2) {
    translate: 0 -1.25em;
  }
  .messy-grid > :nth-child(4n+3) {
    translate: 0 1.25em;
  }
  .messy-grid > :nth-child(4n) {
    translate: 1.25em 0;
  }
}
.orbital-layout {
  display: block;
}
.orbital-layout .centerpiece {
  display: none;
}
.orbital-layout .orbit {
  display: flex;
  flex-flow: column;
  gap: var(--gap);
  padding-inline: 0;
}
@media (min-width: 768px) {
  .orbital-layout {
    display: grid;
  }
  .orbital-layout .orbit,
  .orbital-layout .centerpiece {
    grid-area: 1/1;
  }
  .orbital-layout .centerpiece {
    display: block;
    width: 33%;
    height: auto;
    margin: auto;
  }
  .orbital-layout .orbit {
    grid-area: 1/1;
    display: grid;
    grid: auto-flow / 1fr 1fr;
    column-gap: 33%;
    row-gap: var(--gap-xlarge);
    grid-auto-rows: 1fr;
    align-items: center;
  }
  .orbital-layout .orbit > :nth-child(1),
  .orbital-layout .orbit > :nth-last-child(2) {
    translate: 1.25em 0;
  }
  .orbital-layout .orbit > :nth-child(2),
  .orbital-layout .orbit > :nth-last-child(1) {
    translate: -1.25em 0;
  }
}
.semi-orbital-layout {
  display: block;
}
.semi-orbital-layout .centerpiece {
  display: none;
}
.semi-orbital-layout .orbit {
  display: flex;
  flex-flow: column;
  gap: var(--gap-small);
}
@media (min-width: 768px) {
  .semi-orbital-layout {
    display: grid;
    grid: 1fr / 2fr 3fr;
    gap: var(--gap-large);
    align-items: center;
  }
  .semi-orbital-layout .centerpiece {
    display: block;
    height: auto;
    margin-inline-end: auto;
  }
  .semi-orbital-layout .orbit {
    display: grid;
    row-gap: var(--gap-large);
    grid-auto-rows: 1fr;
    align-items: center;
  }
  .semi-orbital-layout .orbit > * {
    margin-inline: calc(2 * var(--rlh)) 0;
  }
  .semi-orbital-layout .orbit > :first-child,
  .semi-orbital-layout .orbit > :last-child {
    margin-inline: 0 calc(2 * var(--rlh));
  }
}
@media (min-width: 769px) {
  .floaty-animation {
    animation: undulate 4s infinite alternate linear;
  }
  :nth-child(4n+1) > .floaty-animation {
    animation-duration: 4.25s;
    animation-delay: .75s;
  }
  :nth-child(4n+2) > .floaty-animation {
    animation-duration: 5s;
    animation-delay: .5s;
  }
  :nth-child(4n+3) > .floaty-animation {
    animation-duration: 4s;
    animation-delay: 0s;
  }
  :nth-child(4n) > .floaty-animation {
    animation-duration: 4.75s;
    animation-delay: .25s;
  }
}
.swap-order > :first-child {
  order: 2;
}
.swap-order > :last-child {
  order: 1;
}
.section-header {
  margin: var(--gap-large) auto;
  max-width: min(var(--length-wide), calc(100% - 2 * var(--gap)));
  text-align: center;
  --flow-spacing: 0;
}
@media (min-width: 769px) {
  .section-header {
    margin: var(--gap-large) auto var(--gap-xlarge);
  }
}
.section-header h2 {
  font-size: var(--size-h1);
  margin-block: var(--gap-small);
}
.section-header h2:has(+ .lede-paragraph) {
  margin-block-end: var(--gap-small);
}
.drop-down {
  display: inline-block;
  position: relative;
}
.drop-down .trigger {
  cursor: pointer;
  display: flex;
  align-items: center;
  text-decoration: none;
  @keyframes spinner {
    to {
      transform: rotate(360deg);
    }
  }
}
.drop-down .trigger .lucide-chevron-down {
  max-width: none;
  margin-left: var(--gap-tiny);
  transition: transform 0.2s ease;
}
.drop-down .trigger .spinner {
  display: none;
  width: 12px;
  height: 12px;
  border: 2px solid var(--color-accent-fg);
  border-top-color: transparent;
  border-radius: 50%;
  margin-left: var(--gap-tiny);
  animation: spinner 0.6s linear infinite;
}
.drop-down .trigger .htmx-request .spinner {
  display: inline-block;
}
.drop-down .content {
  position: absolute;
  top: calc(calc(1 * var(--rlh)) + 5px);
  left: 0;
  z-index: 100;
  display: none;
  max-width: none;
  width: max-content;
}
.right :is(.drop-down .content) {
  left: auto;
  right: 0;
}
.drop-down .content {
  opacity: 0;
  visibility: hidden;
  display: block;
  transform: scaleY(0.95);
  transform-origin: top center;
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease;
}
:is(.drop-down:hover, .drop-down:focus-within) .trigger {
  text-shadow: 0 0 4px var(--color-fg);
}
:is(.drop-down:hover, .drop-down:focus-within) .content {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.corner-blob {
  background: var(--color-box-fg);
  border-radius: var(--radius-full);
  box-sizing: content-box;
  min-width: 10em;
  min-height: 10em;
  width: max-content;
  display: grid;
  grid: 2.25fr 1fr .75fr / 2fr 1fr 1fr;
  translate: -50% -40%;
  margin-block-end: -27%;
}
.corner-blob > * {
  grid-area: 2/2;
  width: 2.5em;
}
.basic-card:has(> .corner-blob) {
  overflow: clip;
}
@media (max-width: 769px) {
  .corner-blob {
    margin: 0;
    grid: 1fr 1fr 1fr / 2.25fr 1fr .75fr;
    position: absolute;
    top: 50%;
    translate: -110% -50%;
  }
  .basic-card:has(> .corner-blob) {
    padding-inline-start: calc(5em + var(--gap));
  }
}
.corner-blob.-side {
  margin: 0;
  grid: 1fr 1fr 1fr / 2.25fr 1fr .75fr;
  position: absolute;
  top: 50%;
  translate: -110% -50%;
}
.basic-card:has(> .corner-blob.-side) {
  padding-inline-start: calc(5em + var(--gap));
}
.basic-card:hover > .corner-blob {
  background-color: var(--color-accent);
  transition: all .2s;
}
.basic-card:hover > .corner-blob .icon {
  filter: brightness(10000%);
  transition: all .2s;
}
.step-ladder {
  counter-reset: step-ladder;
  text-align: center;
  text-wrap: balance;
  display: flow-root;
  padding-inline: 0;
}
.step-ladder .step {
  counter-increment: step-ladder;
  display: inline-grid;
  width: min(100%, var(--length-card));
  vertical-align: top;
  margin-block: var(--gap);
  position: relative;
}
.step-ladder .step h3 {
  margin-block-start: 0;
}
.step-ladder .step .icon,
.step-ladder .step::before {
  grid-area: 1/1;
  place-self: center;
}
.step-ladder .step .icon {
  display: none;
}
.step-ladder .step::before {
  content: counter(step-ladder, decimal-leading-zero);
  color: var(--color-accent);
  font-size: var(--size-massive);
  font-weight: 800;
  line-height: 1;
}
@media (min-width: 1000px) {
  .step-ladder .step {
    margin-inline: var(--gap);
  }
  .step-ladder .step:nth-child(1) {
    margin-block-start: calc(1 * var(--gap));
  }
  .step-ladder .step:nth-child(2) {
    margin-block-start: calc(2 * var(--gap));
  }
  .step-ladder .step:nth-child(3) {
    margin-block-start: calc(3 * var(--gap));
  }
  .step-ladder .step:nth-child(4) {
    margin-block-start: calc(4 * var(--gap));
  }
  .step-ladder .step:nth-child(5) {
    margin-block-start: calc(5 * var(--gap));
  }
  .step-ladder .step:nth-child(6) {
    margin-block-start: calc(6 * var(--gap));
  }
  .step-ladder .step .icon,
  .step-ladder .step::before {
    height: 6rem;
    width: 6rem;
  }
  .step-ladder .step .icon {
    display: block;
    background: var(--color-fg);
    border-radius: var(--radius-large);
    margin: var(--gap) var(--gap-large) 0 0;
    z-index: 1;
  }
  .step-ladder .step::before {
    opacity: .5;
    margin: 0 0 var(--gap-xlarge) var(--gap-large);
  }
  .step-ladder .step .text {
    margin-block-start: var(--gap);
  }
  .step-ladder .step:has(+ :is(.step-ladder .step))::after {
    content: "";
    background: url(/public/graphics/step-arrow.png) no-repeat 0 0 / 100% 100%;
    object-fit: contain;
    width: 4em;
    height: 4em;
    rotate: z 45deg;
    opacity: .6;
    position: absolute;
    left: 100%;
    top: 6em;
  }
}
.step-row {
  padding-inline: 0;
  gap: var(--gap);
}
.step-row .step {
  position: relative;
  margin-block: 0;
}
@media (min-width: 1000px) {
  .step-row {
    column-gap: var(--gap-xlarge);
  }
  .step-row .step + .step::before {
    content: "\2192";
    font-size: var(--size-big-text);
    font-weight: bold;
    color: var(--color-accent);
    display: inline;
    position: absolute;
    left: calc(-.5 * var(--gap-xlarge));
    top: 50%;
    translate: -50% -50%;
  }
}
.course-card {
  --b: var(--color-box-bg);
  --f: var(--color-accent);
  --s: var(--shadow) var(--color-shadow);
  position: relative;
  overflow: hidden;
  overflow: clip;
  background: var(--b);
  border-radius: var(--radius-large);
  color: var(--color-box-text);
  padding: var(--gap);
  transition: all .08s ease;
  display: grid;
  text-align: center;
  grid-template: "image" auto "tags" auto "title" auto "summary" 1fr "props" auto "cta" auto;
  box-shadow:
    var(--s),
    0 0 0 var(--gap-tiny) var(--b) inset,
    0 0 0 calc(var(--gap-tiny) + var(--border-width)) var(--f) inset;
}
.course-card.-horizontal {
  grid-template: "image title" "image summary" "image tags" "image props" "image cta" / 1fr 1fr;
  padding: var(--gap);
  gap: var(--gap-small);
  box-shadow: var(--s);
  text-align: start;
}
.course-card.-horizontal .image {
  margin: calc(-1 * var(--gap-small));
  margin-inline-end: 0;
  width: 100%;
  height: calc(100% + 2 * var(--gap-small));
  object-fit: cover;
  border-radius: calc(var(--radius-large) - var(--gap-small));
  min-width: 0;
}
.course-card.-horizontal .badge {
  display: none;
}
.course-card.-horizontal .actions {
  justify-content: start;
}
.course-card .image {
  grid-area: image;
  display: block;
  width: calc(100% + 2 * var(--gap));
  max-width: none;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 16 / 9;
  margin: calc(-1 * var(--gap));
  margin-block-end: var(--gap-small);
  object-fit: cover;
  border: none;
  background: var(--color-complement-bg);
}
.course-card .badge {
  grid-area: badge;
  max-width: 5em;
  height: auto;
  align-self: start;
}
.course-card .title {
  grid-area: title;
  display: block;
  color: var(--color-box-text);
  font-size: var(--size-h3);
  font-family: var(--font-display);
  font-weight: var(--weight-medium);
  margin-block: var(--gap-tiny) var(--gap-small);
  line-height: 1.2;
  text-decoration: none;
}
.course-card .summary {
  margin-block: 0;
}
.course-card .link::after {
  content: "";
  display: inline;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
}
.course-card .tags {
  grid-area: tags;
  margin-block: var(--gap-small) 0;
  display: flex;
  flex-flow: row wrap;
  gap: var(--gap-tiny) var(--gap-small);
  justify-content: center;
  font-size: var(--size-small);
}
.course-card .props {
  grid-area: props;
  margin-block: var(--gap);
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  gap: var(--gap);
}
.course-card .prop {
  text-align: center;
}
.course-card .prop dt,
.course-card .prop dd {
  margin: 0;
  padding: 0;
}
.course-card .prop dt {
  font-weight: var(--weight-medium);
  font-size: var(--size-small);
}
.course-card .prop .lucide {
  color: var(--color-accent);
  display: block;
  font-size: calc(1.5 * var(--rlh));
  margin: auto;
}
.course-card > .actions {
  grid-area: cta;
  align-self: end;
  display: flex;
  flex-flow: row;
  align-items: end;
  justify-content: stretch;
  gap: var(--gap-small);
}
.course-card > .actions > * {
  flex-grow: 1;
}
.course-card:is(:hover, :focus-within) {
  translate: 0 -.25em;
  --s: 0 .6em .6em var(--color-shadow);
}
.course-card:has(.link:active) {
  box-shadow: none;
}
.workshop-card {
  background: var(--color-box-bg);
  color: var(--color-box-text);
  border-radius: var(--radius);
  padding: var(--gap-small);
  display: grid;
  grid-template: "chip  ornament" "title title" "date  cta" / 1fr auto;
  gap: var(--gap-small);
  align-items: center;
}
.workshop-card .ornament {
  grid-area: ornament;
  justify-self: end;
}
.workshop-card .ornament svg {
  height: var(--rlh);
  color: var(--color-faded-fg);
}
.workshop-card .chip {
  grid-area: chip;
  justify-self: start;
  background: var(--color-faded-fg);
  border-radius: var(--radius-small);
  padding: var(--gap-hairline) var(--gap-small);
  color: var(--color-box-bg);
  font-weight: var(--weight-medium);
}
.workshop-card .title {
  grid-area: title;
  text-decoration: none;
  font-size: var(--size-h3);
  font-weight: bold;
}
.workshop-card .date {
  grid-area: date;
}
.workshop-card .date .lucide {
  vertical-align: middle;
  color: var(--color-accent);
}
.workshop-card .cta {
  grid-area: cta;
}
.courses-shelf {
  position: relative;
  overflow: hidden;
  overflow: clip;
}
.courses-shelf + .courses-shelf {
  margin-block-start: var(--gap-xlarge);
}
.courses-shelf > .header > .title {
  margin: 0;
  margin-block: var(--gap-small);
  font-size: var(--size-h2);
  text-align: center;
}
.courses-shelf .soon {
  margin: 0;
  font-size: var(--size-h2);
  color: var(--color-accent-text);
  font-weight: var(--weight-heading);
  font-family: var(--font-display);
  text-align: center;
}
.courses-shelf .footer {
  margin-block-start: var(--gap-xlarge);
  text-align: center;
}
.courses-shelf .viewall {
  font-weight: var(--weight-medium);
}
.courses-shelf .viewall:not(:hover, :focus-visible) {
  text-decoration: none;
}
.courses-shelf .viewall .lucide {
  vertical-align: top;
  height: calc(1 * var(--rlh));
}
.courses-grid {
  display: grid;
  --l: var(--length-card);
  grid-template-columns: repeat(auto-fill, minmax(min(var(--l), 100%), 1fr));
  gap: var(--gap);
  padding-inline-start: 0;
  list-style: none;
}
@media (max-width: 768px) {
  .courses-grid {
    gap: var(--gap-large);
  }
}
.courses-grid:has(> .course-card:is(.-horizontal)) {
  --l: var(--length-narrow);
}
.courses-grid .empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: var(--gap-large);
  color: var(--color-faded-text);
  font-style: italic;
}
.star-rating {
  font-size: var(--size-big-text);
  width: calc(5 * var(--rlh));
  height: var(--rlh);
  background: var(--color-faded-fg);
  color: var(--color-accent2);
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><text font-size="100" y="0.8em">\2605</text></svg>') 0 / auto 100%;
  padding: 0;
}
.star-rating::-webkit-meter-bar {
  -webkit-appearance: none;
  background: var(--color-faded-fg);
  height: var(--rlh);
}
.star-rating::-webkit-meter-optimum-value,
.star-rating::-webkit-meter-sub-optimum-value,
.star-rating::-webkit-meter-even-less-good-value {
  -webkit-appearance: none;
  background: var(--color-accent);
}
.star-rating::-moz-meter-bar {
  -moz-appearance: none;
  background: var(--color-accent);
}
.invert-color {
  background-color: var(--color-box-fg);
  color: var(--color-box-bg);
}
.basic-header {
  text-align: center;
  align-content: center;
  min-height: 15em;
  padding-block: calc(3 * var(--rlh)) var(--gap-xlarge);
  padding-inline: max(calc((100vw - var(--length-wide)) / 2), var(--gap));
  position: relative;
}
.basic-header > .rune-ornament {
  margin-block-end: var(--gap);
}
.basic-header .title {
  margin-block: var(--gap-small);
}
.basic-header .title strong {
  color: var(--color-accent-text);
}
.basic-header .actions {
  margin-block-start: var(--gap-xlarge);
}
@media (max-width: 768px) {
  .basic-header .actions {
    margin-block-start: var(--gap);
  }
}
:is(.basic-header, .basic-card) .decor {
  float: right;
  margin-block-end: calc(-50% + -1 * var(--gap-large));
  margin-inline-end: max(calc((var(--length-wide) - 95vw) / 2), 0px);
  position: relative;
  --s: calc((100vw - var(--length-wide)) / 2);
  max-width: var(--s);
  z-index: 10;
}
@media (max-width: 1100px) {
  :is(.basic-header, .basic-card) .decor {
    display: none;
  }
}
.rune-ornament {
  color: var(--color-accent);
  display: grid;
  place-items: center;
}
.rune-ornament > svg {
  height: 1em;
  width: auto;
}
share-button {
  display: contents;
}
share-button button {
  cursor: pointer;
  aspect-ratio: 1;
  padding: 0;
  height: 1.75em;
  display: inline-grid;
  place-items: center;
  margin-block: calc(-1 * var(--gap-tiny));
  border: none;
  border-radius: var(--radius-full);
  box-shadow: none;
}
horizontal-scroller > * {
  width: max-content;
}
x-tablist,
.pseudo-tabs {
  display: flex;
  flex-flow: row wrap;
  align-items: end;
  gap: var(--gap-tiny) var(--gap-large);
  border-block-end: var(--border) var(--color-faded-fg);
}
:is(x-tablist, .pseudo-tabs) .right {
  margin-inline-start: auto;
}
:is(x-tablist, .pseudo-tabs).-scroll {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--color-faded-text) var(--color-bg);
}
:is(x-tablist, .pseudo-tabs).-scroll > * {
  flex: 1 0 auto;
}
x-tab,
.pseudo-tab {
  display: block;
  flex-basis: 1 0 auto;
  padding-block: var(--gap-tiny);
  text-decoration: none;
  border-block-end: var(--border-thick) transparent;
  margin-block-end: calc(-1 * var(--border-width));
  font-size: var(--size-big-text);
  color: var(--color-faded-text);
}
:is(x-tab, .pseudo-tab):hover,
:is(x-tab, .pseudo-tab):focus-visible {
  color: var(--color-accent-text);
}
:is(x-tab, .pseudo-tab)[aria-current=page],
:is(x-tab, .pseudo-tab)[aria-selected=true] {
  color: var(--color-accent-text);
  border-block-end-color: var(--color-accent);
}
x-tabpanel {
  display: block;
  margin-block: var(--gap);
}
masked-input {
  display: contents;
}
splide-carousel .splide__controls {
  align-content: center;
  position: relative;
  padding-inline: var(--gap-tiny);
}
splide-carousel .splide__controls:not(:empty) {
  height: calc(1.5 * var(--rlh));
}
splide-carousel .splide__pagination {
  position: static !important;
  translate: 0 var(--gap-small);
}
splide-carousel .splide__pagination__page {
  background: var(--color-faded-fg) !important;
}
splide-carousel .splide__pagination__page.is-active {
  background: var(--color-box-fg) !important;
  transform: none !important;
}
splide-carousel .splide__toggle {
  border-radius: 9999px;
  background: var(--color-shadow);
  border: none;
  color: var(--color-accent);
  width: var(--size-h3);
  height: var(--size-h3);
  display: inline grid;
  place-content: center;
}
splide-carousel .splide__toggle svg {
  width: var(--size-small);
  height: var(--size-small);
  fill: var(--color-interact-fg);
}
splide-carousel .splide__arrow {
  background: #fff3 !important;
  opacity: 1 !important;
  z-index: 20 !important;
  top: calc(50% - 0.5 * var(--rlh));
}
splide-carousel .splide__arrow[disabled] {
  display: none !important;
}
splide-carousel .splide__arrow svg {
  fill: var(--color-accent);
}
splide-carousel .splide__arrow--prev {
  left: calc(-3 * var(--rlh)) !important;
}
splide-carousel .splide__arrow--next {
  right: calc(-3 * var(--rlh)) !important;
}
@media (max-width: 1000px) {
  splide-carousel .splide__arrow--prev {
    left: calc(.5 * var(--rlh)) !important;
    top: calc(100% + var(--gap-tiny)) !important;
    transform: translateY(-50%) !important;
  }
  splide-carousel .splide__arrow--next {
    right: calc(.5 * var(--rlh)) !important;
    top: calc(100% + var(--gap-tiny)) !important;
    transform: translateY(-50%) !important;
  }
}
.trusted-by {
  margin-block-end: -20em;
  padding-block-end: 20em;
  pointer-events: none;
  overflow-x: hidden;
  overflow-x: clip;
  position: relative;
  z-index: 5;
}
.trusted-by .title {
  text-align: center;
  margin-block: 0;
  font-size: var(--size-h4);
  color: #848283;
}
.trusted-by .splide {
  pointer-events: all;
  margin: 0 auto;
  position: relative;
}
.trusted-by .splide .splide__track {
  mask-image:
    linear-gradient(
      to right,
      transparent,
      white 15%,
      white calc(100% - 15%),
      transparent);
  mask-clip: no-clip;
  mask-origin: margin-box;
  -webkit-mask-image:
    linear-gradient(
      to right,
      transparent,
      white 15%,
      white calc(100% - 15%),
      transparent);
  -webkit-mask-clip: no-clip;
  -webkit-mask-origin: margin-box;
}
.trusted-by .splide__track {
  overflow: visible !important;
}
.trusted-by .item {
  position: relative;
}
.trusted-by .item:hover img {
  filter: none;
}
.trusted-by .logo {
  height: 5rem;
  max-width: 12rem;
  display: grid;
  place-items: center;
  font-family: var(--font-display);
  font-size: var(--size-h2);
  font-weight: var(--weight-heading);
  color: var(--color-fg);
  margin: 0 auto;
  text-align: center;
  cursor: pointer;
}
.trusted-by .logo img {
  max-width: 100%;
  height: inherit;
  object-fit: contain;
  filter: grayscale() contrast(0);
}
.trusted-by .detail {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: 200px;
  margin-top: 0;
  opacity: 0;
  background-color: var(--color-bg);
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
  z-index: 10;
  background: var(--color-box-bg);
  border-radius: var(--radius);
  padding: var(--gap-small);
  box-shadow: var(--shadow) var(--color-shadow);
}
.splide__track:has(.trusted-by .detail) {
  z-index: 10 !important;
}
.trusted-by .detail .company {
  font-size: var(--size-text);
  font-weight: var(--weight-medium);
  margin: 0;
}
.trusted-by .detail .instructor {
  font-size: var(--size-small);
  margin: 0;
}
.trusted-by .detail::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 16px;
  height: 16px;
  background: var(--color-box-bg);
}
.trusted-by .item:hover .detail {
  opacity: 1;
  visibility: visible;
}
.flank-layout .centerpiece {
  display: none;
}
.flank-layout .item {
  padding: var(--gap);
  border-inline: var(--border-thick) transparent;
  grid-column: 1;
  border-inline-end: none;
  --bg-dir: right;
}
.flank-layout .item:hover,
.flank-layout:not(:hover) > .item:not(.item ~ *) {
  border-inline-color: var(--color-accent);
  background:
    linear-gradient(
      to var(--bg-dir),
      var(--color-box-bg),
      transparent);
}
@media (min-width: 769px) {
  .flank-layout {
    display: grid;
    grid: auto-flow / 1fr 1fr 1fr;
    position: relative;
  }
  .flank-layout .centerpiece {
    display: block;
    position: absolute;
    width: 33%;
    height: 100%;
    left: 50%;
    top: 50%;
    translate: -50% -50%;
    object-fit: contain;
  }
  .flank-layout .item:nth-of-type(2n) {
    grid-column: 3;
    border-inline-start: none;
    --bg-dir: left;
    text-align: right;
  }
}
.star-badge {
  background: var(--color-accent);
  color: var(--color-box-bg);
  aspect-ratio: 1/1;
  text-align: center;
  align-content: center;
  font-size: var(--size-h3);
  font-weight: bold;
  top: -.5em;
  --s: 6.5em !important;
  max-width: var(--s);
  --g:
    / calc(var(--s)*0.227) calc(var(--s)*0.227) radial-gradient(
      50% 50%,#000 99%,#0000 101%) no-repeat;
  mask:
    calc(50% + var(--s)*0.357) calc(50% + var(--s)*0) var(--g),
    calc(50% + var(--s)*0.274) calc(50% + var(--s)*0.23) var(--g),
    calc(50% + var(--s)*0.062) calc(50% + var(--s)*0.352) var(--g),
    calc(50% + var(--s)*-0.179) calc(50% + var(--s)*0.309) var(--g),
    calc(50% + var(--s)*-0.336) calc(50% + var(--s)*0.122) var(--g),
    calc(50% + var(--s)*-0.336) calc(50% + var(--s)*-0.122) var(--g),
    calc(50% + var(--s)*-0.179) calc(50% + var(--s)*-0.309) var(--g),
    calc(50% + var(--s)*0.062) calc(50% + var(--s)*-0.352) var(--g),
    calc(50% + var(--s)*0.274) calc(50% + var(--s)*-0.23) var(--g),
    radial-gradient(
      calc(var(--s)*0.436),
      #000 99%,
      #0000 101%) subtract,
    calc(50% + var(--s)*0.496) calc(50% + var(--s)*0.18) var(--g),
    calc(50% + var(--s)*0.264) calc(50% + var(--s)*0.457) var(--g),
    calc(50% + var(--s)*-0.092) calc(50% + var(--s)*0.52) var(--g),
    calc(50% + var(--s)*-0.404) calc(50% + var(--s)*0.339) var(--g),
    calc(50% + var(--s)*-0.528) calc(50% + var(--s)*0) var(--g),
    calc(50% + var(--s)*-0.404) calc(50% + var(--s)*-0.339) var(--g),
    calc(50% + var(--s)*-0.092) calc(50% + var(--s)*-0.52) var(--g),
    calc(50% + var(--s)*0.264) calc(50% + var(--s)*-0.457) var(--g),
    calc(50% + var(--s)*0.496) calc(50% + var(--s)*-0.18) var(--g);
}
.star-badge strong {
  color: var(--color-box-text);
}
.askew-card {
  padding: var(--gap-large) var(--gap);
  border-radius: var(--radius);
  background:
    linear-gradient(
      to right,
      var(--color-accent-fg),
      var(--color-accent2));
  color: var(--color-box-bg);
  font-size: var(--size-big-text);
  font-weight: bold;
  rotate: 5deg;
  text-align: start;
  --width: 20ch;
  min-width: var(--width);
}
.askew-card strong {
  color: var(--color-box-fg);
  display: block;
  margin-block-end: var(--gap-small);
}
.faq-list {
  display: flex;
  flex-flow: column;
  gap: var(--gap-small);
}
.faq-list details {
  padding: var(--gap-small);
  margin: 0;
}
.faq-list details summary {
  font-size: var(--size-big-text);
  font-weight: bold;
  list-style: none;
}
.faq-list details summary::after {
  width: .6em;
  content: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 5 5"><path fill="none" stroke="black" d="M.5 1.5 l2 2 2 -2"/></svg>');
  display: block;
  float: right;
}
.faq-list details[open] summary::after {
  rotate: z 180deg;
}
.prop-list {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: var(--gap);
}
.prop-list .prop {
  display: contents;
}
.prop-list .prop dt {
  font-weight: var(--weight-medium);
}
.form-field {
  display: flex;
  flex-flow: column;
}
.form-field > input:is(:not([type]), [type=text], [type=search], [type=tel], [type=url], [type=email], [type=password], [type=date], [type=month], [type=week], [type=time], [type=datetime], [type=datetime-local], [type=number]),
.form-field select,
.form-field textarea {
  display: block;
  width: 100%;
  border: none;
  padding: var(--gap-small) var(--gap);
}
.form-field:has(> input:is([type=checkbox], [type=radio])) {
  flex-flow: row;
  align-items: first baseline;
  column-gap: var(--gap-small);
}
.form-field:has(> input:is([type=checkbox], [type=radio])) input {
  flex: 0 0 auto;
}
.popout-icon {
  background: var(--color-box-bg);
  border-radius: var(--radius-full);
  margin-block-start: calc(-1.5 * var(--rlh));
  margin-inline: auto;
  padding: var(--gap-mid-small);
}
.basic-card:has(.popout-icon) {
  margin-block-start: calc(1.5 * var(--gap));
}
.auth-dialog {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  max-height: 100%;
}
.site-dialog:has(.auth-dialog) {
  grid: 100% / 1fr;
}
.auth-dialog .logo {
  max-width: 12em;
  margin: auto;
}
.auth-dialog .form {
  padding: var(--gap-large);
  overflow-y: auto;
}
.auth-dialog .form input:not(:checked) {
  background: var(--color-box-bg);
}
.auth-dialog .submit {
  display: block;
  min-width: 12em;
  width: fit-content;
  margin: auto;
}
.auth-dialog .header,
.auth-dialog .trailers {
  text-align: center;
}
.auth-dialog .trailers {
  padding: var(--gap-large);
  background: var(--color-fg);
  color: var(--color-box-bg);
  align-content: center;
}
.auth-dialog .trailer img {
  max-height: 40vh;
}
.site-dialog {
  margin-block: var(--gap-small);
  margin-inline: auto;
  padding: 0;
  width: calc(100% - 2 * var(--gap-small));
  height: min(100%, calc(40 * var(--rlh)));
  max-width: var(--length-wide);
  opacity: 1;
  transition: opacity .3s ease, scale .3s ease;
  background: var(--color-bg);
  color: var(--color-text);
  border: none;
  box-shadow: var(--shadow-bigger) #000a;
  overflow-y: auto;
  --backdrop: rgba(0, 0, 0, 0.5);
  display: grid;
}
.site-dialog > * {
  grid-area: 1/1;
}
@starting-style {
  .site-dialog {
    opacity: 0;
    scale: .95;
    --backdrop: transparent;
  }
}
.site-dialog::backdrop {
  background-color: var(--backdrop);
}
.site-dialog:hover {
  transform: none;
}
.site-dialog .background {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  color: var(--color-alternate);
}
.site-dialog .titlebar {
  position: relative;
  display: flex;
  justify-content: flex-end;
  margin-bottom: var(--gap-small);
  place-self: start end;
}
@media (max-width: 769px) {
  .big-screen-only {
    display: none;
  }
}
.course-detail-page > .header {
  min-height: 22em;
}
.course-detail-page .media {
  aspect-ratio: 16/9;
}
@media (min-width: 768px) {
  .course-detail-page .media {
    grid-area: 1/1;
    margin-inline-start: auto;
    min-height: 100%;
    width: min-content;
    aspect-ratio: 21/9;
    mask:
      linear-gradient(
        to left,
        white 30%,
        transparent);
  }
}
.course-detail-page .media > * {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border: none;
}
.course-detail-page .text {
  grid-area: 1/1;
  padding: var(--gap);
  position: relative;
  z-index: 10;
  max-width: var(--length-narrow);
}
@media (min-width: 768px) {
  .course-detail-page .text {
    padding-block-end: calc(2 * var(--rlh) + var(--gap));
  }
}
.course-detail-page .metabox {
  margin-block-start: calc(-2 * var(--rlh));
  max-width: calc(min(100%, var(--length-wide)) - 2 * var(--gap));
  width: max-content;
  margin-inline: auto;
  position: relative;
  z-index: 10;
  background: var(--color-fg4);
  color: var(--color-box-bg);
  border: var(--border-thin) var(--color-accent);
  padding-inline: var(--gap);
  border-radius: var(--radius);
  box-shadow: var(--shadow) var(--color-shadow);
}
.course-detail-page .metabox .props {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  gap: var(--gap-tiny) 0;
  padding-block: var(--gap);
}
@media (min-width: 920px) {
  .course-detail-page .metabox .props {
    display: grid;
    grid: 1fr / 2fr 3fr 2fr;
    min-width: 38em;
  }
}
.course-detail-page .metabox .props .prop {
  text-align: center;
  padding-inline: var(--gap);
}
.course-detail-page .metabox .props .prop:not(:last-child) {
  border-inline-end: var(--border-thin) var(--color-accent);
}
.course-detail-page .metabox .props .prop .lucide {
  font-size: var(--size-h3);
  color: var(--color-accent);
}
.course-detail-page .metabox .props .prop .key,
.course-detail-page .metabox .props .prop .value {
  display: block;
}
.course-detail-page .metabox .props .prop .value {
  margin-inline-start: 0;
  font-size: var(--size-big-text);
  font-weight: 500;
}
.course-detail-page .metabox .props .btn {
  margin: var(--gap-small) var(--gap);
}
.course-detail-page .body section.basic-card {
  margin-block: var(--gap);
  padding-inline: calc(1.2 * var(--gap));
  padding-block: 4px var(--gap);
}
.course-detail-page .body > .actions {
  margin-block-end: var(--gap);
}
.course-detail-page .description * {
  line-height: 1.4em;
}
.course-detail-page .description .props {
  display: flex;
  flex-flow: row wrap;
  gap: var(--gap);
}
:is(.course-detail-page .description > .section ul, .course-detail-page .description > .section ol) li {
  margin-block: calc(.5 * var(--flow-spacing, var(--gap)));
}
.course-detail-page .cta {
  grid-area: cta;
  display: grid;
  place-items: center;
  text-align: center;
}
@media (min-width: 769px) {
  .course-sidebar {
    max-height: 90vh;
    overflow-y: auto;
    height: max-content;
    position: sticky;
    top: 5rem;
  }
  .course-sidebar.-header-not-visible .minimedia {
    display: grid;
    margin-block: var(--gap);
    border-radius: var(--radius-small);
    overflow: clip;
  }
  .course-sidebar.-header-not-visible .minimedia > * {
    grid-area: 1/1;
  }
  .course-sidebar .title {
    color: var(--color-box-bg);
    text-shadow: var(--shadow-small) var(--color-scrim-fg);
    margin: var(--gap-small);
    font-size: var(--size-h3);
    font-weight: var(--weight-heading);
    align-content: end;
  }
}
.course-sidebar .copy h1,
.course-sidebar .copy h2,
.course-sidebar .copy h3,
.course-sidebar .copy h4,
.course-sidebar .copy h5,
.course-sidebar .copy h6 {
  margin-block: var(--gap);
}
.course-sidebar .copy h1 {
  font-size: var(--size-h3);
}
.course-sidebar .copy h2 {
  font-size: var(--size-h4);
}
.course-sidebar .copy h3,
.course-sidebar .copy h4 {
  font-size: var(--size-big-text);
}
.course-sidebar .copy h5,
.course-sidebar .copy h6 {
  font-size: var(--size-text);
}
.course-sidebar .copy li p {
  margin-block: var(--gap-small);
}
.course-sidebar .price {
  font-size: var(--size-h4);
  font-weight: var(--weight-medium);
  text-align: end;
}
.course-sidebar .actions {
  margin-block: var(--gap);
  display: flex;
  flex-flow: column;
  gap: var(--gap-small);
}
.course-sidebar .minimedia {
  display: none;
}
.video-thumbnail {
  display: grid;
}
.video-thumbnail > * {
  grid-area: 1/1;
}
.discount-calc {
  border-block: var(--border-thin) var(--color-faded-fg);
  max-width: none;
  margin-inline: calc(-1 * var(--gap-small));
  font-weight: var(--weight-medium);
}
.discount-calc th,
.discount-calc td {
  padding: var(--gap-small);
}
.discount-calc th {
  width: 100%;
}
.discount-calc td {
  white-space: nowrap;
  text-align: end;
  font-variant-numeric: tabular-nums;
}
.discount-calc .discount {
  color: var(--color-faded-fg);
}
.coupon-code-input {
  display: grid;
  grid: 1fr / 1fr auto;
  gap: var(--gap-small);
}
.course-variant-card {
  border: var(--border-thin) var(--color-faded-fg);
  border-radius: var(--radius-small);
  padding: var(--gap-small);
  position: relative;
}
.course-variant-card.-active {
  background: lch(from var(--color-alternate) l c h / .1);
  border-color: lch(from var(--color-alternate) l c h);
}
.course-variant-card.-active .name {
  color: var(--color-alternate);
}
.course-variant-card .name {
  display: block;
  color: currentColor;
  text-decoration: none;
  font-size: var(--size-h3);
}
.course-variant-card .name:is(:hover, :focus-visible) {
  color: var(--color-accent);
}
.course-variant-card .name::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 10;
}
.course-variant-card .meta {
  font-size: var(--size-small);
}
.course-content-outline {
  overflow: hidden;
  overflow: clip;
  position: relative;
  padding-block: var(--gap);
  --flow-spacing: var(--gap-small);
}
.course-content-outline .title {
  font-family: var(--font-display);
}
.course-content-outline details {
  margin-block: var(--flow-spacing) 0;
  border-radius: var(--radius-small);
}
.course-content-outline details summary {
  font-weight: var(--weight-medium);
  color: var(--color-accent);
  -webkit-user-select: none;
  user-select: none;
  border-radius: var(--radius-small);
}
.course-content-outline details summary:hover {
  background: lch(from var(--color-fg) l c h / 10%);
}
.course-content-outline details details summary {
  color: var(--color-accent2);
}
.course-content-outline details summary:last-child {
  list-style: disc;
  margin-inline-start: var(--gap-small);
  margin-block: var(--flow-spacing);
}
.course-content-outline details .secttitle {
  color: var(--color-accent-text);
}
.course-content-outline details ul {
  font-weight: var(--weight-medium);
  color: var(--color-box-fg);
  padding-inline-start: var(--gap-small);
}
.course-content-outline details li {
  margin-block-start: var(--flow-spacing);
}
.course-content-outline details > :not(summary) {
  margin-block-start: var(--gap-tiny);
  padding-inline-start: var(--gap);
}
.lesson-nav {
  position: sticky;
  top: 5em;
}
.lesson-content {
  min-height: 80vh;
}
.lesson-sidebar {
  max-height: 90vh;
  position: sticky;
  top: 5em;
  overflow-y: auto;
}
.lesson-sidebar .title {
  margin-block: var(--gap);
  font-size: var(--size-h3);
  font-weight: var(--weight-thin);
  line-height: 1.2;
}
.sidebar-lesson-list {
  padding-inline: 0;
}
.sidebar-lesson-list a {
  color: currentColor;
  text-decoration: none;
  display: block;
  padding: var(--gap-small);
  border-radius: var(--radius-small);
}
.sidebar-lesson-list a:hover,
.sidebar-lesson-list a:focus-visible {
  background: #fff2;
}
.sidebar-lesson-list .-active a {
  background: var(--color-box-bg);
}
.lesson-text {
  font-size: var(--size-big-text);
  letter-spacing: .03em;
  font-weight: 450;
}
.box-header {
  background: var(--color-fg4);
  color: var(--color-box-bg);
  margin: auto;
  position: relative;
  overflow: clip;
  border-radius: var(--radius);
}
.box-header a:not([class]) {
  color: var(--color-accent2);
}
.box-header .breadcrumb-item:last-child:not([specificity-hack]) {
  font-weight: var(--weight-text);
}
.courses-filter {
  background:
    linear-gradient(
      to right,
      var(--color-accent),
      var(--color-accent2));
  color: var(--color-box-bg);
  font-weight: var(--weight-medium);
  border-radius: var(--radius);
  padding: var(--gap-mid-small) var(--gap-large);
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: stretch;
  gap: var(--gap);
  max-width: var(--length-medium);
  margin: auto;
}
.courses-filter .multiselect {
  flex-grow: 1;
  margin: 0;
  background: var(--color-box-bg);
  border-radius: var(--radius-small);
  position: relative;
}
.courses-filter .multiselect summary {
  padding: var(--gap-small) var(--gap);
  color: var(--color-accent-text);
  text-align: start;
  list-style: none;
}
.courses-filter .multiselect summary::after {
  content: "\2304";
  display: block;
  float: right;
}
.courses-filter .multiselect .body {
  text-align: start;
  color: var(--color-box-text);
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 20;
}
.courses-filter .multiselect .body ul {
  list-style: none;
  padding-inline-start: 0;
}
.courses-filter .multiselect .body ul ul {
  padding-inline-start: var(--rlh);
}
.courses-search {
  display: block;
}
.courses-search input {
  width: 100%;
  max-width: none;
  background: none;
  border: var(--border) var(--color-accent);
  padding: var(--gap-small) var(--gap);
}
.courses-search input::placeholder {
  color: var(--color-accent);
  font-weight: var(--weight-medium);
}
.contact-us {
  padding: var(--gap) var(--gap-large);
  background-color: var(--color-box-fg);
  color: var(--color-box-bg);
  border-radius: var(--radius);
  display: flex;
  flex-flow: row;
  align-items: center;
  max-width: min(var(--length-wide), calc(100% - 2 * var(--gap)));
  margin: auto;
}
.contact-us .title {
  margin-block: var(--gap) 0;
}
.contact-form input,
.contact-form textarea {
  background-color: var(--color-bg);
  border-radius: var(--radius);
}
:is(.contact-form input, .contact-form textarea)[type=checkbox] {
  border-radius: var(--radius-small);
}
:is(.contact-form input, .contact-form textarea)[type=checkbox]:checked {
  background-color: var(--color-fg);
}
.text-columns {
  column-width: var(--length-col, 20ch);
  margin-block: var(--flow-spacing, var(--gap));
}
.text-columns > :first-child,
.text-columns > :first-child > :first-child,
.text-columns > :first-child > :first-child > :first-child {
  margin-block-start: 0;
}
.text-columns > li {
  break-inside: avoid;
}
.action-button {
  display: inline-block;
  padding: var(--gap-hairline) var(--gap-tiny);
  border-radius: var(--radius-large);
  text-decoration: none;
  --_btnbg: var(--color-interact-bg);
  --_btntext: var(--color-interact-text);
  --_btnfg: var(--color-interact-fg);
  border: none;
  background-color: var(--_btnbg);
  color: var(--_btntext);
  font-weight: var(--weight-medium);
  text-align: center;
  transition: all .08s ease;
}
.action-button.-primary {
  --_btnbg: var(--color-primary-bg);
  --_btntext: var(--color-primary-text);
  --_btnfg: var(--color-primary-fg);
  font-weight: var(--weight-heading);
}
.action-button.-secondary {
  --_btnbg: var(--color-alternate-bg);
  --_btntext: var(--color-alternate);
  --_btnfg: var(--color-alternate);
  font-weight: var(--weight-heading);
}
.action-button.-destructive {
  --_btnbg: var(--color-destructive-bg);
  --_btntext: var(--color-destructive-text);
  --_btnfg: var(--color-destructive-fg);
}
.action-button.-small {
  font-size: var(--size-small);
  padding: 0 var(--gap-hairline);
}
.action-button.-big {
  padding: var(--gap-tiny) var(--gap-small);
}
.action-button.-cta {
  padding: var(--gap-small) var(--gap);
  font-weight: var(--weight-medium);
  border-radius: var(--radius);
}
.action-button.-square {
  aspect-ratio: 1 / 1;
  height: calc(var(--rlh) + 2 * (var(--gap-hairline) + var(--border-width)));
  padding-inline: 0;
  box-sizing: border-box;
  align-content: center;
  text-align: center;
}
.action-button.-round {
  display: block;
  place-self: center;
  align-content: center;
  text-align: center;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
}
.action-button .lucide {
  display: inline;
  height: var(--rlh);
  max-width: none;
  width: var(--rlh);
  vertical-align: top;
}
.action-button:has(.lucide) {
  padding: calc(.15 * var(--rlh));
}
.action-button:is(:hover, :focus-visible) {
  background-color: lch(from var(--_btnbg) calc(l + 10) calc(c + 20) h);
  color: lch(from var(--_btntext) calc(l + 40) c h);
  box-shadow: var(--shadow) var(--color-shadow);
  scale: 1.1;
}
.cool-chip {
  padding: var(--gap-small) var(--gap-mid-small);
  border-radius: var(--radius-full);
  background: var(--color-box-bg);
  border: none;
  color: var(--color-box-text);
  font-weight: var(--weight-medium);
  text-decoration: none;
  transition: all 0.2s ease;
}
.cool-chip.-bg {
  background-color: var(--color-bg);
}
.cool-chip.-faded {
  background-color: var(--color-bg);
  color: var(--color-faded-text);
}
.cool-chip.-dark-bg {
  background-color: var(--color-fg);
  color: var(--color-bg);
}
.cool-chip.-invert-bg {
  background-color: var(--color-box-fg);
  color: var(--color-box-bg);
}
.cool-chip.-accent-bg {
  background-color: var(--color-accent-fg);
  color: var(--color-box-bg);
}
.cool-chip .cool-chip {
  display: block;
  margin-block: calc(var(--gap-tiny) - var(--gap-small));
  padding: calc(var(--gap-small) - var(--gap-tiny)) calc(var(--gap-mid-small) - var(--gap-tiny));
}
.cool-chip .cool-chip:last-child {
  margin-inline-end: calc(var(--gap-tiny) - var(--gap-mid-small));
}
.cool-chip .cool-chip:first-child {
  margin-inline-start: calc(var(--gap-tiny) - var(--gap-mid-small));
}
.cool-chip.-small {
  padding-block: var(--gap-tiny);
  padding-inline: var(--gap-small);
}
.cool-chip.-small .cool-chip.-small:last-child {
  margin-block: 0;
  padding: 0 calc(var(--gap-small) - var(--gap-tiny));
}
.cool-chip.-small .cool-chip.-small:last-child:last-child {
  margin-inline-end: calc(var(--gap-tiny) - var(--gap-small));
}
:is(.cool-chip.-interactive, a.cool-chip[href], button.cool-chip:not(:disabled)):hover,
:is(.cool-chip.-interactive, a.cool-chip[href], button.cool-chip:not(:disabled)):focus-visible {
  background: var(--color-interact-bg);
  color: var(--color-text);
}
.cool-chip.-active,
.cool-chip[aria-current],
.cool-chip[aria-selected] {
  background: var(--color-fg);
  color: var(--color-box-bg);
}
.no-underline:not(:hover, :focus-visible) {
  text-decoration: none;
}
.mailing-list-signup .title {
  font-size: var(--size-h2);
  margin: 0;
}
.mailing-list-signup .lede {
  font-size: var(--size-h3);
  margin-block-start: 0;
}
.mailing-list-signup .form {
  display: grid;
  grid-template: "email   submit" "consent consent" / 1fr auto;
  gap: var(--gap) var(--gap-large);
}
@media (max-width: 768px) {
  .mailing-list-signup .form {
    grid-template: "email" "submit" "consent";
  }
}
.mailing-list-signup .email {
  grid-area: email;
  background-color: var(--color-box-bg);
  padding: var(--gap) var(--gap);
  border: none;
  border-radius: var(--radius-small);
}
.mailing-list-signup .submit {
  grid-area: submit;
}
.mailing-list-signup .consent {
  grid-area: consent;
}
.color-dot {
  display: inline-block;
  background-color: var(--color-accent);
  width: .6em;
  height: .6em;
  border-radius: .5em;
  vertical-align: baseline;
}
.site-footer {
  margin-top: var(--gap-xlarge);
  padding-top: var(--gap);
  padding-bottom: var(--gap-large);
}
.site-footer .links {
  display: flex;
  flex-flow: column;
  justify-content: center;
  gap: var(--gap-small) var(--gap-large);
  margin-bottom: var(--gap);
}
.site-footer .links h3 {
  margin-block: var(--gap-small);
}
.site-footer .links a {
  text-decoration: none;
}
.site-footer .links a:hover {
  text-decoration: underline;
}
.site-footer .copyright {
  border-block-start: var(--border-thin);
  font-size: var(--size-small);
  padding-block: var(--gap);
  font-weight: 500;
}
.breadcrumbs {
  margin: var(--gap) 0;
}
.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
}
.breadcrumbs .breadcrumb-item {
  display: flex;
  align-items: center;
  color: var(--color-faded-text);
  font-size: var(--size-small);
}
.breadcrumbs .breadcrumb-item a {
  color: var(--color-accent-fg);
  text-decoration: none;
}
.breadcrumbs .breadcrumb-item a:hover {
  text-decoration: underline;
}
.breadcrumbs .breadcrumb-item:not(:last-child)::after {
  content: "/";
  margin: 0 var(--gap-small);
  color: var(--color-faded-fg);
}
.breadcrumbs .breadcrumb-item:last-child {
  color: inherit;
  font-weight: var(--weight-medium);
}
.x-container {
  margin: auto;
  padding: var(--gap-large);
  width: 100%;
  max-width: var(--length-medium);
}
@media (max-width: 768px) {
  .x-container {
    padding: var(--gap-large) var(--gap);
  }
}
.x-container.-narrow {
  max-width: var(--length-narrow);
}
.x-container.-wide {
  max-width: var(--length-wide);
}
.x-container.-fullwidth {
  max-width: 100%;
}
.search-dialog {
  background: lch(from var(--color-fg) l 100 h / 0.2);
  color: var(--color-box-bg);
  -webkit-backdrop-filter: hue-rotate(180deg) invert() blur(var(--gap)) brightness(0.6);
  backdrop-filter: hue-rotate(180deg) invert() blur(var(--gap)) brightness(0.6);
  border-radius: var(--radius);
  border: 1px solid #fff7;
  box-shadow: var(--shadow-big) var(--color-scrim-fg);
  padding: var(--gap);
  margin-block: calc(5 * var(--rlh));
  width: min(calc(100% - 2*var(--gap)), 40em);
}
.search-dialog form {
  display: flex;
  flex-flow: row wrap;
  justify-content: stretch;
  gap: var(--gap-small);
}
.search-dialog label {
  flex-grow: 1;
  display: grid;
}
.search-dialog label > * {
  grid-area: 1/1;
}
.search-dialog label span,
.search-dialog label input {
  padding: var(--gap-small) var(--gap);
}
.search-dialog label span {
  pointer-events: none;
  position: relative;
  z-index: 5;
  color: var(--color-faded-fg);
  font-style: italic;
}
.search-dialog label span:has(~ input:not(:placeholder-shown)) {
  opacity: 0;
}
.navbar-search-form {
  max-width: 600px;
  margin: 0 auto;
  display: none;
  align-items: center;
  background: var(--color-box-bg);
  border-radius: var(--radius-small);
  border: 1px solid var(--color-accent);
  overflow: hidden;
  width: 100%;
  margin-block: -2px;
}
@media (min-width: 992px) {
  .navbar-search-form {
    flex: 1 1 500px;
  }
}
.navbar-search-form .input {
  flex: 1;
  border: none;
  background: none;
  padding: var(--gap-small) var(--gap);
  font-size: var(--size-text);
  color: var(--color-box-text);
  outline: none;
}
.navbar-search-form .input:focus {
  outline: none;
}
.navbar-search-form .input::placeholder {
  color: var(--color-faded-fg);
}
.navbar-search-form .submit,
.navbar-search-form .close {
  background: none;
  border: none;
  padding: var(--gap-small);
  cursor: pointer;
  color: var(--color-accent-fg);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease;
  outline: none;
}
:is(.navbar-search-form .submit, .navbar-search-form .close):focus {
  outline: none;
}
:is(.navbar-search-form .submit, .navbar-search-form .close):hover,
:is(.navbar-search-form .submit, .navbar-search-form .close):focus-visible {
  background-color: var(--color-interact-bg);
}
:is(.navbar-search-form .submit, .navbar-search-form .close) svg {
  width: 1.2em;
  height: 1.2em;
}
.navbar-search-form .close {
  color: var(--color-faded-fg);
}
.navbar-search-form .close:hover,
.navbar-search-form .close:focus-visible {
  color: var(--color-destructive-fg);
}
.navbar-search-form :-moz-focusring {
  outline: none !important;
  box-shadow: none !important;
}
.nav-bar.-search .navbar-search-form {
  display: flex;
}
.nav-bar.-search .center,
.nav-bar.-search .right {
  display: none !important;
}
.lax-lines {
  line-height: 1.8;
}
.box {
  background: var(--color-box-bg);
  -webkit-backdrop-filter: blur(.5em);
  backdrop-filter: blur(.5em);
  border: var(--border) var(--color-faded-fg);
  border-radius: var(--radius);
  box-shadow: var(--shadow) var(--color-scrim-fg);
  padding: var(--gap);
  margin-block: var(--gap);
  transition: all .08s ease-in-out;
}
.box:has(.background) {
  position: relative;
  overflow: hidden;
  overflow: clip;
}
.box:has(.background) > * {
  z-index: 1;
}
.box .background {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  color: lch(12 10 249 / 60%);
  z-index: 0;
  pointer-events: none;
}
.box:is(:hover) {
  box-shadow: var(--shadow-big) var(--color-scrim-fg);
}
.box.-big {
  box-shadow: var(--shadow-big) var(--color-scrim-fg);
}
.box.-big:is(:hover) {
  box-shadow: var(--shadow-bigger) var(--color-scrim-fg);
}
.box.-warning {
  color: var(--color-alternate);
  background: var(--color-alternate-bg);
  --color-faded-fg: var(--color-alternate);
}
.box.-ribbon {
  border-inline: none;
  border-radius: 0;
}
.page-background {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -20;
  display: grid;
}
.page-background > * {
  grid-area: 1/1;
}
.page-background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.category-dialog {
  margin-block: 0;
  width: 100%;
  max-width: 400px;
}
.category-dialog::backdrop {
  background-color: rgba(0, 0, 0, 0.5);
}
.category-dialog .dialog-buttons {
  display: flex;
  justify-content: flex-end;
  gap: var(--gap-small);
  margin-top: var(--gap-small);
}
.category-dialog h2 {
  margin-top: 0;
  color: var(--color-accent-fg);
}
.category-selection select {
  flex: 1;
  min-width: 0;
}
.user-menu {
  display: flex;
  flex-direction: column;
  padding: var(--gap-small) 0;
  min-width: 180px;
}
.user-menu a,
.user-menu .\<a\> {
  padding: var(--gap-small) var(--gap);
  text-decoration: none;
  text-align: left;
  cursor: pointer;
  color: var(--color-accent-fg);
  font-weight: var(--weight-medium);
}
:is(.user-menu a, .user-menu .\<a\>):hover {
  background-color: var(--color-accent);
  color: var(--color-box-bg);
}
.category-menu {
  width: calc(100vw);
  height: 20em;
  max-height: 80vh;
  overflow-x: auto;
  background: var(--color-bg);
  border-block-end: var(--border) var(--color-fg);
  box-shadow: var(--shadow) var(--color-scrim-fg);
  padding: var(--gap-small);
}
.category-menu .body {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: var(--length-sidebar);
}
.category-menu .level {
  display: contents;
}
.category-menu .level > * {
  opacity: 1;
  transform-origin: top left;
  transition: all .2s ease;
}
@starting-style {
  .category-menu .level > * {
    opacity: 0;
    transform-origin: top left;
  }
}
.category-menu .column,
.category-menu .empty {
  padding-inline: var(--gap-small);
  margin-inline: var(--gap-small);
  margin: 0;
}
.level > :is(.category-menu .column, .category-menu .empty) {
  border-inline-start: none;
  border-end-start-radius: 0;
  border-start-start-radius: 0;
}
:is(.category-menu .column, .category-menu .empty):has(+ .level > *) {
  border-right: var(--border-thin) var(--color-faded-fg);
  border-end-end-radius: 0;
  border-start-end-radius: 0;
}
:is(.category-menu .column, .category-menu .empty) .name {
  padding-inline: var(--gap-tiny);
  margin-block-start: var(--gap-tiny);
  color: var(--color-faded-text);
}
:is(.category-menu .column, .category-menu .empty) .list {
  margin: 0;
  padding: 0;
}
:is(.category-menu .column, .category-menu .empty) .item {
  border-radius: var(--radius-small);
  list-style: none;
  display: flex;
  color: var(--color-text);
}
:is(.category-menu .column, .category-menu .empty) .item.-category::after {
  flex: 0 0 auto;
  content: "\23f5";
  padding-block: var(--gap-tiny);
}
:is(.category-menu .column, .category-menu .empty) .item a {
  flex: 1 0 auto;
  display: block;
  padding: var(--gap-tiny);
  max-width: 100%;
  text-decoration: none;
}
:is(.category-menu .column, .category-menu .empty) .item:hover {
  background: var(--color-faded-fg);
}
.category-menu .empty {
  display: block;
  padding: var(--gap);
  margin: 0;
  color: var(--color-faded-text);
  font-style: italic;
}
.me-link {
  color: var(--color-accent-fg);
  font-weight: var(--weight-medium);
}
.app-logo:hover {
  filter: drop-shadow(0 0 .2em lch(from var(--color-accent) l c h / .5));
}
.app-logo img {
  height: var(--rlh);
  width: auto;
  object-fit: contain;
  vertical-align: bottom;
}
.basic-form {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--gap);
  margin-block: var(--gap);
}
@media (max-width: 768px) {
  .basic-form {
    grid-template-columns: 1fr;
    gap: var(--gap-small);
  }
}
.basic-form > p,
.basic-form > div {
  display: grid;
  grid-column: 1/-1;
  grid-template-columns: subgrid;
  margin: 0;
  position: relative;
}
:is(.basic-form > p, .basic-form > div):has(button:not([type]), [type=submit]) {
  display: flex;
  gap: var(--gap-small);
}
:is(.basic-form > p, .basic-form > div) > * {
  grid-column: 2;
}
:is(.basic-form > p, .basic-form > div) > label {
  grid-column: 1;
  padding-block: var(--gap-tiny);
  padding-inline: 0 var(--gap);
}
.basic-form.-column {
  grid-template-columns: 1fr;
  gap: var(--gap-small);
}
.basic-form.-column > :is(p, div) > * {
  grid-column: 1;
}
.basic-form.-boldlabels label {
  font-weight: var(--weight-heading);
}
.oauth-login {
  margin-top: var(--gap);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.oauth-login .divider {
  display: flex;
  align-items: center;
  margin: var(--gap-small) 0;
  color: var(--color-faded-text);
}
.oauth-login .divider::before,
.oauth-login .divider::after {
  content: "";
  flex: 1;
  border-bottom: var(--border-thin) var(--color-faded-fg);
  margin: 0 var(--gap-small);
}
.oauth-login .google-login-button {
  width: 100%;
  text-decoration: none;
  display: flex;
  flex-flow: row;
  align-items: center;
  justify-content: center;
  gap: var(--gap-small);
  padding-block: calc(1.5 * var(--gap-tiny));
  color: var(--color-box-text);
}
.oauth-login .google-login-button img {
  width: 20px;
  height: 20px;
}
.oauth-login .google-login-button:hover {
  background: var(--color-interact-bg);
  box-shadow: none;
}
.info-chip {
  display: inline-block;
  border-radius: var(--radius-full);
  background: var(--color-complement-bg);
  color: var(--color-complement-fg);
  font-size: var(--size-small);
  padding: .1em .3em;
}
.team-card {
  padding: var(--gap-large);
  text-align: center;
}
.team-card:has(.icon) {
  padding-block-start: var(--gap-small);
}
.team-card .icon {
  color: var(--color-accent);
  display: block;
  width: 4rem;
  height: 4rem;
  margin: var(--gap) auto;
  align-content: center;
  border-radius: var(--radius-full);
  border: var(--border-thin) var(--color-complement);
}
.team-card .icon svg,
.team-card .icon img {
  display: block;
  margin: auto;
  max-width: 3em;
  max-height: 2em;
  filter: invert(1);
}
.team-card .title {
  color: var(--color-accent-fg);
  margin-top: 0;
  margin-bottom: var(--gap-small);
  font-family: var(--font-display);
  font-size: var(--size-h3);
  text-shadow: -1px -1px 0 var(--color-scrim-fg), 1px 1px 0 lch(from var(--color-text) calc(100 - l) c h / 100%);
}
.team-card p {
  margin: 0;
}
.particle-effect {
  overflow: hidden;
  overflow: clip;
  position: relative;
  filter: blur(1px);
  color: var(--color-accent-fg);
}
.particle-effect,
.particle-effect .layer,
.particle-effect .layer::after {
  width: 100%;
  height: 100%;
}
.particle-effect .layer::after {
  position: absolute;
  content: "";
  box-shadow:
    0 0,
    52.422vmax 65.781vmax,
    97.852vmax 89.570vmax,
    73.164vmax 13.555vmax,
    88.047vmax 44.844vmax,
    25.938vmax 47.539vmax,
    82.969vmax 17.734vmax,
    2.500vmax 42.500vmax,
    53.164vmax 89.609vmax,
    22.109vmax 58.203vmax,
    15.820vmax 5.469vmax,
    30.703vmax 2.031vmax,
    33.438vmax 35.820vmax,
    36.797vmax 88.984vmax,
    99.570vmax 5.039vmax,
    35.664vmax 32.773vmax,
    31.563vmax 21.445vmax,
    6.680vmax 67.070vmax,
    75.547vmax 22.461vmax,
    23.477vmax 61.602vmax,
    20.156vmax 52.461vmax,
    52.852vmax 89.961vmax,
    30.742vmax 77.969vmax,
    49.063vmax 31.016vmax,
    21.250vmax 64.219vmax,
    83.867vmax 20.820vmax,
    66.914vmax 92.266vmax,
    85.234vmax 63.359vmax,
    60.820vmax 26.914vmax,
    40.469vmax 67.813vmax,
    13.828vmax 97.070vmax,
    57.813vmax 5.273vmax,
    97.383vmax 85.117vmax,
    18.008vmax 20.195vmax,
    13.398vmax 27.656vmax,
    25.898vmax 72.305vmax,
    7.383vmax 29.805vmax,
    16.250vmax 48.789vmax,
    90.586vmax 73.438vmax,
    79.063vmax 88.672vmax,
    12.891vmax 22.773vmax,
    24.102vmax 24.883vmax,
    12.109vmax 80.625vmax,
    26.133vmax 46.289vmax,
    67.539vmax 83.320vmax,
    29.883vmax 6.328vmax,
    61.680vmax 9.766vmax,
    5.547vmax 95.898vmax,
    86.875vmax 13.047vmax,
    46.133vmax 77.344vmax,
    15.703vmax 44.492vmax,
    87.695vmax 84.492vmax,
    84.141vmax 88.633vmax,
    77.344vmax 61.289vmax,
    7.188vmax 73.750vmax,
    92.070vmax 56.211vmax,
    55.703vmax 22.461vmax,
    18.945vmax 40.586vmax,
    38.555vmax 28.008vmax,
    97.578vmax 68.906vmax,
    89.297vmax 2.852vmax,
    2.773vmax 15.625vmax,
    91.016vmax 32.695vmax,
    94.219vmax 56.172vmax,
    10.000vmax 58.711vmax,
    98.320vmax 96.211vmax,
    7.773vmax 86.680vmax,
    37.148vmax 55.781vmax,
    4.805vmax 57.383vmax,
    69.883vmax 11.133vmax,
    77.930vmax 83.125vmax,
    62.852vmax 64.531vmax,
    79.492vmax 2.617vmax,
    47.773vmax 58.906vmax,
    59.609vmax 85.234vmax,
    97.734vmax 74.727vmax,
    99.727vmax 9.883vmax,
    72.266vmax 97.773vmax,
    3.945vmax 92.422vmax,
    64.141vmax 80.508vmax,
    17.500vmax 76.875vmax,
    52.188vmax 3.867vmax,
    42.070vmax 17.422vmax,
    10.078vmax 48.164vmax,
    57.578vmax 16.797vmax,
    65.117vmax 32.031vmax,
    76.680vmax 25.820vmax,
    8.164vmax 99.922vmax,
    28.203vmax 64.688vmax,
    49.219vmax 1.445vmax,
    15.234vmax 18.438vmax,
    81.133vmax 61.445vmax,
    84.727vmax 99.375vmax,
    37.930vmax 15.313vmax,
    18.125vmax 81.719vmax,
    38.984vmax 8.828vmax,
    1.484vmax 90.352vmax,
    35.078vmax 49.492vmax,
    18.320vmax 22.500vmax,
    35.938vmax 55.547vmax,
    11.445vmax 78.828vmax,
    25.547vmax 95.195vmax,
    67.422vmax 44.688vmax,
    92.930vmax 42.422vmax,
    23.359vmax 35.547vmax,
    33.359vmax 87.734vmax,
    53.438vmax 1.836vmax,
    48.125vmax 52.188vmax,
    29.688vmax 42.148vmax,
    86.563vmax 37.070vmax,
    48.125vmax 39.844vmax,
    71.406vmax 37.930vmax,
    89.219vmax 39.609vmax,
    30.000vmax 48.906vmax,
    24.648vmax 3.945vmax,
    66.211vmax 52.227vmax,
    13.359vmax 83.477vmax,
    31.289vmax 27.891vmax,
    67.070vmax 37.813vmax,
    75.195vmax 28.203vmax,
    45.742vmax 96.016vmax,
    73.125vmax 20.625vmax,
    98.672vmax 39.883vmax,
    43.594vmax 52.891vmax,
    92.109vmax 37.422vmax,
    7.773vmax 77.617vmax,
    65.469vmax 73.789vmax,
    50.898vmax 7.539vmax,
    37.461vmax 77.422vmax,
    49.336vmax 74.727vmax,
    66.211vmax 11.602vmax,
    19.336vmax 39.844vmax,
    86.211vmax 2.500vmax,
    67.148vmax 98.672vmax,
    83.008vmax 84.219vmax,
    32.461vmax 14.492vmax,
    96.914vmax 3.438vmax,
    98.984vmax 76.523vmax,
    5.820vmax 31.445vmax,
    7.070vmax 7.344vmax,
    87.930vmax 25.078vmax,
    86.563vmax 75.664vmax,
    69.648vmax 87.344vmax,
    47.930vmax 62.500vmax,
    11.367vmax 82.500vmax,
    95.430vmax 22.383vmax,
    90.117vmax 17.461vmax,
    81.875vmax 45.625vmax,
    86.016vmax 21.875vmax,
    61.172vmax 72.734vmax,
    59.492vmax 28.633vmax,
    49.297vmax 13.164vmax,
    45.508vmax 93.594vmax,
    32.305vmax 95.898vmax,
    48.477vmax 57.617vmax,
    24.648vmax 87.500vmax,
    83.164vmax 55.391vmax,
    34.180vmax 41.836vmax,
    46.641vmax 65.742vmax,
    40.273vmax 65.586vmax,
    60.156vmax 43.086vmax,
    47.539vmax 7.461vmax,
    2.188vmax 55.859vmax,
    89.648vmax 84.453vmax,
    31.484vmax 30.625vmax,
    3.867vmax 1.719vmax,
    79.531vmax 74.883vmax,
    33.242vmax 11.406vmax,
    12.148vmax 99.688vmax,
    83.750vmax 99.102vmax,
    60.859vmax 90.820vmax,
    84.766vmax 75.156vmax,
    93.750vmax 6.484vmax,
    64.688vmax 86.875vmax,
    48.477vmax 71.563vmax,
    12.813vmax 19.375vmax,
    63.906vmax 83.398vmax,
    41.992vmax 71.523vmax,
    91.563vmax 21.484vmax,
    73.125vmax 45.938vmax,
    48.633vmax 58.906vmax,
    34.766vmax 49.375vmax,
    71.133vmax 49.648vmax,
    87.813vmax 20.859vmax,
    55.859vmax 21.992vmax,
    9.180vmax 46.680vmax,
    75.703vmax 59.883vmax,
    75.625vmax 32.383vmax,
    16.094vmax 23.828vmax,
    44.414vmax 19.727vmax,
    69.180vmax 28.633vmax,
    27.422vmax 38.047vmax,
    88.633vmax 74.258vmax,
    85.313vmax 19.766vmax,
    31.680vmax 99.531vmax,
    4.063vmax 80.703vmax,
    20.938vmax 99.180vmax,
    94.883vmax 57.617vmax,
    2.734vmax 47.813vmax,
    48.359vmax 21.797vmax,
    70.000vmax 50.313vmax,
    55.547vmax 91.875vmax,
    65.508vmax 48.438vmax,
    90.938vmax 4.375vmax,
    9.297vmax 38.438vmax,
    39.961vmax 70.000vmax,
    67.461vmax 69.414vmax,
    91.758vmax 48.867vmax,
    82.461vmax 16.133vmax,
    42.422vmax 46.250vmax,
    47.148vmax 2.109vmax,
    68.984vmax 6.563vmax,
    25.156vmax 90.938vmax,
    7.773vmax 91.094vmax,
    48.984vmax 91.992vmax,
    10.703vmax 69.883vmax,
    59.297vmax 97.500vmax,
    97.305vmax 36.406vmax,
    17.031vmax 4.258vmax,
    71.484vmax 58.594vmax,
    41.211vmax 39.375vmax,
    14.766vmax 24.336vmax,
    81.250vmax 79.844vmax,
    10.156vmax 29.414vmax,
    81.914vmax 52.695vmax,
    87.383vmax 7.695vmax,
    71.641vmax 6.914vmax,
    93.984vmax 30.898vmax,
    67.305vmax 8.281vmax,
    35.781vmax 54.961vmax,
    14.414vmax 80.898vmax,
    28.672vmax 74.766vmax,
    16.680vmax 61.328vmax,
    7.656vmax 37.070vmax,
    7.500vmax 93.906vmax,
    43.008vmax 12.266vmax,
    61.602vmax 78.867vmax,
    30.234vmax 75.742vmax,
    64.688vmax 13.633vmax,
    4.258vmax 23.828vmax,
    20.625vmax 70.273vmax,
    33.281vmax 28.359vmax,
    94.375vmax 77.656vmax,
    40.391vmax 45.391vmax,
    82.773vmax 41.523vmax,
    1.641vmax 27.930vmax,
    85.703vmax 97.461vmax,
    13.008vmax 30.234vmax,
    45.938vmax 53.984vmax,
    38.398vmax 87.500vmax,
    1.211vmax 97.578vmax,
    59.219vmax 60.781vmax,
    74.531vmax 57.617vmax,
    23.242vmax 71.094vmax,
    8.203vmax 25.625vmax,
    21.367vmax 95.742vmax,
    87.031vmax 40.195vmax,
    98.164vmax 87.891vmax,
    61.836vmax 61.797vmax,
    72.031vmax 21.289vmax,
    73.086vmax 16.328vmax,
    37.813vmax 88.047vmax,
    18.203vmax 45.078vmax,
    28.398vmax 87.500vmax,
    28.125vmax 78.320vmax,
    76.875vmax 54.609vmax,
    43.398vmax 78.477vmax,
    25.547vmax 83.906vmax,
    39.180vmax 53.164vmax,
    76.992vmax 54.414vmax,
    98.867vmax 95.430vmax,
    35.625vmax 62.656vmax,
    12.617vmax 65.000vmax,
    95.586vmax 36.445vmax,
    21.875vmax 94.609vmax,
    78.281vmax 7.578vmax,
    26.133vmax 38.867vmax,
    46.836vmax 65.820vmax,
    23.516vmax 1.680vmax,
    38.594vmax 49.609vmax,
    20.898vmax 40.195vmax,
    92.617vmax 44.023vmax,
    14.531vmax 47.773vmax,
    99.570vmax 84.023vmax,
    18.906vmax 89.023vmax,
    52.578vmax 35.781vmax,
    14.648vmax 56.406vmax,
    49.297vmax 54.336vmax,
    84.297vmax 96.797vmax,
    48.984vmax 30.938vmax,
    33.867vmax 20.313vmax,
    83.750vmax 92.813vmax,
    57.695vmax 39.883vmax,
    99.180vmax 76.484vmax,
    78.789vmax 27.422vmax,
    7.852vmax 75.898vmax,
    61.445vmax 30.313vmax,
    0.547vmax 88.477vmax,
    83.555vmax 50.430vmax,
    24.258vmax 64.102vmax,
    11.680vmax 84.141vmax,
    16.914vmax 87.891vmax,
    40.508vmax 9.492vmax,
    81.797vmax 31.289vmax,
    4.609vmax 38.672vmax,
    71.992vmax 34.297vmax,
    97.656vmax 49.961vmax,
    81.914vmax 87.734vmax,
    79.883vmax 2.734vmax,
    49.766vmax 57.813vmax,
    37.578vmax 26.328vmax,
    97.539vmax 6.250vmax,
    98.281vmax 10.859vmax,
    32.852vmax 80.078vmax,
    43.750vmax 36.875vmax,
    63.984vmax 26.484vmax,
    98.086vmax 63.945vmax,
    67.461vmax 53.320vmax,
    82.031vmax 63.242vmax,
    19.766vmax 2.031vmax,
    17.266vmax 31.914vmax,
    68.477vmax 99.883vmax,
    68.398vmax 87.383vmax,
    81.406vmax 27.617vmax,
    28.867vmax 89.570vmax,
    98.750vmax 11.484vmax,
    70.508vmax 12.344vmax,
    18.633vmax 82.227vmax,
    14.414vmax 97.148vmax,
    73.281vmax 32.266vmax,
    18.359vmax 61.953vmax,
    6.172vmax 57.500vmax,
    14.844vmax 96.836vmax,
    40.000vmax 63.594vmax,
    22.852vmax 66.680vmax,
    32.813vmax 48.477vmax,
    80.156vmax 37.617vmax,
    93.359vmax 3.672vmax,
    25.781vmax 73.242vmax,
    39.844vmax 24.727vmax,
    15.977vmax 13.867vmax,
    42.539vmax 39.531vmax,
    22.773vmax 35.117vmax,
    15.156vmax 41.875vmax,
    2.695vmax 68.438vmax,
    72.344vmax 44.375vmax,
    28.164vmax 28.203vmax,
    60.586vmax 86.094vmax,
    4.336vmax 96.680vmax,
    41.797vmax 76.328vmax,
    3.750vmax 81.875vmax,
    18.203vmax 48.945vmax,
    25.938vmax 14.063vmax,
    5.586vmax 43.789vmax,
    70.039vmax 50.820vmax,
    25.273vmax 7.305vmax,
    80.039vmax 87.383vmax,
    23.281vmax 31.992vmax,
    55.156vmax 85.938vmax,
    10.625vmax 7.227vmax,
    42.461vmax 85.938vmax,
    46.289vmax 13.359vmax,
    90.508vmax 12.891vmax,
    0.742vmax 3.359vmax,
    35.508vmax 86.953vmax,
    81.367vmax 29.688vmax,
    94.844vmax 63.516vmax,
    97.930vmax 35.664vmax,
    67.109vmax 33.750vmax,
    45.898vmax 15.703vmax,
    21.836vmax 5.117vmax,
    71.836vmax 50.195vmax,
    91.641vmax 67.930vmax,
    70.234vmax 53.477vmax,
    88.594vmax 60.039vmax,
    17.891vmax 23.984vmax,
    93.086vmax 49.492vmax,
    36.211vmax 84.492vmax,
    62.656vmax 79.531vmax,
    10.156vmax 99.336vmax,
    76.289vmax 31.406vmax,
    39.453vmax 36.719vmax,
    43.984vmax 25.313vmax,
    84.922vmax 69.375vmax,
    74.258vmax 41.055vmax,
    77.656vmax 11.641vmax,
    33.711vmax 75.547vmax,
    31.211vmax 91.289vmax,
    30.859vmax 74.727vmax,
    91.641vmax 28.438vmax,
    54.375vmax 0.195vmax,
    65.703vmax 15.664vmax,
    23.945vmax 65.859vmax,
    39.805vmax 65.898vmax,
    3.164vmax 83.008vmax,
    96.680vmax 78.711vmax,
    12.148vmax 79.141vmax,
    62.227vmax 96.875vmax,
    27.969vmax 16.602vmax,
    55.313vmax 52.188vmax,
    81.250vmax 84.336vmax,
    66.602vmax 63.398vmax,
    7.148vmax 32.734vmax,
    54.375vmax 57.773vmax,
    80.625vmax 94.609vmax,
    81.992vmax 9.023vmax,
    51.094vmax 85.352vmax,
    23.047vmax 22.266vmax,
    28.164vmax 95.508vmax,
    26.016vmax 12.109vmax,
    62.852vmax 94.727vmax,
    56.289vmax 47.266vmax,
    69.336vmax 88.750vmax,
    0.664vmax 69.297vmax,
    98.086vmax 43.594vmax,
    23.047vmax 83.711vmax,
    51.719vmax 45.430vmax,
    3.164vmax 63.516vmax,
    6.523vmax 7.148vmax,
    17.969vmax 6.016vmax,
    75.352vmax 16.797vmax,
    45.430vmax 58.828vmax,
    28.438vmax 90.039vmax,
    51.797vmax 95.547vmax,
    12.734vmax 88.477vmax,
    95.625vmax 96.523vmax,
    41.484vmax 65.508vmax,
    31.523vmax 80.547vmax,
    62.773vmax 43.984vmax,
    28.438vmax 30.859vmax,
    19.063vmax 87.695vmax,
    66.641vmax 25.039vmax,
    66.484vmax 73.516vmax,
    42.539vmax 95.195vmax,
    83.984vmax 9.922vmax,
    21.758vmax 60.547vmax,
    73.555vmax 77.148vmax,
    55.742vmax 54.258vmax,
    66.680vmax 73.398vmax,
    53.633vmax 29.180vmax,
    49.570vmax 47.539vmax,
    8.477vmax 72.773vmax,
    88.594vmax 15.313vmax,
    36.797vmax 59.922vmax,
    79.609vmax 89.414vmax,
    79.375vmax 23.516vmax,
    68.125vmax 29.688vmax,
    88.320vmax 26.719vmax,
    49.180vmax 68.672vmax,
    67.461vmax 80.703vmax,
    23.398vmax 34.805vmax,
    23.867vmax 76.055vmax,
    58.359vmax 80.234vmax,
    26.367vmax 0.391vmax,
    62.227vmax 65.977vmax,
    51.836vmax 25.000vmax,
    80.781vmax 63.320vmax,
    27.539vmax 23.984vmax,
    72.109vmax 44.141vmax,
    4.883vmax 49.102vmax,
    97.734vmax 96.563vmax,
    7.813vmax 61.055vmax,
    59.531vmax 25.039vmax,
    91.836vmax 30.391vmax,
    56.797vmax 80.586vmax,
    38.672vmax 88.828vmax,
    74.688vmax 29.063vmax,
    82.852vmax 28.359vmax,
    82.031vmax 61.523vmax,
    16.289vmax 61.719vmax,
    43.594vmax 23.984vmax,
    69.844vmax 67.422vmax,
    50.625vmax 81.563vmax,
    59.492vmax 81.680vmax,
    48.906vmax 95.586vmax,
    72.813vmax 60.898vmax,
    57.461vmax 41.875vmax,
    69.453vmax 32.109vmax,
    74.844vmax 20.859vmax,
    78.516vmax 28.203vmax,
    71.875vmax 33.945vmax,
    25.156vmax 63.164vmax,
    87.852vmax 79.648vmax,
    87.070vmax 75.313vmax,
    73.750vmax 16.406vmax,
    26.758vmax 36.445vmax,
    43.242vmax 27.383vmax,
    73.281vmax 71.680vmax,
    28.164vmax 98.906vmax,
    75.586vmax 87.656vmax,
    38.398vmax 52.344vmax,
    1.523vmax 27.578vmax,
    91.289vmax 3.789vmax,
    99.688vmax 9.570vmax,
    49.688vmax 94.844vmax,
    6.992vmax 71.406vmax,
    74.727vmax 61.250vmax,
    8.203vmax 1.836vmax,
    89.570vmax 33.711vmax,
    9.922vmax 28.281vmax,
    57.422vmax 53.086vmax,
    12.969vmax 58.242vmax,
    90.273vmax 11.758vmax,
    57.813vmax 100.000vmax,
    9.805vmax 3.750vmax,
    63.242vmax 85.000vmax,
    96.445vmax 40.547vmax,
    70.039vmax 89.375vmax,
    11.094vmax 74.375vmax,
    33.203vmax 32.852vmax,
    65.938vmax 68.438vmax,
    7.500vmax 35.898vmax,
    18.438vmax 18.750vmax,
    4.727vmax 4.180vmax,
    64.570vmax 57.891vmax,
    4.258vmax 78.477vmax,
    2.891vmax 28.555vmax,
    12.305vmax 36.992vmax,
    2.500vmax 32.578vmax,
    37.383vmax 84.766vmax,
    12.734vmax 87.461vmax,
    3.711vmax 76.992vmax,
    45.859vmax 63.125vmax,
    30.469vmax 5.938vmax,
    62.031vmax 15.781vmax,
    2.656vmax 99.219vmax,
    29.258vmax 3.047vmax,
    9.219vmax 91.836vmax,
    18.633vmax 64.453vmax,
    17.188vmax 32.109vmax,
    47.070vmax 83.633vmax,
    22.891vmax 15.742vmax,
    37.188vmax 3.516vmax,
    31.055vmax 46.992vmax,
    81.406vmax 39.023vmax,
    24.883vmax 43.281vmax,
    70.039vmax 1.289vmax,
    91.406vmax 58.047vmax,
    8.242vmax 90.234vmax,
    96.992vmax 81.602vmax,
    88.555vmax 57.422vmax,
    17.109vmax 87.773vmax,
    8.164vmax 69.414vmax,
    93.633vmax 89.609vmax,
    84.531vmax 3.906vmax,
    0.078vmax 99.922vmax,
    3.086vmax 58.750vmax,
    7.070vmax 64.766vmax,
    62.813vmax 82.227vmax,
    29.883vmax 25.391vmax,
    93.047vmax 91.953vmax,
    65.938vmax 89.258vmax,
    57.773vmax 6.055vmax,
    24.844vmax 99.688vmax,
    24.141vmax 63.789vmax,
    75.391vmax 4.219vmax,
    22.109vmax 84.570vmax,
    76.602vmax 39.336vmax,
    97.539vmax 87.695vmax,
    28.711vmax 72.461vmax,
    87.305vmax 86.055vmax,
    46.445vmax 40.078vmax,
    18.242vmax 92.305vmax,
    81.211vmax 96.250vmax,
    66.367vmax 84.219vmax,
    17.656vmax 12.422vmax,
    38.203vmax 42.773vmax,
    78.164vmax 5.781vmax,
    96.641vmax 51.445vmax,
    77.461vmax 86.563vmax,
    80.469vmax 49.141vmax,
    53.086vmax 10.352vmax,
    81.563vmax 50.000vmax,
    90.391vmax 64.883vmax,
    61.680vmax 0.820vmax,
    6.680vmax 51.133vmax,
    11.484vmax 87.344vmax,
    36.133vmax 41.563vmax,
    88.633vmax 63.633vmax,
    0.430vmax 13.984vmax,
    31.563vmax 15.039vmax,
    70.938vmax 5.000vmax,
    18.633vmax 12.070vmax,
    77.852vmax 83.047vmax,
    49.063vmax 81.836vmax,
    54.492vmax 49.414vmax,
    36.875vmax 93.711vmax,
    91.602vmax 97.500vmax,
    53.086vmax 72.500vmax,
    63.594vmax 61.758vmax,
    57.695vmax 30.352vmax,
    61.016vmax 55.547vmax,
    10.313vmax 27.070vmax,
    87.656vmax 0.820vmax,
    53.594vmax 33.359vmax,
    63.086vmax 60.039vmax,
    58.750vmax 92.617vmax,
    57.227vmax 59.297vmax,
    51.367vmax 69.609vmax,
    23.047vmax 38.906vmax,
    74.648vmax 15.273vmax;
}
.particle-effect .layer:nth-child(1)::after {
  width: 1px;
  height: 1px;
  animation: particles 60s linear infinite;
}
.particle-effect .layer:nth-child(2)::after {
  width: 2px;
  height: 2px;
  animation: particles 120s linear infinite;
}
.particle-effect .layer:nth-child(3)::after {
  width: 3px;
  height: 3px;
  animation: particles 180s linear infinite;
}
.rune-pattern {
  font-size: 3em;
  font-weight: bold;
  width: 100%;
  height: 100%;
  color: var(--color-scrim-fg);
}
.rune-pattern text {
  fill: currentColor;
}
.knot-pattern {
  width: round(down, 100%, 2em);
  height: round(down, 100%, 2em);
  margin-inline: auto;
  display: grid;
  grid-template-rows: 2em 1fr 2em;
  grid-template-columns: 2em 1fr 2em;
}
.knot-pattern .edge,
.knot-pattern .corner {
  font-size: 1rem;
  line-height: 1rem;
  font-family: Knots;
  color: #a16910;
  background: var(--color-box-bg);
}
.knot-pattern .corner {
  margin: 0;
}
.knot-pattern .edge {
  width: 100%;
  overflow: hidden;
  overflow: clip;
  position: relative;
}
.knot-pattern .edge.-h {
  height: 2rem;
}
.knot-pattern .edge.-h::before {
  display: block;
  content: "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c";
  position: absolute;
  width: 0%;
  overflow: visible;
}
.knot-pattern .edge.-h::after {
  display: block;
  content: "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534";
  position: absolute;
  bottom: 0;
  width: 0%;
  overflow: visible;
}
.knot-pattern .edge.-v::after {
  display: block;
  position: absolute;
  content: "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a" "\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a\251c\2524\a";
}
.knot-pattern .middle {
  align-self: stretch;
  overflow: auto;
}
.knot-border {
  display: grid;
  grid-template-columns: 2em 1fr 2em;
  max-width: 100%;
  overflow: hidden;
  overflow: clip;
}
.knot-border.-top {
  padding-block-end: 2em;
}
.knot-border.-bottom {
  padding-block-start: 2em;
}
.knot-border .corner {
  width: 2em;
  height: 2em;
  border: var(--border) var(--color-bg);
  background: linear-gradient(var(--color-faded-fg), var(--color-faded-fg)), var(--color-bg);
  z-index: 1;
  text-align: center;
}
.-top :is(.knot-border .corner) {
  transform: rotate(-45deg) scale(4, 1.5);
}
.-top :is(.knot-border .corner) ~ :is(.-top :is(.knot-border .corner)) {
  transform: rotate(45deg) scale(4, 1.5);
}
.-bottom :is(.knot-border .corner) {
  transform: rotate(45deg) scale(4, 1.5);
}
.-bottom :is(.knot-border .corner) ~ :is(.-bottom :is(.knot-border .corner)) {
  transform: rotate(-45deg) scale(4, 1.5);
}
.knot-border .corner .rune {
  display: inline-block;
  transform: scaleX(.25);
  color: var(--color-complement);
  text-shadow: 0 0 2px var(--color-complement);
  font-weight: bold;
}
.knot-border .edge {
  font-size: 1rem;
  line-height: 1rem;
  font-family: Knots;
  color: var(--color-faded-fg);
  background: var(--color-box-bg);
  width: 100%;
  height: 2rem;
  overflow: hidden;
  overflow: clip;
  position: relative;
}
.knot-border .edge::before {
  display: block;
  content: "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c" "\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c\252c";
  position: absolute;
  width: 0%;
  overflow: visible;
}
.knot-border .edge::after {
  display: block;
  content: "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534" "\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534\2534";
  position: absolute;
  bottom: 0;
  width: 0%;
  overflow: visible;
}
.rune-border-pattern {
  width: 100%;
  height: 100%;
  opacity: .4;
  filter: drop-shadow(0 0 .2em var(--color-complement));
}
.box:hover .rune-border-pattern {
  opacity: 1;
  filter: drop-shadow(0 0 1em var(--color-complement)) drop-shadow(0 0 .5em var(--color-complement));
}
.roving-glow-border {
  border-radius: var(--radius);
  position: relative;
  overflow: hidden;
  overflow: clip;
  padding: var(--border-width);
  background: var(--color-faded-fg);
  --_glow: var(--color-accent);
  --_size: 24rem;
}
.roving-glow-border::before {
  content: "";
  position: absolute;
  width: var(--_size);
  height: var(--_size);
  background:
    radial-gradient(
      in lch circle at center right,
      var(--_glow) 0%,
      transparent 70%);
  filter: blur(4px);
  opacity: .4;
  offset-path: xywh(0 0 100% 100% round var(--radius-full));
  offset-distance: 0%;
  offset-anchor: center right;
  animation: move-glow 16s linear infinite;
}
.roving-glow-border > * {
  border-radius: calc(var(--radius) - var(--border-width));
  position: relative;
  z-index: 1;
}
.aurora-borealis {
  --stripes:
    repeating-linear-gradient(
      
      90deg,
      var(--color-bg) 0% 7%,
      transparent 10%,
      transparent 12%,
      var(--color-bg) 16% );
  --aurora-borealis:
    repeating-linear-gradient(
      
      90deg,
      #14e81e80 10%,
      #00ea8d80 15%,
      #017ed580 20%,
      #b53dff80 25%,
      #8d00c480 30% );
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  mix-blend-mode: lighten;
  background:
    var(--stripes),
    var(--aurora-borealis),
    var(--color-bg);
  background-size: 300%, 200%;
  background-position: 50% 50%, 50% 50%;
  filter: blur(20px) saturate(200%);
  mask-image:
    radial-gradient(
      ellipse at top right,
      var(--color-bg),
      transparent 65%,
      var(--color-bg) 100%);
  -webkit-mask-image:
    radial-gradient(
      ellipse at top right,
      var(--color-bg),
      transparent 65%,
      var(--color-bg) 100%);
}
.aurora-borealis::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--stripes), var(--aurora-borealis);
  background-size: 200%, 100%;
  animation: aurora 120s linear infinite;
  mix-blend-mode: difference;
}
:is(.category-page, .course-type-page, .category-all-page) .header .title {
  font-size: var(--size-h1);
  margin-bottom: var(--gap-tiny);
  color: var(--color-accent-fg);
}
:is(.category-page, .course-type-page, .category-all-page) .coursecount {
  color: var(--color-faded-text);
  margin-block: var(--gap-large);
}
.category-filters,
.type-filters {
  display: flex;
  flex-flow: row wrap;
  gap: var(--gap-small);
  margin-block: var(--gap);
}
:is(.category-filters, .type-filters) .title {
  font-size: var(--size-text);
  font-weight: var(--weight-medium);
  margin: 0;
}
:is(.category-filters, .type-filters) .filters {
  display: contents;
  list-style: none;
  padding-inline-start: 0;
}
:is(.category-filters, .type-filters) .filter {
  border: var(--border-thin) var(--color-fg);
  border-radius: var(--radius-small);
  box-shadow: var(--shadow-small) var(--color-scrim-fg);
  background: var(--color-accent-bg);
  color: var(--color-accent-fg);
  padding: 0 var(--gap-tiny);
  transition: all .08s ease;
}
:is(.category-filters, .type-filters) .filter:hover,
:is(.category-filters, .type-filters) .filter:focus-visible {
  box-shadow: var(--shadow) var(--color-scrim-fg);
}
:is(.category-filters, .type-filters) .categorylink,
:is(.category-filters, .type-filters) .typelink {
  text-decoration: none;
}
:is(:is(.category-filters, .type-filters) .categorylink, :is(.category-filters, .type-filters) .typelink).selected {
  font-weight: var(--weight-medium);
  color: var(--color-accent);
}
.course-submodules {
  padding-block: 0;
}
.low-capacity {
  color: var(--color-alternate);
  font-weight: bold;
  margin-inline-start: var(--gap-small);
}
@media (max-width: 1024px) {
  .low-capacity {
    display: block;
    margin-inline-start: 0;
    margin-block-start: var(--gap-small);
  }
}
.low-capacity .meter {
  display: inline-block;
  height: calc(.7 * var(--rlh));
  border: var(--border) var(--color-alternate);
  box-shadow: 0 0 0 var(--border-width) var(--color-bg) inset;
  min-width: 8em;
  border-radius: var(--radius-small);
  color: var(--color-field-bg);
  padding-inline: var(--gap-tiny);
  margin-inline-end: var(--gap-tiny);
  vertical-align: middle;
}
.cool-cta {
  border-radius: var(--radius);
  transition: all .08s ease;
  display: inline-block;
}
.cool-cta:hover,
.cool-cta:has(:focus-visible) {
  box-shadow: var(--shadow) var(--color-scrim-fg);
}
.cool-cta .roving-glow-border {
  --_glow: var(--color-alternate);
  --_size: 6rem;
}
.cool-cta .button {
  display: block;
  width: 100%;
  background: var(--color-alternate-bg);
  color: var(--color-alternate);
  border: none;
  padding: var(--gap-small);
  text-shadow: none;
  text-decoration: none;
  font-weight: var(--weight-medium);
  text-align: center;
}
.cool-cta .button:is(:hover, :focus-visible) {
  filter: brightness(1.1);
}
.inquiry-received-page .title,
.inquiry-received-page .note {
  text-align: center;
}
.inquiry-received-page .lucide {
  width: 3em;
  height: 3em;
  display: block;
  margin: auto;
}
.header-desc-section .title {
  font-size: 1em;
  font-family: var(--font-text);
  font-weight: var(--weight-heading);
}
.header-desc-section .logos {
  display: flex;
  flex-flow: row wrap;
  gap: var(--gap-small);
}
.header-desc-section .logo img {
  min-width: calc(2 * var(--rlh));
  max-width: calc(5 * var(--rlh));
  height: calc(2 * var(--rlh));
  object-fit: contain;
}
.header-meta {
  grid-column: 1 / -1;
  grid-row: 2;
}
.header-meta .props {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  border-radius: var(--radius-small);
  width: fit-content;
  margin: 0 auto;
  margin-block-end: -calc(2 * var(--rlh));
  padding: 0;
  overflow: hidden;
  overflow: clip;
}
.header-meta .props .prop {
  padding: var(--gap-small) var(--gap);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.header-meta .props .prop.-cta dt,
.header-meta .props .prop.-cta dd {
  font-weight: var(--weight-medium);
  color: var(--color-accent-fg);
  animation: text-shadow-pulsate 8s ease alternate infinite;
}
.header-meta .props .prop dt {
  font-weight: var(--weight-medium);
  color: var(--color-text);
  font-size: var(--size-small);
}
.header-meta .props .prop dd {
  margin: 0;
  color: var(--color-accent-fg);
}
.header-meta .props .prop dd a {
  color: inherit;
}
.feature-badge {
  display: block;
  color: var(--color-bg);
  font-size: var(--size-small);
  font-weight: bold;
  --flow-spacing: var(--gap-small);
}
.feature-badge.-big {
  font-size: var(--size-h3);
}
.course-purchase .price {
  font-size: var(--size-h2);
  font-family: var(--font-display);
  color: var(--color-accent-fg);
}
.course-purchase .price s {
  color: var(--color-faded-text);
  text-decoration-color: var(--color-alternate);
}
.course-purchase .note {
  color: var(--color-bg);
  font-size: var(--size-small);
  font-weight: 500;
  --flow-spacing: var(--gap-small);
}
.course-purchase .contactcta {
  font-weight: var(--weight-medium);
  color: var(--color-accent2);
}
.course-purchase .contactcta::before {
  content: "\2192  ";
  content: "\2192  " / "";
  display: inline;
}
.course-purchase .contactcta:not(:hover, :focus-visible) {
  text-decoration: none;
}
.course-description {
  margin: 0;
}
.course-description .section {
  padding: 0 var(--gap);
}
.course-description .section.-carousel {
  padding: 0;
  overflow: hidden;
  overflow: clip;
}
.course-description .section.-carousel .title {
  display: none;
}
.course-description .section.-carousel .carouselimage {
  max-width: none;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.course-description .section.-qa {
  padding-block-end: var(--gap-small);
  background: var(--color-box-bg);
}
.course-description .section.-qa .qa {
  margin-block: 0;
  padding-block: var(--gap-small);
}
.course-description .section.-qa .qa + :is(.course-description .section.-qa .qa) {
  border-block-start: var(--border-thin) var(--color-faded-fg);
}
.course-description .section.-qa .qa[open] {
  padding-block-end: 0;
}
.course-description .section.-qa .qa .q {
  font-weight: var(--weight-medium);
}
.course-description .section.-qa .qa .a {
  padding-inline-start: var(--gap);
}
.course-description .title {
  margin-block: var(--gap);
}
.course-variants {
  padding-block: 0;
}
.course-variants .variants {
  list-style: none;
  padding-inline-start: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--length-sidebar)), 1fr));
  gap: var(--gap-small);
}
.collapsible-box summary {
  font-weight: bold;
  font-family: var(--font-display);
  font-size: var(--size-h3);
}
.course-creation-page .image-input .imagewrapper {
  aspect-ratio: 21 / 9;
}
.course-creation-page .image-input .imagewrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.edit-course-description-section {
  display: grid;
  gap: var(--gap-small);
  border-color: var(--color-faded-fg);
  box-shadow-color: var(--color-scrim-fg);
  margin-block: 0;
}
.edit-course-description-section + .edit-course-description-section {
  margin-block-start: var(--gap);
}
.edit-course-description-section .header {
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: 1fr;
  grid-auto-columns: auto;
  gap: var(--gap-small);
}
.edit-course-description-section .body {
  border: none;
  padding: 0;
  margin: 0;
}
.edit-course-description-section .actions:not(.qaitem *) {
  margin-block-start: var(--gap-small);
}
.edit-course-description-section .qa mutable-list {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--gap-small);
}
.edit-course-description-section .qaitem {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: subgrid;
  grid-template-areas: "qlbl q actions" "albl a a";
  gap: var(--gap-small);
  border: var(--border) var(--color-faded-fg);
  padding: var(--gap-small);
  margin-block: var(--gap-tiny);
  background: var(--color-box-bg);
}
.edit-course-description-section .qaitem label {
  display: contents;
}
.edit-course-description-section .qaitem .qlbl {
  grid-area: qlbl;
}
.edit-course-description-section .qaitem .albl {
  grid-area: albl;
}
.edit-course-description-section .qaitem .q {
  grid-area: q;
}
.edit-course-description-section .qaitem .a {
  grid-area: a;
}
.edit-course-description-section .qaitem .a {
  grid-area: a;
}
.edit-course-description-section .qaitem .actions {
  grid-area: actions;
  place-self: center;
}
.edit-course-description-section .body.carousel mutable-list {
  flex-flow: row wrap;
}
.edit-course-description-section .body.carousel mutable-list:not(:hover, :focus-within) .edits {
  opacity: 0;
}
.edit-course-description-section .carouselitem {
  width: var(--size-massive);
  height: var(--size-massive);
  display: grid;
}
.edit-course-description-section .carouselitem > * {
  grid-area: 1/1;
}
.edit-course-description-section .carouselitem img {
  height: 100%;
  object-fit: cover;
}
.edit-course-description-section .carouselitem .edits {
  place-self: start end;
}
.edit-course-section {
  display: grid;
  gap: var(--gap-small);
  border-color: var(--color-faded-fg);
  box-shadow-color: var(--color-scrim-fg);
  margin-block: 0;
}
.edit-course-section + .edit-course-section {
  margin-block-start: var(--gap);
}
.edit-course-section .header {
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: 1fr;
  grid-auto-columns: auto;
  gap: var(--gap-small);
}
.edit-course-section .body {
  display: grid;
  gap: var(--gap-small);
}
.edit-course-section .summary {
  width: 100%;
  min-height: 5rem;
}
.edit-course-section .summary-label {
  display: block;
  margin-bottom: var(--gap-tiny);
  font-weight: var(--weight-medium);
}
.manage-table {
  width: 100%;
  border-collapse: collapse;
  margin-block: var(--gap);
}
.manage-table .img {
  width: calc(3 * var(--rlh));
  height: calc(2 * var(--rlh));
  margin-inline-end: var(--gap-small);
  object-fit: cover;
  border: none;
  background: var(--color-accent-bg);
  vertical-align: middle;
}
.manage-table td {
  font-size: 1.1em;
  padding-block: var(--gap-small);
  border-block: var(--border-thin) var(--color-fg);
  vertical-align: middle;
}
.manage-table td:last-child {
  width: 1px;
  white-space: nowrap;
}
.manage-table:has([scope=rowgroup]) td:first-child {
  padding-inline-start: var(--gap);
}
.manage-table th[scope=rowgroup] {
  font-weight: normal;
  font-style: italic;
}
.manage-actions {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: var(--gap-small);
}
.courses-table {
  width: 100%;
  border-collapse: collapse;
  margin-block: var(--gap);
}
.courses-table .img {
  width: calc(6 * var(--rlh));
  height: calc(4 * var(--rlh));
  margin-inline-end: var(--gap-small);
  object-fit: cover;
  border: none;
  background: var(--color-accent-bg);
  vertical-align: middle;
  border-radius: var(--radius-small);
  box-shadow: 0 0 0 2px var(--color-box-bg), 0 0 0 4px var(--color-accent);
}
.courses-table td {
  font-size: 1.1em;
  padding-block: var(--gap-large);
  border-block-end: var(--border-thin) var(--color-accent);
  vertical-align: middle;
}
.courses-table tr:last-of-type td {
  border-block-end: var(--border-thick) var(--color-accent);
}
.courses-table td:last-child {
  width: 1px;
  white-space: nowrap;
}
.course-cell {
  display: grid;
  grid-template: "image tags" "image title" "image date" /auto 1fr;
  gap: var(--gap-tiny) var(--gap-small);
}
.course-cell .img {
  grid-area: image;
}
.course-cell .title {
  grid-area: title;
  font-size: var(--size-h4);
  font-weight: 500;
}
.course-cell .tag {
  background: var(--color-fg4);
  color: var(--color-box-bg);
  border-radius: var(--radius-small);
  font-size: var(--size-small);
  padding: var(--gap-tiny) var(--gap-small);
}
.course-mgmt-page h2 {
  margin-block-start: var(--gap-large);
}
.course-mgmt-page .order-buttons {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.course-mgmt-page .category-form {
  display: flex;
  align-items: center;
  gap: var(--gap-small);
  flex-wrap: wrap;
}
@media (max-width: 768px) {
  .course-mgmt-page .manage-actions {
    flex-direction: column;
    align-items: flex-start;
  }
}
.contact-page .header {
  text-align: center;
}
.contact-page .details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: var(--gap-large);
}
.contact-item {
  padding: var(--gap-large) var(--gap);
  text-align: center;
  align-content: center;
}
.contact-item .title {
  margin-block: 0 var(--gap);
  font-size: var(--size-big-text);
  display: flex;
  flex-flow: row;
  gap: var(--gap-small);
  justify-content: center;
}
.contact-item p {
  font-size: var(--size-h4);
  font-family: var(--font-display);
  margin-block: 0;
}
.contact-item a {
  color: inherit;
}
.contact-item a:hover {
  color: var(--color-accent);
}
.privacy-page .title {
  margin-block-end: 0;
}
.privacy-page .lastmod {
  margin-block-start: 0;
  margin-block-end: var(--gap-large);
  color: var(--color-faded-text);
  font-style: italic;
}
.http-404-page .title {
  font-size: var(--size-massive);
  color: var(--color-accent);
  font-family: var(--font-display);
}
:is(.login-page, .signup-page) .header {
  text-align: center;
}
:is(.login-page, .signup-page) .errors:not(:empty) {
  color: var(--color-destructive-text);
  background: var(--color-destructive-bg);
  border-radius: var(--radius);
  padding: var(--gap-small);
}
:is(.login-page, .signup-page) .submit {
  margin: auto;
}
.account-page .account-sections {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--gap-xlarge);
}
@media (min-width: 768px) {
  .account-page .account-sections {
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  }
}
.account-page .account-section h2 {
  color: var(--color-accent-fg);
  margin-top: 0;
  margin-bottom: var(--gap);
}
.account-page .warning-text {
  color: var(--color-destructive-fg);
  font-weight: var(--weight-medium);
  margin-bottom: var(--gap);
}
.account-page .connected-account {
  margin-top: var(--gap);
}
.account-page .connected-account .connected-account-info {
  display: flex;
  align-items: center;
  gap: var(--gap-small);
  padding: var(--gap-small);
  background: var(--color-interact-bg);
  border-radius: var(--radius-small);
}
.account-page .connected-account .connected-account-info img {
  width: 20px;
  height: 20px;
}
.account-page .connected-account .connected-account-info span {
  font-weight: var(--weight-medium);
}
.confirm-dialog {
  margin-block: 0;
  width: 100%;
  max-width: 400px;
}
.confirm-dialog::backdrop {
  background-color: rgba(0, 0, 0, 0.5);
}
.confirm-dialog h3 {
  color: var(--color-destructive-fg);
  margin-top: 0;
}
.confirm-dialog .dialog-buttons {
  display: flex;
  justify-content: flex-end;
  gap: var(--gap-small);
  margin-top: var(--gap);
}
.sidebar-dialog {
  max-width: var(--length-sidebar);
  height: 100%;
  margin: var(--gap);
  margin-inline-start: auto;
  border-radius: var(--radius-big);
  border: none;
  box-shadow: var(--shadow-big) var(--color-shadow);
  background-color: var(--color-box-bg);
  color: var(--color-box-text);
  -webkit-backdrop-filter: blur(1em);
  backdrop-filter: blur(1em);
  transition: translate .4s ease;
  padding: var(--gap);
  overflow-y: auto;
}
@starting-style {
  .sidebar-dialog:not(.-no-animate) {
    translate: 120% 0;
  }
}
.sidebar-dialog::backdrop {
  background:
    linear-gradient(
      to left,
      var(--color-scrim-fg),
      lch(from var(--color-scrim-fg) l c h / .2) calc(1.3 * var(--length-sidebar)));
}
.icon-button {
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--gap-tiny);
  display: inline flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-small);
  font-size: var(--size-h3);
  line-height: 1em;
  color: currentColor;
}
.icon-button.-small {
  font-size: var(--size-text);
  padding: 0;
  margin: 0;
  vertical-align: middle;
}
.icon-button.-primary {
  color: var(--color-accent-fg);
}
.icon-button.-destructive {
  color: var(--color-destructive-fg);
}
.icon-button.-big {
  font-size: var(--size-h2);
}
.icon-button:hover {
  background-color: var(--color-interact-bg);
}
.student-id {
  color: var(--color-alternate);
  font-size: var(--size-h2);
  line-height: 1;
  margin-inline-start: .5em;
}
.loading-image {
  background:
    linear-gradient(
      to right,
      transparent,
      var(--color-interact-bg) 30%,
      transparent 60%) 0 0 / 40em 40em;
  animation: loading-image 2s infinite linear;
}
.whatsapp-icon {
  vertical-align: middle;
}
.bogazici-box {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 20em), 1fr));
  place-items: center;
}
.color\:--color-accent {
  color: var(--color-accent) !important;
}
.color\:--color-accent-text {
  color: var(--color-accent-text) !important;
}
.color\:--color-faded-text {
  color: var(--color-faded-text) !important;
}
.background\:--color-box-bg {
  background: var(--color-box-bg) !important;
}
.background\:--color-fg {
  background: var(--color-fg) !important;
}
.text-align\:center {
  text-align: center !important;
}
.overflow\:clip {
  overflow: hidden;
  overflow: clip;
}
.justify-content\:start {
  justify-content: start !important;
}
.justify-content\:end {
  justify-content: end !important;
}
.justify-content\:baseline {
  justify-content: baseline !important;
}
.justify-content\:center {
  justify-content: center !important;
}
.justify-content\:stretch {
  justify-content: stretch !important;
}
.justify-content\:space-between {
  justify-content: space-between !important;
}
.justify-content\:space-around {
  justify-content: space-around !important;
}
.justify-content\:space-evenly {
  justify-content: space-evenly !important;
}
.align-items\:start {
  align-items: start !important;
}
.align-items\:end {
  align-items: end !important;
}
.align-items\:baseline {
  align-items: baseline !important;
}
.align-items\:center {
  align-items: center !important;
}
.align-items\:stretch {
  align-items: stretch !important;
}
.align-content\:center {
  align-content: center !important;
}
.flex-grow\:0 {
  flex-grow: 0 !important;
}
.flex-grow\:1 {
  flex-grow: 1 !important;
}
.flex-shrink\:0 {
  flex-shrink: 0 !important;
}
.flex-shrink\:1 {
  flex-shrink: 1 !important;
}
.flex-wrap {
  flex-wrap: wrap !important;
}
.--size-text {
  font-size: var(--size-text) !important;
}
.--size-big-text {
  font-size: var(--size-big-text) !important;
}
.--size-h4 {
  font-size: var(--size-h4) !important;
}
.--size-h3 {
  font-size: var(--size-h3) !important;
}
.--size-h2 {
  font-size: var(--size-h2) !important;
}
.--size-h1 {
  font-size: var(--size-h1) !important;
}
.--size-big-heading {
  font-size: var(--size-big-heading) !important;
}
.--size-massive {
  font-size: var(--size-massive) !important;
}
.--size-small {
  font-size: var(--size-small);
  line-height: calc(var(--size-text) * 15 / 16) !important;
}
.--size-smaller {
  font-size: var(--size-smaller) !important;
}
.--size-tiny {
  font-size: var(--size-tiny) !important;
}
.--weight-thin {
  font-weight: var(--weight-thin) !important;
}
.--weight-text {
  font-weight: var(--weight-text) !important;
}
.--weight-medium {
  font-weight: var(--weight-medium) !important;
}
.--weight-heading {
  font-weight: var(--weight-heading) !important;
}
.--weight-massive {
  font-weight: var(--weight-massive) !important;
}
.--gap-hairline {
  gap: var(--gap-hairline) !important;
}
.--gap-tiny {
  gap: var(--gap-tiny) !important;
}
.--gap-small {
  gap: var(--gap-small) !important;
}
.--gap {
  gap: var(--gap) !important;
}
.--gap-large {
  gap: var(--gap-large) !important;
}
.--gap-xlarge {
  gap: var(--gap-xlarge) !important;
}
.--gap-massive {
  gap: var(--gap-massive) !important;
}
.column-gap\:--gap-hairline {
  column-gap: var(--gap-hairline) !important;
}
.column-gap\:--gap-tiny {
  column-gap: var(--gap-tiny) !important;
}
.column-gap\:--gap-small {
  column-gap: var(--gap-small) !important;
}
.column-gap\:--gap {
  column-gap: var(--gap) !important;
}
.column-gap\:--gap-large {
  column-gap: var(--gap-large) !important;
}
.column-gap\:--gap-xlarge {
  column-gap: var(--gap-xlarge) !important;
}
.column-gap\:--gap-massive {
  column-gap: var(--gap-massive) !important;
}
.margin\:auto {
  margin: auto !important;
}
.margin-block\:0 {
  margin-block: 0 !important;
}
.margin-block\:--gap-hairline {
  margin-block: var(--gap-hairline) !important;
}
.margin-block {
  margin-block: var(--gap) !important;
}
.margin-block\:--gap-tiny {
  margin-block: var(--gap-tiny) !important;
}
.margin-block\:--gap-small {
  margin-block: var(--gap-small) !important;
}
.margin-block\:--gap-large {
  margin-block: var(--gap-large) !important;
}
.margin-block\:--gap-xlarge {
  margin-block: var(--gap-xlarge) !important;
}
.margin-block\:--gap-massive {
  margin-block: var(--gap-massive) !important;
}
.margin-inline\:0 {
  margin-inline: 0 !important;
}
.margin-inline\:--gap-hairline {
  margin-inline: var(--gap-hairline) !important;
}
.margin-inline {
  margin-inline: var(--gap) !important;
}
.margin-inline\:--gap-tiny {
  margin-inline: var(--gap-tiny) !important;
}
.margin-inline\:--gap-small {
  margin-inline: var(--gap-small) !important;
}
.margin-inline\:--gap-large {
  margin-inline: var(--gap-large) !important;
}
.margin-inline\:--gap-xlarge {
  margin-inline: var(--gap-xlarge) !important;
}
.margin-inline\:--gap-massive {
  margin-inline: var(--gap-massive) !important;
}
.padding\:--gap-hairline {
  padding: var(--gap-hairline) !important;
}
.padding {
  padding: var(--gap) !important;
}
.padding\:--gap-tiny {
  padding: var(--gap-tiny) !important;
}
.padding\:--gap-small {
  padding: var(--gap-small) !important;
}
.padding\:--gap-large {
  padding: var(--gap-large) !important;
}
.padding\:--gap-xlarge {
  padding: var(--gap-xlarge) !important;
}
.padding\:--gap-massive {
  padding: var(--gap-massive) !important;
}
.padding-block\:0 {
  padding-block: 0 !important;
}
.padding-block\:--gap-hairline {
  padding-block: var(--gap-hairline) !important;
}
.padding-block {
  padding-block: var(--gap) !important;
}
.padding-block\:--gap-tiny {
  padding-block: var(--gap-tiny) !important;
}
.padding-block\:--gap-small {
  padding-block: var(--gap-small) !important;
}
.padding-block\:--gap-large {
  padding-block: var(--gap-large) !important;
}
.padding-block\:--gap-xlarge {
  padding-block: var(--gap-xlarge) !important;
}
.padding-block\:--gap-massive {
  padding-block: var(--gap-massive) !important;
}
.padding-inline\:0 {
  padding-inline: 0 !important;
}
.padding-inline\:--gap-hairline {
  padding-inline: var(--gap-hairline) !important;
}
.padding-inline {
  padding-inline: var(--gap) !important;
}
.padding-inline\:--gap-tiny {
  padding-inline: var(--gap-tiny) !important;
}
.padding-inline\:--gap-small {
  padding-inline: var(--gap-small) !important;
}
.padding-inline\:--gap-large {
  padding-inline: var(--gap-large) !important;
}
.padding-inline\:--gap-xlarge {
  padding-inline: var(--gap-xlarge) !important;
}
.padding-inline\:--gap-massive {
  padding-inline: var(--gap-massive) !important;
}
.text-wrap\:balance {
  text-wrap: balance !important;
}
.--length-medium {
  max-width: var(--length-medium) !important;
}
.--length-narrow {
  max-width: var(--length-narrow) !important;
}
.--length-card {
  max-width: var(--length-card) !important;
}
.--length-sidebar {
  max-width: var(--length-sidebar) !important;
}
.--length-wide {
  max-width: var(--length-wide) !important;
}
.\<br\> {
  display: block;
  height: 0;
  visibility: hidden;
}
.display\:block {
  display: block;
}
.display\:inline {
  display: inline;
}
.position\:relative {
  position: relative;
}
.gap\:0 {
  gap: 0;
}
.\:vhide {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  white-space: nowrap;
  clip-path: inset(100%);
  clip: rect(0 0 0 0);
  overflow: hidden;
  outline: 0;
  outline-offset: 0;
}
@keyframes undulate {
  from {
    translate: 0 -.5em;
  }
  to {
    translate: 0 .5em;
  }
}
@keyframes aurora {
  from {
    background-position: center;
  }
  to {
    background-position: 500% 50%, 250% 100%;
  }
}
@keyframes pulsate-dots {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}
@keyframes move-glow {
  0% {
    offset-distance: 0%;
    opacity: 1;
  }
  25% {
    offset-distance: 25%;
    opacity: .8;
  }
  50% {
    offset-distance: 50%;
    opacity: 1;
  }
  75% {
    offset-distance: 75%;
    opacity: .8;
  }
  100% {
    offset-distance: 100%;
    opacity: 1;
  }
}
@keyframes text-shadow-pulsate {
  from {
    filter: drop-shadow(0 0 0 transparent) drop-shadow(0 0 0 transparent);
  }
  to {
    filter: drop-shadow(0 0 .5em var(--color-complement)) drop-shadow(0 0 1em var(--color-accent));
  }
}
@keyframes loading-image {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 40em 0;
  }
}
@keyframes particles {
  0% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(-2560px);
  }
}
@media (max-width: 1349px) {
  body > .knot-pattern {
    display: none;
  }
}
.ql-container {
  height: auto !important;
  font-family: var(--font-text) !important;
}
.ql-editor:focus-visible {
  outline: 0px none;
  box-shadow: none;
}
.ql-toolbar {
  padding: 0 !important;
}
.ql-editor {
  padding-block: 0 !important;
}
.ql-editor :is(p, ul, ol, dl, blockquote, h1, h2, h3, h4, h5, h6, pre) {
  margin-block: 1rem !important;
}
.ql-editor :is(ul, ol) {
  padding-inline-start: 0 !important;
}
.ql-code-block {
  word-break: break-all;
}