html,
body.student-login-page {
  min-height: 100%;
}

.student-handoff-shell { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 24px; background: url("/token-assets/student-home/student-login-bg-village.webp") center / cover no-repeat; }
.student-handoff-card { width: min(100%, 480px); padding: 32px; border: 3px solid #f0ca58; border-radius: 28px; background: #fffdf8; text-align: center; box-shadow: 0 24px 60px rgb(23 50 77 / 25%); }
.student-handoff-card h1 { margin: 10px 0; color: #10479a; font-size: clamp(1.8rem, 5vw, 2.6rem); }
.student-handoff-card p { color: #5c6f82; line-height: 1.6; }
.student-handoff-card p[data-tone="bad"] { color: #b42318; }
.student-handoff-card a { display: inline-flex; margin-top: 12px; padding: 12px 18px; border-radius: 12px; background: #165dcc; color: #fff; font-weight: 900; text-decoration: none; }

body.student-login-page {
  color: #17324d;
  background: #c8edff;
}

.student-login-page .student-login-shell {
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  padding: 0;
  grid-template-columns: minmax(0, 59fr) minmax(430px, 41fr);
  align-items: stretch;
  gap: 0;
}

.student-login-page .student-login-visual {
  position: relative;
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
  display: block;
  padding: 0;
  border-radius: 0;
  background: #b7e4f3;
  box-shadow: none;
}

.student-login-page .student-login-visual img {
  width: 100%;
  height: 100%;
  min-height: inherit;
  display: block;
  object-fit: cover;
}

.student-login-page .student-login-visual-copy {
  position: absolute;
  top: clamp(48px, 10vh, 112px);
  right: clamp(34px, 6vw, 100px);
  left: clamp(34px, 8vw, 130px);
  display: grid;
  gap: 18px;
  color: #0d47a1;
  text-shadow: 0 3px 0 rgb(255 255 255 / 86%), 0 8px 22px rgb(43 111 172 / 18%);
}

.student-login-page .student-login-visual-copy p {
  margin: 0;
  font-size: clamp(2.55rem, 5.1vw, 5rem);
  font-weight: 950;
  letter-spacing: -.055em;
  line-height: 1.08;
}

.student-login-page .student-login-visual-copy p span {
  display: block;
}

.student-login-page .student-login-visual-copy > span {
  color: #34475e;
  font-size: clamp(.96rem, 1.6vw, 1.25rem);
  font-weight: 800;
  text-shadow: 0 2px 0 rgb(255 255 255 / 92%);
}

.student-login-page .student-login-panel {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(44px, 7vw, 92px);
  border: 0;
  border-left: 3px solid #f1cf61;
  border-radius: 64px 0 0 64px;
  background: #fffdf8;
  box-shadow: -22px 0 56px rgb(23 50 77 / 16%);
}

.student-login-page .student-login-back {
  gap: 9px;
  min-height: 36px;
  margin-bottom: 28px;
  color: #2459a1;
}

.student-login-page .student-login-heading {
  display: grid;
  gap: 16px;
  margin-bottom: 34px;
}

.student-login-page .student-login-kicker {
  width: fit-content;
  padding: 7px 18px;
  border: 1px solid #9ec8e9;
  border-radius: 999px;
  background: #eef7ff;
  color: #144d9c;
  font-size: 14px;
}

.student-login-page .student-login-heading h1 {
  margin: 0;
  color: #0d47a1;
  font-size: clamp(2.35rem, 4vw, 3.5rem);
  line-height: 1.12;
}

.student-login-page .student-login-form {
  gap: 16px;
}

.student-login-page .student-login-form label {
  color: #123f86;
}

.student-login-page .student-login-form input {
  min-height: 62px;
  border-color: #9ec8e9;
  border-radius: 13px;
  padding: 0 17px;
}

.student-login-page .student-login-submit {
  min-height: 62px;
  border-radius: 13px;
  background: #165dcc;
  box-shadow: 0 14px 30px rgb(22 93 204 / 22%);
  font-size: 17px;
}

.student-login-page .privacy-note {
  color: #35516a;
  font-weight: 800;
}

.student-login-page .student-login-remember {
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  min-height: 44px;
  color: #173f73;
  font-weight: 900;
  cursor: pointer;
}

.student-login-page .student-login-remember input {
  width: 20px;
  min-height: 20px;
  margin: 0;
  accent-color: #188782;
}

.student-login-page .student-login-admin-entry {
  display: grid;
  gap: 10px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #d9e3ec;
  color: #58708a;
  font-size: 13px;
  font-weight: 800;
}

.student-login-page .student-login-admin-button {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #8dbdea;
  border-radius: 13px;
  color: #124f9f;
  background: #fff;
  font: inherit;
  font-size: 15px;
  font-weight: 900;
  text-decoration: none;
  cursor: pointer;
}

body.teacher-auth-page {
  min-height: 100%;
  margin: 0;
  color: #213a56;
  background: #c8edff url("/token-assets/student-home/student-login-bg-village.webp") center / cover no-repeat;
  font-family: "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", system-ui, sans-serif;
}

.teacher-auth-overlay {
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgb(12 35 63 / 72%);
}

.teacher-auth-card {
  width: min(100%, 470px);
  max-height: calc(100dvh - 40px);
  overflow: auto;
  padding: 34px;
  border: 3px solid #f0ca58;
  border-radius: 32px;
  background: #fffdf8;
  text-align: center;
  box-shadow: 0 28px 72px rgb(10 35 63 / 35%);
}

.teacher-auth-icon {
  width: 76px;
  height: 76px;
  display: grid;
  place-items: center;
  margin: 0 auto 18px;
  border-radius: 24px;
  background: #e9f3ff;
  color: #165dcc;
  font-size: 2.25rem;
}

.teacher-auth-card h1 { margin: 0 0 10px; color: #10479a; font-size: clamp(1.9rem, 5vw, 2.5rem); letter-spacing: -.04em; }
.teacher-auth-guide { margin: 0; color: #5c6f82; line-height: 1.6; }
.teacher-auth-form { display: grid; gap: 11px; margin-top: 22px; }
.teacher-auth-form input,
.teacher-signup-form input,
.teacher-signup-form select,
.teacher-signup-form textarea {
  width: 100%;
  min-height: 52px;
  padding: 0 15px;
  border: 1px solid #a8c8e7;
  border-radius: 13px;
  background: #fff;
  color: #17324d;
  font: inherit;
}
.teacher-signup-form textarea { min-height: 88px; padding-block: 12px; resize: vertical; }
.teacher-auth-form input:focus-visible,
.teacher-signup-form :is(input, select, textarea):focus-visible { border-color: #165dcc; outline: 3px solid rgb(22 93 204 / 18%); }
.teacher-auth-primary,
.teacher-auth-secondary {
  width: 100%;
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border: 1px solid #165dcc;
  border-radius: 13px;
  background: #165dcc;
  color: #fff;
  font: inherit;
  font-weight: 900;
  text-decoration: none;
  cursor: pointer;
}
.teacher-auth-secondary { border-color: #9cbfe1; background: #f7fbff; color: #174f91; }
.teacher-auth-primary:hover { background: #0f4eaf; }
.teacher-auth-secondary:hover { background: #eef6ff; }
.teacher-auth-primary:disabled { cursor: wait; opacity: .62; }
.teacher-auth-message { min-height: 24px; margin: 14px 0 0; color: #5c6f82; font-size: .88rem; line-height: 1.5; }
.teacher-auth-message[data-tone="bad"] { color: #b42318; }
.teacher-auth-message[data-tone="good"] { color: #087443; font-weight: 800; }
.teacher-auth-back { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; padding: 8px; color: #315a88; font-weight: 850; text-decoration: none; }
.teacher-auth-primary:focus-visible,
.teacher-auth-secondary:focus-visible,
.teacher-auth-back:focus-visible { outline: 3px solid rgb(22 93 204 / 25%); outline-offset: 3px; }
.teacher-signup-card { width: min(100%, 610px); text-align: left; }
.teacher-signup-card .teacher-auth-icon,
.teacher-signup-card h1,
.teacher-signup-card .teacher-auth-guide,
.teacher-signup-card .teacher-auth-message,
.teacher-signup-card .teacher-auth-back { text-align: center; }
.teacher-signup-form { display: grid; gap: 8px; margin-top: 20px; }
.teacher-signup-form > label,
.teacher-signup-grid label { color: #315a88; font-size: .84rem; font-weight: 850; }
.teacher-signup-form label span { color: #73859a; font-weight: 700; }
.teacher-signup-roles { min-width: 0; display: grid; gap: 9px; margin: 4px 0; padding: 0; border: 0; }
.teacher-signup-roles legend { color: #315a88; font-size: .84rem; font-weight: 850; }
.teacher-signup-roles legend strong { margin-left: 4px; color: #b42318; font-size: .72rem; }
.teacher-signup-role-guide { margin: 0; padding: 10px 12px; border: 1px solid #a9cdea; border-radius: 12px; background: #eef7ff; color: #3d5f7d; font-size: .78rem; line-height: 1.55; }
.teacher-signup-role-guide i { margin-right: 5px; color: #165dcc; }
.teacher-signup-role-guide strong { color: #10479a; }
.teacher-signup-role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.teacher-signup-role-grid label { position: relative; min-width: 0; cursor: pointer; }
.teacher-signup-role-grid input { position: absolute; width: 1px; min-height: 1px; opacity: 0; }
.teacher-signup-role-grid label > span { min-height: 96px; display: grid; grid-template-columns: auto 1fr; align-content: center; gap: 3px 9px; padding: 12px; border: 1px solid #b7cde2; border-radius: 14px; background: #fff; color: #315a88; transition: border-color .15s ease, background .15s ease, box-shadow .15s ease; }
.teacher-signup-role-grid label > span > i { grid-row: 1 / span 2; align-self: center; color: #5b7fa5; font-size: 1.15rem; }
.teacher-signup-role-grid label > span > strong { color: #173f73; font-size: .9rem; }
.teacher-signup-role-grid label > span > small { color: #6c7f92; font-size: .72rem; line-height: 1.4; }
.teacher-signup-role-grid input:checked + span { border-color: #165dcc; background: #eaf4ff; box-shadow: 0 0 0 3px rgb(22 93 204 / 14%); }
.teacher-signup-role-grid input:checked + span > i,
.teacher-signup-role-grid input:checked + span > strong { color: #10479a; }
.teacher-signup-role-grid input:focus-visible + span { outline: 3px solid rgb(22 93 204 / 24%); outline-offset: 2px; }
.teacher-signup-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }
.teacher-signup-grid label { display: grid; gap: 6px; }
.teacher-school-search { display: grid; gap: 7px; }
.teacher-school-search > label { color: #315a88; font-size: .84rem; font-weight: 850; }
.teacher-school-search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.teacher-school-search-row button { min-width: 92px; border: 1px solid #165dcc; border-radius: 13px; background: #eef6ff; color: #174f91; font: inherit; font-weight: 900; cursor: pointer; }
.teacher-school-search-row button:disabled { cursor: wait; opacity: .62; }
.teacher-school-search-hint { margin: 0; color: #6c7f92; font-size: .78rem; line-height: 1.45; }
.teacher-school-results { max-height: 270px; overflow: auto; border: 1px solid #a8c8e7; border-radius: 13px; background: #fff; box-shadow: 0 12px 30px rgb(25 70 115 / 14%); }
.teacher-school-option { width: 100%; display: grid; gap: 3px; padding: 12px 14px; border: 0; border-bottom: 1px solid #e3edf6; background: #fff; color: #17324d; text-align: left; cursor: pointer; }
.teacher-school-option:last-child { border-bottom: 0; }
.teacher-school-option:hover,
.teacher-school-option:focus-visible { background: #eef6ff; outline: 0; }
.teacher-school-option strong { color: #10479a; font-size: .94rem; }
.teacher-school-option span { color: #3d566e; font-size: .82rem; }
.teacher-school-option small { color: #75879a; font-size: .76rem; }
.teacher-school-empty { margin: 0; padding: 16px; color: #6c7f92; font-size: .84rem; text-align: center; }
.teacher-school-fallback { display: grid; gap: 8px; padding: 12px; border: 1px dashed #9cbfe1; border-radius: 14px; background: #f7fbff; }
.teacher-school-fallback strong { color: #174f91; font-size: .86rem; }
.teacher-school-fallback p { margin: 0; color: #60768b; font-size: .76rem; line-height: 1.45; }
.teacher-school-fallback > button { min-height: 38px; border: 1px solid #9cbfe1; border-radius: 11px; background: #fff; color: #174f91; font: inherit; font-size: .78rem; font-weight: 850; cursor: pointer; }
.teacher-signup-turnstile { min-height: 65px; display: grid; place-items: center; margin-top: 6px; }
.teacher-school-selected { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 12px; border: 1px solid #8fbce6; border-radius: 14px; background: #eef7ff; }
.teacher-school-selected-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #dbeeff; color: #165dcc; }
.teacher-school-selected > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.teacher-school-selected strong { color: #10479a; font-size: .9rem; }
.teacher-school-selected small { color: #526b82; font-size: .76rem; line-height: 1.4; }
.teacher-school-selected button { min-height: 36px; padding: 7px 10px; border: 1px solid #9cbfe1; border-radius: 10px; background: #fff; color: #174f91; font: inherit; font-size: .78rem; font-weight: 850; cursor: pointer; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

body.auth-page {
  color: #e8edf5;
  background: #0d172b;
}

.auth-page .auth-shell {
  width: min(478px, calc(100% - 32px));
  padding: 48px 0;
}

.auth-page .auth-shell-wide {
  width: min(620px, calc(100% - 32px));
}

.auth-page .auth-card {
  padding: 28px;
  border-color: #40516a;
  border-radius: 18px;
  background: #1c293d;
  box-shadow: 0 26px 70px rgb(0 0 0 / 30%);
}

.auth-page .student-login-back,
.auth-page .eyebrow {
  color: #9fb0c8;
}

.auth-page h1 {
  margin: 16px 0 8px;
  color: #f4f7fb;
  font-size: 24px;
}

.auth-page .auth-guide {
  margin-bottom: 24px;
  padding: 0;
  color: #9fb0c8;
  background: transparent;
}

.auth-page .auth-form label,
.auth-page .reset-result label {
  color: #b8c4d7;
}

.auth-page .auth-form input,
.auth-page .auth-form textarea,
.auth-page .reset-result textarea {
  border-color: #42516a;
  color: #f4f7fb;
  background: #111c30;
}

.auth-page .privacy-note,
.auth-page .student-login-message {
  color: #9fb0c8;
}

.auth-page .signup-password-requirements {
  padding: 14px 16px;
  border: 1px solid #42516a;
  border-radius: 12px;
  color: #b8c4d7;
  background: #111c30;
  font-size: 13px;
  line-height: 1.55;
}

.auth-page .signup-password-requirements ul {
  margin: 8px 0;
  padding-left: 20px;
}

.auth-page .signup-password-requirements p {
  margin: 0;
  color: #9fb0c8;
}

.auth-page .local-preview-login,
.auth-page .reset-result,
.auth-page .reset-success {
  border-color: #365b66;
  background: #142b35;
}

.auth-page .signup-completion-dialog {
  width: min(430px, calc(100% - 32px));
  margin: auto;
  padding: 28px;
  border: 1px solid #3d766e;
  border-radius: 18px;
  color: #e8edf5;
  box-shadow: 0 26px 70px rgb(0 0 0 / 45%);
}

.auth-page .signup-completion-dialog::backdrop {
  background: rgb(5 12 24 / 76%);
}

.auth-page .signup-completion-dialog .primary-link {
  width: 100%;
  justify-content: center;
}

.auth-page .local-preview-login p {
  color: #9fb0c8;
}

.auth-page .secondary-button {
  border-color: #527087;
  color: #d9e7f3;
  background: #17263b;
}

.auth-page .student-login-submit {
  background: #10bd92;
  box-shadow: 0 12px 28px rgb(16 189 146 / 20%);
}

@media (max-width: 820px) {
  .teacher-auth-overlay { align-items: start; padding: 16px; }
  .teacher-auth-card { max-height: none; padding: 26px 20px; border-radius: 26px; }
  .teacher-signup-grid { grid-template-columns: repeat(2, 1fr); }
  .teacher-signup-role-grid { grid-template-columns: 1fr; }
  .teacher-signup-role-grid label > span { min-height: 82px; }
  .teacher-school-search-row { grid-template-columns: 1fr; }
  .teacher-school-search-row button { min-height: 46px; }

  .student-login-page .student-login-shell {
    width: 100%;
    grid-template-columns: 1fr;
  }

  .student-login-page .student-login-visual {
    min-height: 260px;
  }

  .student-login-page .student-login-visual-copy {
    top: 34px;
    right: 26px;
    left: 26px;
    gap: 10px;
  }

  .student-login-page .student-login-panel {
    min-height: auto;
    margin-top: -36px;
    padding: 36px 22px 42px;
    border-top: 3px solid #f1cf61;
    border-left: 0;
    border-radius: 36px 36px 0 0;
    box-shadow: 0 -18px 42px rgb(23 50 77 / 16%);
  }
}

@media (min-width: 821px) and (max-height: 900px) {
  .student-login-page .student-login-panel {
    padding: 18px clamp(44px, 6vw, 72px);
  }

  .student-login-page .student-login-back {
    margin-bottom: 12px;
  }

  .student-login-page .student-login-heading {
    gap: 6px;
    margin-bottom: 10px;
  }

  .student-login-page .student-login-heading h1 {
    font-size: 2.6rem;
  }

  .student-login-page .student-login-form {
    gap: 7px;
  }

  .student-login-page .student-login-form input,
  .student-login-page .student-login-submit {
    min-height: 48px;
  }

  .student-login-page .student-login-remember {
    min-height: 36px;
  }

  .student-login-page .privacy-note {
    margin: 0;
    font-size: 12px;
    line-height: 1.45;
  }

  .student-login-page .local-preview-login {
    gap: 5px;
    padding: 9px 11px;
  }

  .student-login-page .student-login-message {
    margin-top: 5px;
  }

  .student-login-page .student-login-admin-entry {
    gap: 6px;
    margin-top: 8px;
    padding-top: 8px;
  }

  .student-login-page .student-login-admin-button {
    min-height: 44px;
  }
}
.entry-privacy-link{display:block;margin-top:14px;text-align:center;color:inherit;text-decoration:underline;text-underline-offset:3px;font-size:.85rem;opacity:.78}.teacher-signup-privacy{display:flex!important;align-items:flex-start;gap:10px;line-height:1.55}.teacher-signup-privacy input{width:18px!important;height:18px!important;margin-top:3px;flex:0 0 auto}.teacher-signup-privacy a{font-weight:700;color:inherit}