/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[3].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[3].oneOf[9].use[5]!./src/components/Egg/Egg.module.scss ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.Egg_modal__CJuhK {
  background: none;
  border: 0;
  padding: 0;
  outline: none;
  width: 100%;
  height: 100%;
  display: none;
  align-items: center;
  justify-content: center;
  overflow: visible;
}
.Egg_modal__CJuhK[open] {
  display: flex;
}
.Egg_modal__CJuhK::-webkit-backdrop {
  background: rgba(0, 0, 0, 0.6);
}
.Egg_modal__CJuhK::backdrop {
  background: rgba(0, 0, 0, 0.6);
}

.Egg_image__IgWWf {
  max-width: 80vw;
  max-height: 80vh;
  border-radius: 10px;
  display: block;
  position: absolute;
}

@keyframes Egg_load__0LIcC {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.Egg_loader__WLU1h {
  height: 24px;
  width: 24px;
  border: 3px solid var(--primary);
  border-left-color: transparent;
  border-radius: 100px;
  animation: Egg_load__0LIcC 0.5s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  .Egg_loader__WLU1h {
    animation: none;
    border: 0;
  }
  .Egg_loader__WLU1h::before {
    content: "loading...";
  }
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[3].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[3].oneOf[9].use[5]!./src/components/Field/Field.module.scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.Field_wrapper__8B9sv {
  margin: 30px 0;
}

.Field_label__5CkYx {
  display: block;
  padding-bottom: 4px;
  font-size: 18px;
}

.Field_description__mhM8M {
  display: block;
  padding-bottom: 6px;
  font-size: 13px;
  opacity: 0.7;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[3].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[3].oneOf[9].use[5]!./src/components/SelectField/SelectField.module.scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.SelectField_select__ZDNKK {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  background: var(--background);
  color: inherit;
  padding: 10px 14px;
  border: 1px solid var(--primary);
  box-shadow: inset 0 0 0 0 var(--primary);
  border-radius: 3px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3CforeignObject%20width%3D%22100px%22%20height%3D%22100px%22%3E%3Cdiv%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxhtml%22%20style%3D%22color%3A%23F79E00%3Bfont-size%3A60px%3Bdisplay%3Aflex%3Balign-items%3Acenter%3Bjustify-content%3Acenter%3Bheight%3A100%25%3Bwidth%3A100%25%3B%22%3E%E2%96%BC%3C%2Fdiv%3E%3C%2FforeignObject%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 1em;
}
.SelectField_select__ZDNKK:focus-visible {
  outline: var(--focus-ring);
  outline-offset: 2px;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[3].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[3].oneOf[9].use[5]!./src/components/ToggleField/ToggleField.module.scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.ToggleField_toggleContainer__r7ykN {
  display: flex;
  border-radius: 3px;
}
.ToggleField_toggleContainer__r7ykN > div:first-of-type label {
  -webkit-border-start: 1px solid var(--primary);
          border-inline-start: 1px solid var(--primary);
  border-end-start-radius: 2px;
  border-start-start-radius: 2px;
}
.ToggleField_toggleContainer__r7ykN > div:last-of-type label {
  -webkit-border-end: 1px solid var(--primary);
          border-inline-end: 1px solid var(--primary);
  border-start-end-radius: 2px;
  border-end-end-radius: 2px;
}

.ToggleField_option__NgkUo {
  flex: 1 1;
  position: relative;
}

.ToggleField_hiddenInput__1BOiS {
  height: 0;
  width: 0;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.ToggleField_hiddenInput__1BOiS:checked + label {
  color: var(--background);
  background-color: var(--primary);
}
.ToggleField_hiddenInput__1BOiS:focus-visible + label {
  outline: var(--focus-ring);
  outline-offset: 2px;
}

.ToggleField_button__SQ9AJ {
  padding: 6px;
  display: flex;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  height: 100%;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  border-block: 1px solid var(--primary);
}
/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[3].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[3].oneOf[9].use[5]!./src/components/Settings/Settings.module.scss ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.Settings_openButton__WZx_S {
  border: 0;
  background: none;
  height: 50px;
  width: 50px;
  cursor: pointer;
  color: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 200;
  border-radius: 100%;
  transition: background-color 0.15s;
  transition: transform 0.15s;
  padding: 0;
}
.Settings_openButton__WZx_S:focus-visible {
  outline: var(--focus-ring);
}
@media (prefers-reduced-motion: reduce) {
  .Settings_openButton__WZx_S {
    transition: none;
  }
}
@media print {
  .Settings_openButton__WZx_S {
    display: none;
  }
}

.Settings_open__I1z2O {
  transform: rotate(-60deg);
}

.Settings_modal__xbb6G {
  position: absolute;
  inset: 0;
  max-width: initial;
  min-height: initial;
  width: initial;
  height: initial;
  padding: 0;
  margin: 0;
  background: none;
  border: none;
  overflow: visible;
  display: block;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-10px);
  visibility: hidden;
  transition: opacity 0.15s, transform 0.15s, visibility 0.15s;
}
.Settings_modal__xbb6G > div {
  position: absolute;
  top: 70px;
  right: 12px;
  background-color: var(--background);
  border: 1px solid var(--surface);
  z-index: 150;
  padding: 10px 18px;
  border-radius: 3px;
  width: 270px;
  box-sizing: border-box;
  max-width: calc(100% - 20px);
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.3);
}
.Settings_modal__xbb6G[open] {
  pointer-events: all;
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}
.Settings_modal__xbb6G::-webkit-backdrop {
  background: none;
}
.Settings_modal__xbb6G::backdrop {
  background: none;
}
@media (prefers-reduced-motion: reduce) {
  .Settings_modal__xbb6G {
    transition: none;
  }
}
@media print {
  .Settings_modal__xbb6G {
    display: none;
  }
}

.Settings_heading__jufbI {
  font-size: 1.5rem;
  display: block;
  margin: 6px 0;
  line-height: 1em;
}
/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[3].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[3].oneOf[9].use[5]!./src/components/Button/Button.module.scss ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.Button_button__PjVhE {
  cursor: pointer;
  border: 0;
  text-decoration: none;
  font: inherit;
  padding: 0;
  margin: 0;
  background: none;
  border-radius: 3px;
}
.Button_button__PjVhE > div {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-sizing: border-box;
  background: var(--override-surface-color, var(--primary));
  color: var(--override-text-color, var(--background));
  font-weight: 600;
  transition: transform 150ms cubic-bezier(0, 0, 0.58, 1);
  border-radius: inherit;
  padding: 0.6em 1.5em;
  transform-style: preserve-3d;
  margin-bottom: 5px;
}
.Button_button__PjVhE > div svg, .Button_button__PjVhE > div img {
  height: 1.2em;
  width: 1.2em;
  margin-right: 0.5em;
}
.Button_button__PjVhE > div::before {
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background: var(--override-shadow-color, var(--shadow));
  border-radius: inherit;
  transform: translate3d(0, 5px, -1em);
  transition: transform 150ms cubic-bezier(0, 0, 0.58, 1), box-shadow 150ms cubic-bezier(0, 0, 0.58, 1);
}
.Button_button__PjVhE:hover > div, .Button_button__PjVhE:focus > div {
  transform: translate(0, 1px);
}
.Button_button__PjVhE:hover > div::before, .Button_button__PjVhE:focus > div::before {
  transform: translate3d(0, 4px, -1em);
}
.Button_button__PjVhE:active > div {
  transform: translate(0, 5px);
}
.Button_button__PjVhE:active > div::before {
  transform: translate3d(0, 0, -1em);
}
@media print {
  .Button_button__PjVhE > div::before {
    display: none;
  }
}
.Button_button__PjVhE:focus-visible {
  outline: var(--focus-ring);
  outline-offset: 2px;
}

.Button_iconButton___b5Sg > div {
  height: 30px;
  width: 30px;
  padding: 0;
}
.Button_iconButton___b5Sg > div svg, .Button_iconButton___b5Sg > div img {
  margin: 0;
}

.Button_small__XCqD1 > div {
  padding: 0.4em 1.3em;
}

.Button_loading__sDdK_ {
  cursor: wait;
}
.Button_loading__sDdK_ > div {
  color: transparent;
}
.Button_loading__sDdK_ img {
  opacity: 0;
}
@keyframes Button_load__4bdpG {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.Button_loading__sDdK_ > div::after {
  content: "";
  position: absolute;
  top: calc(50% - 12px);
  left: calc(50% - 12px);
  height: 18px;
  width: 18px;
  border: 3px solid var(--override-text-color, var(--background));
  border-left-color: transparent;
  border-radius: 100px;
  animation: Button_load__4bdpG 0.5s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  .Button_loading__sDdK_ > div::after {
    content: "loading...";
    color: var(--override-text-color, var(--background));
    animation: none;
    width: initial;
    height: initial;
    left: 50%;
    transform: translateX(-50%);
    border: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

.Button_secondary__2SNo1 > div {
  background: transparent;
  border: 1px solid var(--override-surface-color, var(--secondary));
  color: var(--override-surface-color, var(--secondary));
  margin-bottom: 0;
}
@media print {
  .Button_secondary__2SNo1 > div {
    box-shadow: 0 4px 0 0 var(--override-shadow-color, var(--secondary));
  }
}
.Button_secondary__2SNo1 > div::before {
  content: none;
}
.Button_secondary__2SNo1:hover > div, .Button_secondary__2SNo1:active > div, .Button_secondary__2SNo1:focus > div {
  transform: none;
}
/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[3].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[3].oneOf[9].use[5]!./src/components/TranslateDialog/TranslateDialog.module.scss ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.TranslateDialog_popup__frUTN {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: var(--background);
  border: 1px solid var(--surface);
  z-index: 900;
  padding: 20px;
  border-radius: 3px;
  box-sizing: border-box;
  width: 500px;
  max-width: calc(100% - 40px);
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.3);
  display: flex;
  align-items: center;
}
.TranslateDialog_popup__frUTN h2 {
  margin: 0;
  font-size: 1.3rem;
}
.TranslateDialog_popup__frUTN p {
  margin: 12px 0 0;
  font-size: 1rem;
}
@media (max-width: 400px) {
  .TranslateDialog_popup__frUTN {
    display: block;
  }
}

.TranslateDialog_buttons___7tLU {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  margin-left: 20px;
  white-space: nowrap;
}
@media (max-width: 400px) {
  .TranslateDialog_buttons___7tLU {
    margin: 20px 0 0;
    white-space: normal;
  }
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[2].use[1]!./node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[3].oneOf[2].use[2]!./node_modules/next/font/google/target.css?{"path":"src/app/layout.tsx","import":"Karla","arguments":[{"subsets":["latin"]}],"variableName":"karla"} ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* latin-ext */
@font-face {
  font-family: '__Karla_442b35';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/_next/static/media/ea05c3aa551e0ebc-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: '__Karla_442b35';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/_next/static/media/b7ae23d8a9c319da-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@font-face {font-family: '__Karla_Fallback_442b35';src: local("Arial");ascent-override: 88.67%;descent-override: 24.37%;line-gap-override: 0.00%;size-adjust: 103.42%
}.__className_442b35 {font-family: '__Karla_442b35', '__Karla_Fallback_442b35';font-style: normal
}

/*!**************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[3].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[3].oneOf[12].use[3]!./src/app/global.css ***!
  \**************************************************************************************************************************************************************************************************************************************************************/
:root {
    color-scheme: light dark;

    --primary: #662c91;
    --mit-grey: #c2c0bf;
    --mit-dark-gey: #8a8b8c;
    --mit-red: #a31f34;
    --eecs-red: #c6158d;
    --eecs-blue: #02a1c7;
    --eccs-purple: #662c91;

    /* LIGHT */
    --background-light: #ffffff;
    --text-light: #000000;
    --shadow-light: #f48600;
    --highlight-light: #f4bb60;
    --secondary-light: var(--shadow-light);
    --tertiary-light: var(--highlight-light);
    --surface-light: #fef2dd;
    --error-light: #d32f2f;
    --loading-light: #dddddd;
    --font-weight-light: 600;

    /* DARK */
    --background-dark: #111111;
    --text-dark: #dddddd;
    --shadow-dark: #cc7313;
    --highlight-dark: #f4bb60;
    --secondary-dark: var(--highlight-dark);
    --tertiary-dark: var(--shadow-dark);
    --surface-dark: #30240f;
    --error-dark: #e53935;
    --loading-dark: #444444;
    --font-weight-dark: 500;

    /* Define light defaults */
    --background: var(--background-light);
    --text: var(--text-light);
    --shadow: var(--shadow-light);
    --highlight: var(--highlight-light);
    --secondary: var(--secondary-light);
    --tertiary: var(--tertiary-light);
    --surface: var(--surface-light);
    --error: var(--error-light);
    --loading: var(--loading-light);
    --font-weight: var(--font-weight-light);
}

@media (prefers-color-scheme: dark) {
    :root {
        --background: var(--background-dark);
        --text: var(--text-dark);
        --shadow: var(--shadow-dark);
        --highlight: var(--highlight-dark);
        --secondary: var(--secondary-dark);
        --tertiary: var(--tertiary-dark);
        --surface: var(--surface-dark);
        --error: var(--error-dark);
        --loading: var(--loading-dark);
        --font-weight: var(--font-weight-dark);
    }
}

html {
    scroll-behavior: smooth;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

body {
    margin: 0;
    background: var(--background);
    color: var(--text);
    font-weight: var(--font-weight);
    --focus-ring: 2px solid var(--secondary);
}

.light {
    color-scheme: light;
    --background: var(--background-light);
    --text: var(--text-light);
    --shadow: var(--eecs-red);
    --highlight: var(--mit-grey);
    --secondary: var(--mit-red);
    --tertiary: var(--mit-grey);
    --surface: var(--surface-light);
    --error: var(--error-light);
    --loading: var(--loading-light);
    --font-weight: var(--font-weight-light);
}

@media not print {
    .dark {
        color-scheme: dark;
        --background: var(--background-dark);
        --text: var(--text-dark);
        --shadow: var(--eecs-red);
        --highlight: var(--mit-grey);
        --secondary: var(--mit-red);
        --tertiary: var(--mit-grey);
        --surface: var(--surface-dark);
        --error: var(--error-dark);
        --loading: var(--loading-dark);
        --font-weight: var(--font-weight-dark);
    }
}

@media print {
    #app,
    .light,
    .dark {
        --background: white;
    }
}

a {
    color: var(--primary);
    border-radius: 0.2em;
}
a:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 2px;
}

*::-webkit-scrollbar {
    width: 16px;
    height: 16px;
}
*::-webkit-scrollbar-track {
    background: var(--surface);
}
*::-webkit-scrollbar-thumb {
    border-radius: 100px;
    border: 4px solid var(--surface);
    width: 12px;
    background: var(--tertiary);
}
*::-webkit-scrollbar-thumb:hover {
    background: var(--primary);
}
*::-webkit-scrollbar-thumb:active {
    background: var(--secondary);
}

input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--primary);
}
input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
    outline: var(--focus-ring);
    outline-offset: 2px;
}

