/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[5]!./src/app/components/errorMessage.module.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.errorMessage_error__OnKmw {
  background-color: var(--error-background);
  color: var(--error-text);
  border-radius: var(--radius-large);
  padding: var(--medium-gap-padding-size);
}

.errorMessage_inline__2DqKF {
  background: none;
  color: var(--error-background);
  border-radius: 0;
  padding: var(--xsmall-gap-padding-size) 0;
  margin: 0;
  font-size: 0.8em;
  font-weight: bold;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[3]!./src/app/star/buttons/starbuttonbase.module.css ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************/
.starbuttonbase_base__b2Myu {
    font-size: 1rem;
    font-weight: 600;
    padding: var(--medium-gap-padding-size);
    border: none;
    border-radius: var(--radius-large);
    font-family: inherit;
    cursor: pointer;
    /* reset anchor styles when rendered as a link */
    text-decoration: none;
    display: inline-block;
    text-align: center;
}

.starbuttonbase_hasMaxWidth__SU6p2 {
    width: 100%;
}

.starbuttonbase_hasHalfWidth__EMkU1 {
    width: 50%;
}

.starbuttonbase_hasQuarterWidth__7bv4A {
    width: 25%;
}

.starbuttonbase_disabled__OeB6g {
    opacity: 0.5;
    cursor: not-allowed;
}

@media (max-width: 767px) {
    .starbuttonbase_hasMobileFullWidth__LmYH_ {
        width: 100%;
    }

    .starbuttonbase_hasMobileHalfWidth__JF1Fl {
        width: 50%;
    }

    .starbuttonbase_hasMobileQuarterWidth__y_851 {
        width: 25%;
    }
}

/*!*********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[3]!./src/app/star/buttons/starbuttonprimary.module.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************/
.starbuttonprimary_primary___hzEp {
  background-color: var(--primary-button-background);
  color: var(--primary-button-text-color);

  &:hover {
    background-color: var(--tertiary-color);
    color: var(--tertiary-color-text);
  }
}

/*!***********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[3]!./src/app/star/buttons/starbuttonsecondary.module.css ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************/
.starbuttonsecondary_secondary__1U2yn {
  background-color: var(--secondary-button-background);
  color: var(--secondary-button-text-color);

  &:hover {
    background-color: var(--tertiary-color);
    color: var(--tertiary-color-text);
  }
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[5]!./src/app/registration/registrationlogin.module.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.registrationlogin_inputContainer__3FcL3 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--small-gap-padding-size);
  max-width: 450px;
  margin: 0 auto;
  width: 100%;
}

.registrationlogin_inputText__z_rcM {
  width: 100%;
  padding: var(--small-gap-padding-size);
  border: 1px solid black;
  border-radius: var(--radius-small);
  box-sizing: border-box;
}

.registrationlogin_buttonContainer__oYRFJ {
  display: flex;
  gap: var(--small-gap-padding-size);
  width: 100%;
}
.registrationlogin_buttonContainer__oYRFJ > button {
  flex: 1 1;
  min-width: 0;
}

.registrationlogin_error__5cjxx {
  padding: var(--large-gap-padding-size) var(--xsmall-gap-padding-size);
  color: var(--error-background);
}

.registrationlogin_goodjob__KVVuS {
  padding: var(--xsmall-gap-padding-size);
  color: green;
}

.registrationlogin_worldTiles__p_vxm {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--large-gap-padding-size);
}

.registrationlogin_worldTile__8EXB_ {
  text-align: center;
}

.registrationlogin_worldText__UL0Zp {
  max-width: 50%;
  text-align: center;
  margin: 0 auto;
}

/* Fun styles for funs -- probably not final */
.registrationlogin_loadingContainer__tq32Q {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* NPC Component for Registration */
.registrationlogin_npcWrapper__IzzVK {
  text-align: center;
  max-width: 100%;
}

.registrationlogin_npcQuestions__KvVPl {
  display: flex;
  justify-content: space-evenly;
  margin: var(--large-gap-padding-size) 0;
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[3]!./src/app/star/headers/starHeaderOne.module.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************/
.starHeaderOne_base__x3__1 {
  /* TODO: FONT SIZE FOR HEADERS */
  color: var(--primary-color);
  text-align: left;

  padding: var(--small-gap-padding-size) 0;
  margin: 0;
}

/*!*****************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[7].use[3]!./src/app/star/headers/starHeaderTwo.module.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************/
.starHeaderTwo_base__9_bVs {
  text-align: center;
  background-color: var(--secondary-color);
  color: var(--secondary-color-text);
  padding: var(--small-gap-padding-size);
  border-radius: var(--radius-small);
}

/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[5]!./src/app/star/starclickableimage.module.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.starclickableimage_clickableImage__8Xfpl {
  cursor: pointer;
  transition: transform 0.2s ease-in-out;
}
.starclickableimage_clickableImage__8Xfpl:hover, .starclickableimage_clickableImage__8Xfpl:focus-visible {
  transform: scale(1.05);
}

/* Anchors are inline by default, which transform ignores */
a.starclickableimage_clickableImage__8Xfpl {
  display: inline-block;
}

@media (prefers-reduced-motion: reduce) {
  .starclickableimage_clickableImage__8Xfpl {
    transition: none;
  }
}
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[5]!./src/app/components/NPC/npc.module.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* With Dialogue styles */
.npc_npcSceneWrapper__VY6i1 {
  position: relative;
  width: 100%;
}

.npc_npcBackgroundImageWrapper__CYw9O {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 2000px; /* matches the source art's native width so cover doesn't have to upscale past it */
  height: calc(100% - 30px); /* trims the top of the background so it sits further behind the NPC */
}

.npc_npcBackgroundImage__npWoY {
  object-fit: cover;
  object-position: center bottom;
}

.npc_npcWithDialogueWrapper__cwnOP {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: var(--medium-gap-padding-size);
}

.npc_bubbleWrapper__qlOpa {
  display: flex;
  height: 300px; /* Must match image height on desktop */
  align-items: center;
}

.npc_speechBubble__qTqQM {
  position: relative;
  background: var(--tertiary-color);
  border-radius: 0.4em;
  width: 300px;
  min-width: 300px;
  padding: var(--medium-gap-padding-size);
}

.npc_speechBubble__qTqQM:after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 0;
  height: 0;
  border: 20px solid transparent;
  border-right-color: var(--tertiary-color);
  border-left: 0;
  border-top: 0;
  margin-top: -10px;
  margin-left: -20px;
}

.npc_innerSpeechBubble__e3kg8 {
  color: var(--tertiary-color-text);
  display: flex;
  height: 100%;
  width: 100%;
  justify-content: center;
  align-items: center;
  max-height: 250px;
  overflow: auto;
}

.npc_thieveryInteractionBtnWrapper__lMdXR {
  display: flex;
  width: 100%;
  justify-content: center;
  gap: var(--small-gap-padding-size);
}

/* TODO - quick mobile styles for preview, fix later */
@media screen and (max-width: 768px) {
  .npc_npcWithDialogueWrapper__cwnOP {
    flex-direction: column;
    align-items: center;
    gap: var(--small-gap-padding-size);
  }
  .npc_bubbleWrapper__qlOpa {
    height: auto;
  }
  .npc_speechBubble__qTqQM {
    width: 100%;
    min-width: 0;
    max-width: 300px;
  }
  .npc_speechBubble__qTqQM:after {
    top: 0;
    left: 50%;
    transform: rotate(90deg);
  }
}
/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[9].use[5]!./src/app/components/loginWall.module.scss ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.loginWall_loginFormStyles__7TMEf {
  width: 100%;
}