/* ???? - ????????????? */
/* ??????? 390px */

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  -webkit-text-size-adjust: 100% !important;
  -moz-text-size-adjust: 100% !important;
  -ms-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

body {
  margin: 0;
  font-family: "Noto Serif SC", "Songti SC", "SimSun", serif;
  background-color: #20444c;
  color: #9B7B5C;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

img {
  display: block;
  max-width: 100%;
  border: 0;
}

ul {
  list-style: none;
}

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  outline: none;
  background: transparent;
}

/* ========== ???? ========== */
.page {
  position: relative;
  width: 100%;
  max-width: 390px;
  min-height: 100vh;
  margin: 0 auto;
  background-color: #20444c;
  background-image: -webkit-linear-gradient(left, #20444c 0%, #20444c 100%);
  background-image: linear-gradient(90deg, #20444c 0%, #20444c 100%);
  padding-bottom: 24.33px;
  overflow-x: hidden;
}

/* ========== ???? ========== */
.header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 100;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  height: 64px;
  padding: 0 20px;
  padding-bottom: 1px;
  background-color: rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(216, 200, 176, 0.4);
  -webkit-box-shadow: 0px 1px 2px 0px rgba(155, 123, 92, 0.05);
  box-shadow: 0px 1px 2px 0px rgba(155, 123, 92, 0.05);
}

.header-brand {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 16.5px;
  letter-spacing: 3px;
  text-transform: uppercase;
  text-align: right;
  color: #d8c8b0;
  padding-top: 4.5px;
  padding-bottom: 2.5px;
}

/* ========== ???? ========== */
.main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  padding-top: 32px;
  padding-bottom: 128px;
  gap: 48px;
}

/* ========== ????? ========== */
.brand-section {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  padding: 0 20px;
}

.brand-heading {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px;
  padding-bottom: 8px;
}

.brand-logo {
  width: 112px;
  height: 135px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  object-fit: cover;
}

.brand-slogan {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #c7ac63;
  white-space: nowrap;
}

.brand-slogan-en {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 600;
  font-size: 12px;
  line-height: 16.5px;
  letter-spacing: 0.55px;
  text-transform: uppercase;
  text-align: center;
  color: #d8d1ca;
  white-space: nowrap;
  padding: 0 30px;
}

/* ========== ????? ========== */
.cards-section {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  padding: 0 20px;
  gap: 16px;
}

.divider-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding-bottom: 16px;
}

.divider-ornament-top {
  width: 9.76px;
  height: 17.76px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  object-fit: contain;
}

.divider-line-solid {
  width: 48px;
  height: 1px;
  background-color: #d8c8b0;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.divider-bottom {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding-bottom: 16px;
}

.divider-ornament-bottom {
  width: 1.635px;
  height: 9.635px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  object-fit: contain;
}

/* ????? flex?????/???? */
.card-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  gap: 16px;
}

.coop-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  padding: 17px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 20px rgba(155, 123, 92, 0.07);
  box-shadow: 0px 4px 20px rgba(155, 123, 92, 0.07);
}

.card-icon-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  background-color: rgba(216, 200, 176, 0.1);
  border-radius: 9999px;
}

.card-icon {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  object-fit: contain;
}

.card-icon-edu {
  width: 24.904px;
  height: 20.336px;
}

.card-icon-handshake {
  width: 26.268px;
  height: 23.726px;
}

.card-icon-medical {
  width: 23.75px;
  height: 23.125px;
}

.card-icon-skin {
  width: 23.269px;
  height: 22.933px;
}

.card-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 4px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 0;
  -ms-flex: 1 0 0px;
  flex: 1 0 0;
  min-width: 0;
}

.card-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #9b7b5c;
  width: 100%;
}

.card-desc {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: #435d63;
  width: 100%;
}

/* ????? */
.card-sep {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
}

.sep-line {
  display: block;
  width: 40px;
  height: 1px;
  margin: 0 12px;
  background-color: rgba(216, 200, 176, 0.4);
}

.sep-diamond {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  letter-spacing: 2px;
  text-align: center;
  color: #d8c8b0;
  white-space: nowrap;
}

/* ========== ?????? ========== */
.form-section {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  padding: 0 20px;
  gap: 31px;
}

.form-heading {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  gap: 4px;
}

.form-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #9b7b5c;
  width: 100%;
  white-space: nowrap;
}

.form-subtitle {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 16.5px;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  text-align: center;
  color: #b8a898;
  width: 100%;
  white-space: nowrap;
}

.coop-form {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  gap: 15px;
}

.form-field {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  gap: 10px;
}

.form-field-textarea {
  padding-bottom: 6px;
}

.form-label {
  display: block;
  width: 100%;
  padding: 0 4px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 14.4px;
  color: #9b7b5c;
}

.form-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  gap: 16px;
}

.form-field-half {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}

.select-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding: 8px 8px 8px 16px;
  background-color: #f8f5f0;
  border-radius: 10px;
}

.form-select {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  min-width: 0;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: rgba(184, 168, 152, 0.6);
  background-color: transparent;
  cursor: pointer;
}

.form-select:valid {
  color: #435d63;
}

.form-select option {
  color: #435d63;
}

.form-select option[value=""] {
  color: rgba(184, 168, 152, 0.6);
}

.select-arrow {
  width: 24px;
  height: 24px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  pointer-events: none;
  object-fit: contain;
}

.form-input {
  display: block;
  width: 100%;
  height: 56px;
  padding: 16.5px 16px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #435d63;
  background-color: #f8f5f0;
  border-radius: 10px;
}

.form-input::-webkit-input-placeholder {
  color: rgba(184, 168, 152, 0.6);
}

.form-input::-moz-placeholder {
  color: rgba(184, 168, 152, 0.6);
  opacity: 1;
}

.form-input:-ms-input-placeholder {
  color: rgba(184, 168, 152, 0.6);
}

.form-input::placeholder {
  color: rgba(184, 168, 152, 0.6);
}

.form-textarea {
  display: block;
  width: 100%;
  min-height: 128px;
  padding: 16px 16px 88px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #435d63;
  background-color: #f8f5f0;
  border-radius: 10px;
  resize: vertical;
  overflow: auto;
}

.form-textarea::-webkit-input-placeholder {
  color: rgba(184, 168, 152, 0.6);
}

.form-textarea::-moz-placeholder {
  color: rgba(184, 168, 152, 0.6);
  opacity: 1;
}

.form-textarea:-ms-input-placeholder {
  color: rgba(184, 168, 152, 0.6);
}

.form-textarea::placeholder {
  color: rgba(184, 168, 152, 0.6);
}

.submit-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 57px;
  padding-top: 1px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #ffffff;
  background-color: #9b7b5c;
  border-radius: 10px;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(216, 200, 176, 0.2),
    0px 4px 6px -4px rgba(216, 200, 176, 0.2);
  box-shadow:
    0px 10px 15px -3px rgba(216, 200, 176, 0.2),
    0px 4px 6px -4px rgba(216, 200, 176, 0.2);
  cursor: pointer;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}

.submit-btn:hover,
.submit-btn:active {
  opacity: 0.92;
}

/* ========== ?? ========== */
.footer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding-top: 33px;
  padding-bottom: 40px;
  border-top: 1px solid rgba(32, 68, 76, 0.1);
}

.footer-text {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 1.2px;
  text-align: center;
  color: #ffffff;
  white-space: nowrap;
}

.footer-brand {
  font-weight: 600;
  color: #dab866;
}

/* ========== ??? login.html ========== */

.login-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.login-status-bar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: none;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  height: 44px;
  padding-left: 24px;
  padding-right: 24px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-status-time {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.7);
  white-space: nowrap;
}

.login-status-icons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 6px;
}

.login-status-signal {
  width: 14.25px;
  height: 14.25px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-status-wifi {
  width: 17.192px;
  height: 11.957px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-status-battery {
  width: 14.25px;
  height: 6.836px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 auto;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  width: 100%;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

.login-brand {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding-top: 40px;
  padding-left: 24px;
  padding-right: 24px;
}

.login-logo {
  width: 112px;
  height: 140px;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-tagline {
  margin-top: 8px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 5px;
  text-align: center;
  text-transform: uppercase;
  color: #d8d1ca;
  white-space: nowrap;
}

.login-divider {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
}

.login-divider-line {
  width: 32px;
  height: 1px;
  background-color: #f4f0ec;
  opacity: 0.3;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-divider-line-right {
  background-color: #fffbf6;
}

.login-diamond {
  width: 11.712px;
  height: 11.712px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-title {
  margin-top: 16px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 21px;
  letter-spacing: 2.8px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.login-form-section {
  width: 100%;
  padding-top: 48px;
  padding-left: 32px;
  padding-right: 32px;
}

.login-form {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.login-field {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.login-field-password {
  padding-bottom: 0;
}

.login-label {
  display: block;
  padding-left: 4px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  color: #d8d1ca;
}

.login-input-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 48px;
  padding-left: 20px;
  padding-right: 16px;
  background-color: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(216, 200, 176, 0.15);
  border-radius: 12px;
}

.login-input-icon {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-icon-user {
  width: 15px;
  height: 14.615px;
  margin-right: 13px;
}

.login-icon-lock {
  width: 15px;
  height: 19.5px;
  margin-right: 13px;
}

.login-input {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: normal;
  color: #ffffff;
}

.login-input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.2);
}

.login-input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.2);
}

.login-input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.2);
}

.login-input::placeholder {
  color: rgba(255, 255, 255, 0.2);
}

.login-input-password {
  padding-right: 8px;
}

.login-eye-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.login-eye-icon {
  width: 17.436px;
  height: 15.57px;
}

.login-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 50px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 6.4px;
  text-align: center;
  color: #fcfaf7;
  background-color: #9b7b5c;
  border-radius: 30px;
  -webkit-box-shadow: 0px 4px 10px rgba(155, 123, 92, 0.2);
  box-shadow: 0px 4px 10px rgba(155, 123, 92, 0.2);
  cursor: pointer;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}

.login-btn:hover,
.login-btn:active {
  opacity: 0.92;
}

.login-forgot {
  padding-top: 8px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
  color: rgba(255, 255, 255, 0.3);
}

.login-role-tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
  margin-bottom: 24px;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.login-role-tab {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0;
  flex: 1 1 0;
  min-width: 0;
  padding: 10px 6px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 4px;
  background: transparent;
  font-family: "Noto Sans SC", "PingFang SC", sans-serif;
  font-size: 13px;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.55);
  text-align: center;
  cursor: pointer;
}

.login-role-tab-active {
  border-color: #dab866;
  color: #dab866;
  background: rgba(218, 184, 102, 0.1);
}

.login-spacer {
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 auto;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  min-height: 80px;
  width: 100%;
}

.login-footer {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding-bottom: 40px;
}

/* ========== ?????? students.html ========== */

.students-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
  background-color: #20444c;
}

.students-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  padding-left: 16px;
  padding-right: 16px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.students-header-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  letter-spacing: 0.425px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.students-main {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  padding-top: 16px;
  padding-bottom: 72px;
  overflow-x: hidden;
  overflow-y: auto;
}

.students-search-section {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 16px;
}

.students-search-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 40px;
  padding-left: 13px;
  padding-right: 13px;
  background-color: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(216, 200, 176, 0.1);
  border-radius: 8px;
}

.students-search-icon {
  width: 15px;
  height: 15px;
  margin-right: 8px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.students-search-input {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: normal;
  color: #ffffff;
}

.students-search-input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.3);
}

.students-search-input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.3);
}

.students-search-input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.3);
}

.students-search-input::placeholder {
  color: rgba(255, 255, 255, 0.3);
}

.students-search-input::-webkit-search-decoration,
.students-search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
}

.students-count {
  padding-top: 4.5px;
  padding-bottom: 1.5px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.4);
}

.students-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding-left: 16px;
  padding-right: 16px;
}

.student-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 17px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.08);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.student-card-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  gap: 8px;
}

.student-divider {
  width: 100%;
  height: 0;
  border-top: 1px solid rgba(216, 200, 176, 0.1);
}

.student-card-meta {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}

.student-major {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 19.5px;
  color: #435d63;
}

.student-school {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.75);
}

.student-card-identity {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.student-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 24px;
  color: #20444c;
  white-space: nowrap;
}

.student-photo-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 3px 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.student-badge {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 6px 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 16.5px;
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  background-color: #9b7b5c;
  border-radius: 8px;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.student-card-contacts {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}

.student-contact {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}

.student-contact-teacher {
  padding-left: 17px;
  border-left: 1px solid rgba(216, 200, 176, 0.2);
}

.student-contact-label {
  margin-bottom: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: rgba(155, 123, 92, 0.8);
}

.student-contact-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 19.5px;
  color: #9b7b5c;
}

.student-card-intro {
  width: 100%;
  padding-top: 12px;
  margin-top: 4px;
  border-top: 1px solid rgba(216, 200, 176, 0.2);
}

.student-intro-text {
  margin: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 20px;
  color: #9b7b5c;
  word-break: break-word;
  white-space: pre-wrap;
}

.student-intro-empty {
  color: rgba(155, 123, 92, 0.55);
}

.students-tabbar {
  position: fixed;
  bottom: 0;
  left: 50%;
  z-index: 100;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  width: 100%;
  max-width: 390px;
  height: 56px;
  padding-left: 43px;
  padding-right: 43px;
  background-color: #20444c;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.students-tab {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-decoration: none;
  opacity: 0.4;
}

.students-tab-active {
  opacity: 1;
}

.students-tab-icon {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.students-tab-icon-students {
  width: 22px;
  height: 16px;
}

.students-tab-icon-evaluate {
  width: 18px;
  height: 20px;
}

.students-tab-icon-exception {
  width: 15px;
  height: 17px;
}

.students-tab-label {
  margin-top: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 10px;
  line-height: 15px;
  color: #9B7B5C;
  white-space: nowrap;
}

.students-tab-active .students-tab-label {
  color: #fcfaf7;
}

/* ========== 照片预览弹窗 ========== */

.photo-modal {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 200;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 24px;
}

.photo-modal[hidden] {
  display: none;
}

.photo-modal-mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(32, 68, 76, 0.75);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.photo-modal-panel {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  max-width: 342px;
  max-height: calc(100vh - 48px);
}

.photo-modal-close {
  position: absolute;
  top: -44px;
  right: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background-color: rgba(252, 250, 247, 0.92);
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}

.photo-modal-img {
  display: block;
  width: 100%;
  max-height: calc(100vh - 96px);
  -o-object-fit: contain;
  object-fit: contain;
  border-radius: 8px;
  background-color: #fcfaf7;
}

/* ========== 提交结果弹窗 ========== */

.message-modal {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 300;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 24px;
}

.message-modal[hidden] {
  display: none;
}

.message-modal-mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(32, 68, 76, 0.75);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.message-modal-panel {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 20px;
  width: 100%;
  max-width: 300px;
  padding: 28px 24px 24px;
  background-color: #fcfaf7;
  border-radius: 12px;
  -webkit-box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.message-modal-icon {
  width: 64px;
  height: 64px;
  -o-object-fit: contain;
  object-fit: contain;
}

.message-modal-text {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #20444c;
  word-break: break-word;
}

.message-modal-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 44px;
  padding: 0 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 22px;
  color: #fcfaf7;
  background-color: #9b7b5c;
  border: 0;
  border-radius: 9999px;
  cursor: pointer;
}

.message-modal-error .message-modal-btn {
  background-color: #c96a62;
}

/* ========== ????? evaluate.html ========== */

.evaluate-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.evaluate-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evaluate-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evaluate-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.evaluate-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #fcfaf7;
  white-space: nowrap;
}

.evaluate-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evaluate-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 32px 24px 48px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.evaluate-student {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding-bottom: 16px;
}

.evaluate-student-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 33px;
  letter-spacing: 1.1px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.evaluate-student-status {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 1.2px;
  text-align: center;
  text-transform: uppercase;
  color: #fcfaf7;
  white-space: nowrap;
}

.evaluate-report-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 25px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.12);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.12);
}

.evaluate-period {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}

.evaluate-period-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
  text-align: center;
  color: #042e35;
  white-space: nowrap;
}

.evaluate-period-range {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  color: rgba(155, 123, 92, 0.7);
  white-space: nowrap;
}

.evaluate-report-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(216, 200, 176, 0.2);
}

.evaluate-report-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  color: #9b7b5c;
  white-space: nowrap;
}

.evaluate-self-score {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
  -webkit-align-items: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  gap: 4px;
}

.evaluate-self-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  color: #9b7b5c;
  white-space: nowrap;
}

.evaluate-self-num {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 36px;
  color: #9b7b5c;
  white-space: nowrap;
}

.evaluate-fen-icon {
  width: 11.133px;
  height: 10.993px;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evaluate-report-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.evaluate-report-block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.evaluate-report-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: #9b7b5c;
}

.evaluate-report-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 350;
  font-size: 14px;
  line-height: 26px;
  color: #41484a;
}

.evaluate-photo-box {
  width: 275px;
  max-width: 100%;
  height: 189px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evaluate-photo {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

.evaluate-score-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 448px;
  padding: 24px;
  background-color: #fcfaf7;
  border-radius: 8px;
}

.evaluate-score-intro {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  padding-top: 16px;
  padding-bottom: 17px;
  border-bottom: 1px solid rgba(155, 123, 92, 0.1);
}

.evaluate-score-intro-head {
  width: 100%;
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(155, 123, 92, 0.1);
}

.evaluate-score-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  color: #9b7b5c;
  white-space: nowrap;
}

.evaluate-standard {
  width: 100%;
}

.evaluate-standard-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 33.6px;
  color: #9b7b5c;
}

.evaluate-standard-desc {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: rgba(155, 123, 92, 0.6);
}

.evaluate-score-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding-top: 16px;
  padding-bottom: 8px;
}

.evaluate-score-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}

.evaluate-score-name {
  display: block;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: #9b7b5c;
}

.evaluate-score-desc {
  padding-bottom: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  color: rgba(65, 72, 74, 0.7);
}

.evaluate-score-input {
  width: 100%;
  height: 42px;
  padding: 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #41484a;
  background-color: #faf9f9;
  border: 1px solid rgba(216, 200, 176, 0.25);
  border-radius: 8px;
}

.evaluate-score-input::-webkit-input-placeholder {
  color: #6b7280;
}

.evaluate-score-input::-moz-placeholder {
  color: #6b7280;
}

.evaluate-score-input:-ms-input-placeholder {
  color: #6b7280;
}

.evaluate-score-input::placeholder {
  color: #6b7280;
}

.evaluate-score-input::-webkit-outer-spin-button,
.evaluate-score-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.evaluate-score-input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}

.evaluate-total {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding-top: 17px;
  border-top: 1px solid rgba(216, 200, 176, 0.3);
}

.evaluate-total-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #9b7b5c;
  white-space: nowrap;
}

.evaluate-total-num {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 900;
  font-size: 30px;
  line-height: 36px;
  color: #20444c;
  white-space: nowrap;
}

.evaluate-comment {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.evaluate-comment-label {
  display: block;
  padding-left: 4px;
  padding-right: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
}

.evaluate-comment-input {
  display: block;
  width: 100%;
  height: 128px;
  padding: 17px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: #41484a;
  background-color: #ffffff;
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 8px;
  resize: none;
  overflow: auto;
}

.evaluate-comment-input::-webkit-input-placeholder {
  color: #6b7280;
}

.evaluate-comment-input::-moz-placeholder {
  color: #6b7280;
}

.evaluate-comment-input:-ms-input-placeholder {
  color: #6b7280;
}

.evaluate-comment-input::placeholder {
  color: #6b7280;
}

.evaluate-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  max-width: 448px;
  padding-top: 24px;
}

.evaluate-submit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 1.6px;
  text-align: center;
  color: #fcfaf7;
  background-color: #9b7b5c;
  border-radius: 9999px;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  cursor: pointer;
}

.evaluate-history {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 56px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 1.6px;
  text-align: center;
  text-decoration: none;
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid #9b7b5c;
  border-radius: 9999px;
}

.evaluate-history-arrow {
  width: 6.167px;
  height: 10px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

/* ========== ????? records.html ========== */

.records-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.records-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.records-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.records-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.records-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.records-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.records-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 24px 24px 48px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.records-profile-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding: 24px;
  background-color: #fcfaf7;
  border-radius: 8px;
}

.records-profile-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 24px;
}

.records-photo-placeholder {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 96px;
  height: 128px;
  background-color: rgba(216, 200, 176, 0.1);
  border: 1px dashed rgba(216, 200, 176, 0.4);
  border-radius: 4px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.records-photo-text {
  padding-top: 4px;
  padding-left: 4px;
  padding-right: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  text-align: center;
  color: #9B7B5C;
  white-space: nowrap;
}

.records-profile-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.records-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  color: #1a1c1c;
  white-space: nowrap;
}

.records-grade {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 19.5px;
  letter-spacing: 0.325px;
  color: #9b7b5c;
  white-space: nowrap;
}

.records-meta {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 24px;
  color: #9b7b5c;
}

.records-self-eval {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 7.375px;
  width: 100%;
}

.records-self-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.6);
}

.records-self-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 22.75px;
  color: #9b7b5c;
}

.records-stats-card,
.records-leave-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 24px;
  background-color: #fcfaf7;
  border-radius: 8px;
}

.records-section-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 16.5px;
  color: #9b7b5c;
}

.records-stats-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 16px;
  width: 100%;
}

.records-stat {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}

.records-stat-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 19.5px;
  color: rgba(67, 93, 99, 0.6);
}

.records-stat-value {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 27px;
  color: #9b7b5c;
}

.records-leave-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  line-height: 19.5px;
}

.records-leave-label {
  font-weight: 400;
  font-size: 12px;
  color: rgba(67, 93, 99, 0.6);
}

.records-leave-value {
  font-weight: 500;
  font-size: 16px;
  color: #9b7b5c;
}

.records-tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 9999px;
}

.records-tab {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  height: 34.5px;
  padding: 6px 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 22.5px;
  text-align: center;
  color: rgba(216, 200, 176, 0.6);
  background-color: transparent;
  border-radius: 9999px;
  cursor: pointer;
  white-space: nowrap;
}

.records-tab-active {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 160px;
  -ms-flex: 0 0 160px;
  flex: 0 0 160px;
  max-width: 160px;
  padding-left: 36px;
  padding-right: 36px;
  font-weight: 700;
  color: #fcfaf7;
  background-color: #9b7b5c;
}

.records-filters {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 17px;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.records-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}

.records-filter-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #dab866;
}

.records-filter-value {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 4px;
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #dab866;
  white-space: nowrap;
}

.records-filter-arrow {
  width: 8px;
  height: 4.933px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.records-filter-divider {
  width: 1px;
  height: 32px;
  background-color: rgba(216, 200, 176, 0.2);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.records-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}

.records-card {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding: 24px;
  background-color: #fcfaf7;
  border-radius: 8px;
  -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
}

.records-card-hit {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
}

.records-card-actions {
  position: relative;
  z-index: 2;
}

.records-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  min-height: 24px;
}

.records-card-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 22.5px;
  color: #20444c;
  white-space: nowrap;
}

.records-card-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.records-card-score {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 22.5px;
  color: #9b7b5c;
  white-space: nowrap;
}

.records-edit-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 3px 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid rgba(155, 123, 92, 0.3);
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
}

.records-card-meta {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding-bottom: 8px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: #1a1c1c;
  white-space: nowrap;
}

.records-card-divider {
  width: 100%;
  height: 1px;
  background-color: rgba(155, 123, 92, 0.05);
}

.records-card-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding-top: 8px;
}

.records-card-comment {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 19.5px;
  color: rgba(155, 123, 92, 0.85);
}

.records-card-badge {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 4px 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  color: #7a9b7a;
  background-color: rgba(122, 155, 122, 0.1);
  border-radius: 8px;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  text-decoration: none;
}

.records-card-badge-pending,
a.records-card-badge-pending {
  color: #fcfaf7;
  background-color: rgba(155, 123, 92, 0.65);
}

a.records-card-badge:active {
  opacity: 0.85;
}

/* ========== ????? exceptions.html ========== */

.exceptions-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.exceptions-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exceptions-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exceptions-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.exceptions-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.exceptions-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exceptions-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  min-height: 0;
  padding: 16px 16px 176px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.exceptions-tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 9999px;
}

.exceptions-tab {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  height: 34.5px;
  padding: 6px 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 22.5px;
  text-align: center;
  color: rgba(216, 200, 176, 0.6);
  background-color: transparent;
  border-radius: 9999px;
  cursor: pointer;
  white-space: nowrap;
}

.exceptions-tab-active {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  padding-left: 36px;
  padding-right: 36px;
  font-weight: 700;
  color: #fcfaf7;
  background-color: #9b7b5c;
}

.exceptions-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.exception-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 16px;
  overflow: hidden;
  background-color: #fcfaf7;
  border-radius: 8px;
  -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05);
}

.exception-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  min-height: 27px;
}

.exception-card-identity {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.exception-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 27px;
  color: #042e35;
  white-space: nowrap;
}

.exception-photo-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 3px 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-badge {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 2px 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  border-radius: 9999px;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-badge-pending {
  color: #c67a7a;
  background-color: rgba(198, 122, 122, 0.1);
}

.exception-badge-done {
  color: #7a9b7a;
  background-color: rgba(122, 155, 122, 0.1);
}

.exception-card-fields {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 5.5px;
  width: 100%;
}

.exception-field {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.exception-field-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  white-space: nowrap;
}

.exception-field-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #41484a;
  white-space: nowrap;
}

.exception-desc {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 26px;
  color: #435d63;
}

.exception-note {
  width: 100%;
  padding: 8px 8px 8px 10px;
  background-color: rgba(216, 200, 176, 0.15);
  border-left: 2px solid rgba(155, 123, 92, 0.3);
  border-radius: 4px;
}

.exception-note-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  /*white-space: nowrap;*/
}

.exceptions-fab {
  position: fixed;
  right: 16px;
  bottom: 96px;
  z-index: 50;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 56px;
  padding-left: 16px;
  padding-right: 16px;
  text-decoration: none;
  background-color: #9b7b5c;
  border-radius: 9999px;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.exceptions-fab-icon {
  width: 14px;
  height: 14px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exceptions-fab-text {
  padding-left: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 21px;
  text-align: center;
  color: #fcfaf7;
  white-space: nowrap;
}

/* ========== ????? exception-add.html ========== */

.exception-add-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.exception-add-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-add-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-add-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.exception-add-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.exception-add-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-add-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding: 24px 16px 48px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.exception-add-form {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 32px;
  width: 100%;
  max-width: 448px;
}

.exception-add-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 32px;
  width: 100%;
  padding: 25px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.25);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.exception-add-field {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.exception-add-field:nth-child(2) {
  gap: 16px;
}

.exception-add-label {
  display: block;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #9b7b5c;
}

.exception-add-select-wrap {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 48px;
  padding-left: 17px;
  padding-right: 40px;
  background-color: #f4f3f4;
  border: 1px solid #f1e0c7;
  border-radius: 8px;
}

.exception-add-select {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  height: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #1a1c1c;
  background-color: transparent;
  cursor: pointer;
}

.exception-add-select-arrow {
  position: absolute;
  right: 9px;
  top: 50%;
  width: 24px;
  height: 24px;
  margin-top: -12px;
  pointer-events: none;
}

.exception-add-type-grid {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
}

.exception-add-type {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: calc(50% - 6px);
  height: 42.8px;
  padding: 13px;
  background-color: #f4f3f4;
  border: 1px solid #f1e0c7;
  border-radius: 8px;
  cursor: pointer;
}

.exception-add-radio {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.exception-add-radio-ui {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-right: 12px;
  background-color: transparent;
  border: 1px solid #695d49;
  border-radius: 9999px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-add-radio-ui::after {
  content: "";
  width: 6px;
  height: 6px;
  background-color: #ffffff;
  border-radius: 9999px;
}

.exception-add-radio:checked + .exception-add-radio-ui {
  background-color: #9b7b5c;
  border-color: #9b7b5c;
}

.exception-add-radio:checked + .exception-add-radio-ui::after {
  background-color: #ffffff;
}

.exception-add-type-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #41484a;
  white-space: nowrap;
}

.exception-add-textarea {
  display: block;
  width: 100%;
  min-height: 154px;
  padding: 17px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #1a1c1c;
  background-color: #f4f3f4;
  border: 1px solid #f1e0c7;
  border-radius: 8px;
  resize: none;
}

.exception-add-textarea::-webkit-input-placeholder {
  color: #c1c8ca;
}

.exception-add-textarea::-moz-placeholder {
  color: #c1c8ca;
}

.exception-add-textarea:-ms-input-placeholder {
  color: #c1c8ca;
}

.exception-add-textarea::placeholder {
  color: #c1c8ca;
}

.exception-add-uploads {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
}

.exception-add-upload-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 96px;
  height: 96px;
  background-color: #f4f3f4;
  border: 2px dashed #f1e0c7;
  border-radius: 8px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-add-file {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.exception-add-upload-icon {
  width: 22px;
  height: 20px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-add-upload-text {
  margin-top: 3px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  color: #71787a;
  white-space: nowrap;
}

.exception-add-preview {
  position: relative;
  width: 96px;
  height: 96px;
  overflow: hidden;
  border-radius: 8px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exception-add-preview-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

.exception-add-preview-del {
  position: absolute;
  right: 4px;
  top: 4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 4px;
  cursor: pointer;
}

.exception-add-trash {
  width: 16px;
  height: 18px;
}

.exception-add-submit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
  letter-spacing: 1.8px;
  text-align: center;
  color: #ffffff;
  background-color: #9b7b5c;
  border-radius: 8px;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  cursor: pointer;
}

/* ========== ??????? alerts.html ========== */

.alerts-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.alerts-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  padding-left: 16px;
  padding-right: 16px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.alerts-header-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  letter-spacing: 0.425px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.alerts-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding: 16px 24px 48px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.alerts-tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 16px;
  width: 100%;
  padding: 16px;
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 20px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 20px rgba(32, 68, 76, 0.08);
}

.alerts-tab {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: calc(50% - 8px);
  padding: 4px 0 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  text-align: center;
  color: #9B7B5C;
  background-color: transparent;
  cursor: pointer;
  white-space: nowrap;
}

.alerts-tab-active {
  font-weight: 600;
  color: #fcfaf7;
}

.alerts-tab-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1.5px;
  background-color: #fcfaf7;
}

.alerts-toolbar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  gap: 12px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.alerts-date {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  min-height: 21px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.alerts-calendar-icon {
  width: 13.5px;
  height: 15px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.alerts-date-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #fcfaf7;
  white-space: nowrap;
}

.alerts-filter-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  padding: 7px 13px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #9B7B5C;
  background-color: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 9999px;
  cursor: pointer;
  white-space: nowrap;
}

.alerts-filter-arrow {
  width: 7px;
  height: 4.317px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.alerts-count {
  padding-left: 4px;
  padding-right: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(252, 250, 247, 0.6);
  white-space: nowrap;
}

.alerts-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.alert-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding: 16px;
  background-color: #fcfaf7;
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.alert-card-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.alert-card-identity {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.alert-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  color: #20444c;
  white-space: nowrap;
}

.alert-photo-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 3px 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.alert-time {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.alert-major {
  padding-bottom: 8px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 19.5px;
  color: #435d63;
}

.alert-divider {
  width: 100%;
  height: 1px;
  background-color: rgba(216, 200, 176, 0.06);
}

.alert-badge {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  padding: 2px 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
  line-height: 18px;
  color: #c96a62;
  background-color: rgba(201, 106, 98, 0.12);
  border-radius: 4px;
  white-space: nowrap;
}

.alert-slot-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.alert-slot-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding-top: 12px;
  border-top: 1px solid rgba(32, 68, 76, 0.08);
}

.alert-slot-item:first-child {
  padding-top: 0;
  border-top: none;
}

.alert-slot-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.alert-slot-type {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 21px;
  color: #20444c;
  white-space: nowrap;
}

.alert-card-status {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding-top: 8px;
}

.alert-status,
.alert-overtime {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  white-space: nowrap;
}

.alert-status-absent,
.alert-status-late,
.alert-status-abnormal {
  color: #c96a62;
  font-weight: 500;
}

.alert-reason {
  padding-top: 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 19.5px;
  color: rgba(155, 123, 92, 0.85);
}

.alert-location {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  opacity: 0.8;
}

.alert-location-icon {
  width: 10.667px;
  height: 13.333px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.alert-location-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #20444c;
  white-space: nowrap;
}

/* ========== ?????? ========== */

.date-picker {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 200;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.date-picker[hidden] {
  display: none;
}

.date-picker-mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(4, 46, 53, 0.85);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.date-picker-sheet {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: 390px;
  overflow: hidden;
  background-color: #fcfaf7;
  border-radius: 16px 16px 0 0;
  -webkit-box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.date-picker-handle {
  width: 40px;
  height: 4px;
  margin-top: 12px;
  margin-bottom: 4px;
  background-color: #c1c8ca;
  opacity: 0.4;
  border-radius: 9999px;
}

.date-picker-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #20444c;
  white-space: nowrap;
}

.date-picker-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  padding: 8px 24px;
}

.date-picker-month {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
}

.date-picker-nav {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 9999px;
  cursor: pointer;
}

.date-picker-nav:disabled {
  opacity: 0.35;
  cursor: default;
}

.date-picker-nav-icon {
  width: 7.4px;
  height: 12px;
}

.date-picker-month-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 1.6px;
  color: #20444c;
  white-space: nowrap;
}

.date-picker-weekdays {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
  padding-top: 16px;
}

.date-picker-weekdays span {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  color: #20444c;
  opacity: 0.6;
}

.date-picker-days {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}

.date-picker-day {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: calc((100% - 48px) / 7);
  aspect-ratio: 1 / 1;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #20444c;
  background-color: transparent;
  border-radius: 9999px;
  cursor: pointer;
}

.date-picker-day-empty {
  visibility: hidden;
  pointer-events: none;
  cursor: default;
}

.date-picker-day-active {
  font-weight: 700;
  color: #ffffff;
  background-color: #9b7b5c;
}

.date-picker-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
  padding: 25px 24px 24px;
  background-color: rgba(255, 255, 255, 0.5);
  border-top: 1px solid rgba(241, 224, 199, 0.3);
}

.date-picker-cancel,
.date-picker-confirm {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 164px;
  max-width: calc(50% - 8px);
  padding: 13px 24px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
}

.date-picker-cancel {
  font-weight: 400;
  color: #20444c;
  background-color: transparent;
  border: 1px solid rgba(0, 0, 0, 0.26);
}

.date-picker-confirm {
  width: 162px;
  font-weight: 700;
  color: #ffffff;
  background-color: #9b7b5c;
  border: none;
  -webkit-box-shadow:
    0px 4px 6px -1px rgba(0, 0, 0, 0.1),
    0px 2px 4px -2px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 4px 6px -1px rgba(0, 0, 0, 0.1),
    0px 2px 4px -2px rgba(0, 0, 0, 0.1);
}

/* ========== ????? result.html ========== */

.result-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.result-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.result-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.result-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.result-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.result-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.result-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 16px 16px 48px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.result-student {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding: 2px 8px;
}

.result-student-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 33px;
  color: #dab866;
}

.result-student-meta {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 19.5px;
  color: #fcfaf7;
}

.result-week-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding: 25px;
  background-color: #ffffff;
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.result-week-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  text-align: center;
  color: #9b7b5c;
  white-space: nowrap;
}

.result-week-range {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 25.6px;
  text-align: center;
  color: #41484a;
  white-space: nowrap;
}

.result-summary-card,
.result-mentor-card {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 25px;
  overflow: hidden;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
}

.result-summary-card {
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.12);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.12);
}

.result-mentor-card {
  -webkit-box-shadow: 0px 4px 20px rgba(32, 68, 76, 0.12);
  box-shadow: 0px 4px 20px rgba(32, 68, 76, 0.12);
}

.result-mentor-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 64px;
  height: 64px;
  background-color: rgba(216, 200, 176, 0.1);
  border-radius: 0 0 0 9999px;
  pointer-events: none;
}

.result-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(216, 200, 176, 0.2);
}

.result-card-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  color: #9b7b5c;
  white-space: nowrap;
}

.result-score {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
  -webkit-align-items: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  gap: 4px;
}

.result-score-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  white-space: nowrap;
}

.result-score-num {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 36px;
  white-space: nowrap;
}

.result-fen-icon {
  width: 11.133px;
  height: 10.993px;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.result-score-self .result-score-label,
.result-score-self .result-score-num {
  color: #9b7b5c;
}

.result-score-mentor .result-score-label,
.result-score-mentor .result-score-num {
  color: #20444c;
}

.result-summary-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.result-block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.result-block-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: #9b7b5c;
}

.result-block-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 350;
  font-size: 14px;
  line-height: 26px;
  color: #41484a;
}

.result-mentor-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.result-mentor-name {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #1a1c1c;
  white-space: nowrap;
}

.result-mentor-quote {
  margin: 0;
  padding: 4px 0 4px 18px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 350;
  font-size: 14px;
  line-height: 26px;
  color: #41484a;
  border-left: 2px solid rgba(216, 200, 176, 0.3);
}

.result-mentor-time {
  padding-top: 7px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  text-align: right;
  color: #41484a;
  opacity: 0.4;
  white-space: nowrap;
}

/* ========== ???????? ledger.html ========== */

.ledger-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.ledger-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.ledger-header-title {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  letter-spacing: 0.425px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.ledger-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  min-height: 0;
  padding: 16px 16px 48px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.ledger-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 0 4px 16px;
}

.ledger-search-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding: 11px 13px;
  background-color: rgba(252, 250, 247, 0.1);
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
}

.ledger-search-input {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 19.5px;
  color: #fcfaf7;
  background-color: transparent;
}

.ledger-search-input::-webkit-input-placeholder {
  color: rgba(252, 250, 247, 0.6);
  font-weight: 500;
}

.ledger-search-input::-moz-placeholder {
  color: rgba(252, 250, 247, 0.6);
  font-weight: 500;
}

.ledger-search-input:-ms-input-placeholder {
  color: rgba(252, 250, 247, 0.6);
  font-weight: 500;
}

.ledger-search-input::placeholder {
  color: rgba(252, 250, 247, 0.6);
  font-weight: 500;
}

.ledger-search-input::-webkit-search-decoration,
.ledger-search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
}

.ledger-stats {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding: 8px 4px 0;
}

.ledger-count {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(252, 250, 247, 0.6);
  white-space: nowrap;
}

.ledger-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}

.ledger-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 14px 16px;
  background-color: #fcfaf7;
  border-radius: 8px;
  -webkit-filter: drop-shadow(0px 2px 6px rgba(0, 0, 0, 0.04));
  filter: drop-shadow(0px 2px 6px rgba(0, 0, 0, 0.04));
}

.ledger-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.ledger-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  color: #20444c;
  white-space: nowrap;
}

.ledger-photo-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 3px 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: transparent;
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 8px;
  cursor: pointer;
}

.ledger-divider {
  width: 100%;
  height: 0;
  border-top: 1px solid rgba(216, 200, 176, 0.1);
}

.ledger-card-meta {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.ledger-major {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 19.5px;
  color: #435d63;
  white-space: nowrap;
}

.ledger-assess-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 4px 14px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #fcfaf7;
  white-space: nowrap;
  background-color: #9b7b5c;
  border-radius: 8px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.ledger-contacts {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
}

.ledger-contact {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}

.ledger-contact-mentor {
  padding-left: 17px;
  border-left: 1px solid rgba(216, 200, 176, 0.2);
}

.ledger-contact-label {
  margin-bottom: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: rgba(155, 123, 92, 0.8);
}

.ledger-contact-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 19.5px;
  color: #9b7b5c;
}

/* ========== ????? leave.html ========== */

.leave-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.leave-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.leave-header-title {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  letter-spacing: 0.425px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.leave-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  min-height: 0;
  padding: 16px 16px 112px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.leave-tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 36px;
  width: 100%;
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 9999px;
}

.leave-tab {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 6px 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 22.5px;
  text-align: center;
  color: rgba(216, 200, 176, 0.6);
  white-space: nowrap;
  background-color: transparent;
  border-radius: 9999px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.leave-tab-active {
  padding: 6px 36px;
  font-weight: 700;
  color: #fcfaf7;
  background-color: #9b7b5c;
}

.leave-stats {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding-top: 8px;
  padding-bottom: 8px;
}

.leave-count {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: rgba(252, 250, 247, 0.8);
  white-space: nowrap;
}

.leave-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.leave-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 21px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-filter: drop-shadow(0px 1px 1px rgba(0, 0, 0, 0.05));
  filter: drop-shadow(0px 1px 1px rgba(0, 0, 0, 0.05));
}

.leave-card-done {
  border-color: rgba(216, 200, 176, 0.1);
}

.leave-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  min-height: 30px;
}

.leave-card-identity {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.leave-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  color: #20444c;
  white-space: nowrap;
}

.leave-photo-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 24px;
  padding: 0 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: transparent;
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 8px;
  cursor: pointer;
}

.leave-status {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.leave-status-pending {
  color: #7a9b7a;
}

.leave-status-approved {
  color: #20444c;
}

.leave-card-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3.2px;
  width: 100%;
}

.leave-card-body-done {
  gap: 7.3px;
}

.leave-meta {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #435d63;
}

.leave-divider {
  width: 100%;
  height: 1px;
  margin-top: 0;
  background-color: rgba(216, 200, 176, 0.1);
}

.leave-reason {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 24.38px;
  color: #9b7b5c;
}

.leave-handled-time {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: rgba(65, 72, 74, 0.7);
}

.leave-handled-note {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 22.5px;
  color: #9b7b5c;
}

.leave-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  padding-top: 12px;
}

.leave-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 153px;
  padding-top: 11px;
  padding-bottom: 11px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  border-radius: 9999px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.leave-btn-outline {
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid #9b7b5c;
}

.leave-btn-solid {
  width: 151px;
  color: #fcfaf7;
  background-color: #9b7b5c;
  border: 1px solid #9b7b5c;
}

/* ========== ???????leave.html? ========== */

.reject-modal {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 200;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 24px;
}

.reject-modal[hidden] {
  display: none;
}

.reject-modal-mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.4);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.reject-modal-panel {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  max-width: 307.8px;
  padding: 24px;
  background-color: #fcfaf7;
  border-radius: 16px;
  -webkit-box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.reject-modal-title {
  width: 100%;
  margin-bottom: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  text-align: center;
  color: #9b7b5c;
  white-space: nowrap;
}

.reject-modal-subtitle {
  width: 100%;
  margin-bottom: 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 19.5px;
  text-align: center;
  color: rgba(155, 123, 92, 0.6);
}

.reject-modal-divider {
  width: 100%;
  height: 1px;
  margin-bottom: 16px;
  background-color: rgba(155, 123, 92, 0.1);
}

.reject-modal-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  margin-bottom: 16px;
}

.reject-modal-student {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 21px;
  color: #9b7b5c;
}

.reject-modal-type {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 19.5px;
  color: #435d63;
}

.reject-modal-reason {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 24.38px;
  color: #20444c;
}

.reject-modal-field {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  margin-bottom: 24px;
  padding-bottom: 8px;
}

.reject-modal-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
}
.reject-modal-select{
  display: block;
  width: 100%;
  padding: 0 13px;
  font-size: 14px;
  background-color: #ffffff;
  border: 1px solid rgba(155, 123, 92, 0.1);
  border-radius: 8px;
  height: 50px;
  -webkit-appearance: auto !important;
  -moz-appearance: auto !important;
  appearance: auto !important;
}
.reject-modal-textarea {
  display: block;
  width: 100%;
  height: 100px;
  margin: 0 0 16px;
  padding: 13px;
  overflow: auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: #20444c;
  background-color: #ffffff;
  border: 1px solid rgba(155, 123, 92, 0.1);
  border-radius: 8px;
  resize: none;
}

.reject-modal-textarea::-webkit-input-placeholder {
  color: #6b7280;
}

.reject-modal-textarea::-moz-placeholder {
  color: #6b7280;
}

.reject-modal-textarea:-ms-input-placeholder {
  color: #6b7280;
}

.reject-modal-textarea::placeholder {
  color: #6b7280;
}

.reject-modal-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
}

.reject-modal-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 124.89px;
  padding-top: 11px;
  padding-bottom: 11px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  border-radius: 10px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.reject-modal-btn-cancel {
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid #9b7b5c;
}

.reject-modal-btn-confirm {
  width: 122.91px;
  color: #fcfaf7;
  background-color: #9b7b5c;
  border: 1px solid #9b7b5c;
  -webkit-filter: drop-shadow(0px 1px 1px rgba(0, 0, 0, 0.05));
  filter: drop-shadow(0px 1px 1px rgba(0, 0, 0, 0.05));
}

/* ========== ????? handling.html ========== */

.handling-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.handling-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.handling-header-title {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  letter-spacing: 0.425px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.handling-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  max-width: 1200px;
  min-height: 0;
  padding: 16px 16px 96px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.handling-tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 36px;
  width: 100%;
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 9999px;
}

.handling-tab {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 6px 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 22.5px;
  text-align: center;
  color: rgba(216, 200, 176, 0.6);
  white-space: nowrap;
  background-color: transparent;
  border-radius: 9999px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.handling-tab-active {
  padding: 6px 36px;
  font-weight: 700;
  color: #fcfaf7;
  background-color: #9b7b5c;
}

.handling-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.handling-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 24px;
  background-color: #fcfaf7;
  border-radius: 10px;
}

.handling-card-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.handling-card-left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.handling-card-identity {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
}

.handling-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  color: #20444c;
  white-space: nowrap;
}

.handling-photo-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 24px;
  padding: 0 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: transparent;
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 8px;
  cursor: pointer;
}

.handling-card-tags {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.handling-tag {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 1px 8px 2.39px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 4px;
}

.handling-date {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  color: #435d63;
  white-space: nowrap;
}

.handling-status {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.handling-status-pending {
  color: #7a9b7a;
}

.handling-status-done {
  color: #20444c;
  opacity: 0.3;
}

.handling-desc {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #435d63;
}

.handling-opinion {
  width: 100%;
  padding-top: 8px;
}

.handling-opinion-text {
  width: 100%;
  padding: 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #9b7b5c;
  background-color: rgba(155, 123, 92, 0.05);
  border-radius: 4px;
}

.handling-card-foot {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  width: 100%;
  padding-top: 8px;
}

.handling-detail-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 8px 24px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  text-align: center;
  text-decoration: none;
  color: #fcfaf7;
  white-space: nowrap;
  background-color: #9b7b5c;
  border-radius: 10px;
  cursor: pointer;
}

/* ========== ????? exdetail.html ========== */

.exdetail-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.exdetail-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exdetail-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exdetail-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.exdetail-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.exdetail-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exdetail-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  max-width: 448px;
  min-height: 0;
  padding: 16px 16px 128px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.exdetail-card {
  position: relative;
  width: 100%;
  padding: 24px;
  background-color: #fcfaf7;
  border-radius: 8px;
  -webkit-box-shadow:
    0px 4px 6px -1px rgba(0, 0, 0, 0.1),
    0px 2px 4px -1px rgba(0, 0, 0, 0.06);
  box-shadow:
    0px 4px 6px -1px rgba(0, 0, 0, 0.1),
    0px 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.exdetail-info-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
}

.exdetail-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  color: #20444c;
  white-space: nowrap;
}

.exdetail-phone {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  white-space: nowrap;
}

.exdetail-mentor {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 196px;
  max-width: 100%;
  padding-top: 13px;
  border-top: 1px solid rgba(155, 123, 92, 0.1);
}

.exdetail-mentor-row {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
}

.exdetail-label {
  color: #9b7b5c;
}

.exdetail-value {
  color: #20444c;
}

.exdetail-anomaly-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
}

.exdetail-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(155, 123, 92, 0.1);
}

.exdetail-row-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  white-space: nowrap;
}

.exdetail-row-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #20444c;
  white-space: nowrap;
}

.exdetail-type-tag {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 2px 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 4px;
}

.exdetail-situation {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 7.19px;
  width: 100%;
}

.exdetail-situation-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
}

.exdetail-situation-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 24.38px;
  color: #20444c;
}

.exdetail-attach-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
}

.exdetail-section-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  color: #20444c;
}

.exdetail-photos {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
}

.exdetail-photo {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  background-color: #f3f4f6;
  border-radius: 8px;
}

.exdetail-photo-img {
  width: 100%;
  height: 149px;
  max-width: none;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

.exdetail-file {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding: 13px;
  background-color: rgba(155, 123, 92, 0.05);
  border: 1px solid rgba(155, 123, 92, 0.1);
  border-radius: 8px;
}

.exdetail-file-icon-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  width: 28px;
  height: 20px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.exdetail-file-icon {
  width: 28px;
  height: 20px;
}

.exdetail-file-meta {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
}

.exdetail-file-name {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  color: #20444c;
}

.exdetail-file-size {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(155, 123, 92, 0.6);
}

.exdetail-feedback-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  padding-bottom: 40px;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.exdetail-feedback-box {
  width: 100%;
  padding: 15.375px 16px 16px;
  background-color: rgba(155, 123, 92, 0.05);
  border-radius: 4px;
}

.exdetail-feedback-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 350;
  font-size: 14px;
  line-height: 22.75px;
  color: #9b7b5c;
  white-space: pre-wrap;
  word-break: break-word;
}

.exdetail-feedback-form {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
}

.exdetail-feedback-input {
  display: block;
  width: 100%;
  min-height: 120px;
  padding: 0;
  margin: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 350;
  font-size: 14px;
  line-height: 22.75px;
  color: #9b7b5c;
  background: transparent;
  border: 0;
  outline: none;
  resize: vertical;
  -webkit-appearance: none;
  appearance: none;
}

.exdetail-feedback-input::-webkit-input-placeholder {
  color: rgba(155, 123, 92, 0.45);
}

.exdetail-feedback-input::-moz-placeholder {
  color: rgba(155, 123, 92, 0.45);
}

.exdetail-feedback-input:-ms-input-placeholder {
  color: rgba(155, 123, 92, 0.45);
}

.exdetail-feedback-input::placeholder {
  color: rgba(155, 123, 92, 0.45);
}

.exdetail-submit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  padding-top: 16px;
  padding-bottom: 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #ffffff;
  white-space: nowrap;
  background-color: #9b7b5c;
  border: 0;
  border-radius: 8px;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  cursor: pointer;
}

.exdetail-submit:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

/* ========== ?????????exdetail.html? ========== */

.opinion-modal {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 200;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 24px;
}

.opinion-modal[hidden] {
  display: none;
}

.opinion-modal-mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(32, 68, 76, 0.6);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.opinion-modal-panel {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  max-width: 342px;
  max-height: calc(100vh - 48px);
  overflow-x: hidden;
  overflow-y: auto;
  background-color: #fcfaf7;
  border-radius: 16px;
  -webkit-box-shadow: 0px 20px 50px 0px rgba(32, 68, 76, 0.3);
  box-shadow: 0px 20px 50px 0px rgba(32, 68, 76, 0.3);
}

.opinion-modal-header {
  width: 100%;
  padding: 48px 24px 24px;
  text-align: center;
}

.opinion-modal-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 36px;
  letter-spacing: -0.6px;
  text-align: center;
  color: #9b7b5c;
  white-space: nowrap;
}

.opinion-modal-note {
  width: 100%;
  max-width: 256px;
  margin-left: auto;
  margin-right: auto;
  height: 24px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  text-align: center;
  color: #6b7280;
  white-space: nowrap;
}

.opinion-modal-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding: 0 24px 24px;
}

.opinion-option {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  padding: 25px;
  background-color: #ffffff;
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 12px;
  cursor: pointer;
}

.opinion-option-custom {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  cursor: default;
}

.opinion-option-custom-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  cursor: pointer;
}

.opinion-option-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.opinion-option-check {
  display: block;
  width: 20px;
  height: 20px;
  margin-top: 4px;
  background-color: transparent;
  border: 2px solid rgba(155, 123, 92, 0.3);
  border-radius: 9999px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.opinion-option-input:checked + .opinion-option-check {
  border-color: #9b7b5c;
  background-color: #9b7b5c;
  -webkit-box-shadow: inset 0 0 0 3px #ffffff;
  box-shadow: inset 0 0 0 3px #ffffff;
}

.opinion-option-text {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 24.38px;
  color: rgba(32, 68, 76, 0.8);
}

.opinion-option-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 22.5px;
  color: rgba(32, 68, 76, 0.8);
  white-space: nowrap;
}

.opinion-custom-field {
  width: 100%;
  padding-top: 8px;
  padding-bottom: 5px;
}

.opinion-custom-textarea {
  display: block;
  width: 100%;
  height: 98px;
  padding: 13px;
  overflow: auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: #20444c;
  background-color: rgba(252, 250, 247, 0.5);
  border: 1px solid rgba(155, 123, 92, 0.2);
  border-radius: 8px;
  resize: none;
}

.opinion-custom-textarea::-webkit-input-placeholder {
  color: #6b7280;
}

.opinion-custom-textarea::-moz-placeholder {
  color: #6b7280;
}

.opinion-custom-textarea:-ms-input-placeholder {
  color: #6b7280;
}

.opinion-custom-textarea::placeholder {
  color: #6b7280;
}

.opinion-custom-upload {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
  padding-top: 8px;
}

.opinion-upload {
  width: 100%;
  padding-top: 8px;
}

.opinion-upload-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
}

.opinion-upload-preview {
  position: relative;
  width: 80px;
  height: 80px;
  overflow: hidden;
  border-radius: 8px;
  background-color: rgba(252, 250, 247, 0.5);
}

.opinion-upload-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.opinion-upload-remove {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 18px;
  height: 18px;
  padding: 0;
  font-size: 14px;
  line-height: 16px;
  color: #fcfaf7;
  background-color: rgba(32, 68, 76, 0.65);
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}

.opinion-upload-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  padding: 2px;
  background-color: rgba(252, 250, 247, 0.5);
  border: 2px dashed rgba(155, 123, 92, 0.3);
  border-radius: 8px;
  cursor: pointer;
}

.opinion-upload-btn[hidden] {
  display: none;
}

.opinion-upload-icon {
  width: 14px;
  height: 14px;
}

.opinion-upload-text {
  margin-top: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(155, 123, 92, 0.6);
  white-space: nowrap;
}

.opinion-modal-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  padding: 12px 24px 48px;
}

.opinion-modal-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 142px;
  padding: 13px 25px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 22.5px;
  text-align: center;
  white-space: nowrap;
  border-radius: 10px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.opinion-modal-btn-cancel {
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid #9b7b5c;
}

.opinion-modal-btn-confirm {
  width: 140px;
  padding: 12px 24px 13.5px;
  color: #fcfaf7;
  background-color: #9b7b5c;
  border: 1px solid #9b7b5c;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(155, 123, 92, 0.2),
    0px 4px 6px -4px rgba(155, 123, 92, 0.2);
  box-shadow:
    0px 10px 15px -3px rgba(155, 123, 92, 0.2),
    0px 4px 6px -4px rgba(155, 123, 92, 0.2);
}

/* ========== ????? archive.html ========== */

.archive-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
  background-color: #20444c;
}

.archive-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 64px;
  padding-left: 16px;
  padding-right: 16px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-back-icon {
  width: 16px;
  height: 16px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding-right: 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  letter-spacing: 3.6px;
  text-align: center;
  color: #fcfaf7;
  white-space: nowrap;
}

.archive-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  min-height: 0;
  padding: 16px 16px 48px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.archive-identity {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding-bottom: 4px;
}

.archive-identity-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 33px;
  letter-spacing: 1.1px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.archive-identity-meta {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 1.2px;
  text-align: center;
  color: rgba(252, 250, 247, 0.7);
  white-space: nowrap;
}

.archive-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 20px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.08);
  border-radius: 8px;
}

.archive-card-shadow {
  -webkit-box-shadow:
    0px 20px 25px -5px rgba(0, 0, 0, 0.1),
    0px 8px 10px -6px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 20px 25px -5px rgba(0, 0, 0, 0.1),
    0px 8px 10px -6px rgba(0, 0, 0, 0.1);
}

.archive-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

.archive-card-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #042e35;
  white-space: nowrap;
}

.archive-badge {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 2px 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 16px;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 4px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-basic-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
}

.archive-basic-fields {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 12px 16px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
}

.archive-kv {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2px;
  width: calc(50% - 8px);
  min-width: 0;
}

.archive-kv-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-kv-label-sm {
  font-size: 12px;
}

.archive-kv-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  word-break: break-all;
}

.archive-photo-upload {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 6px;
  width: 96px;
  height: 112px;
  padding: 8px;
  background-color: transparent;
  border: 1px dashed rgba(155, 123, 92, 0.4);
  border-radius: 8px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-photo-icon {
  width: 20.167px;
  height: 18.333px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-photo-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 15px;
  text-align: center;
  color: rgba(155, 123, 92, 0.7);
}

.archive-basic-edit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding-top: 4px;
  border-top: 1px solid rgba(216, 200, 176, 0.2);
}

.archive-field-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px;
  width: 100%;
}

.archive-field-label {
  width: 72px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
  white-space: nowrap;
}

.archive-input {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  height: 36px;
  padding: 0 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  background-color: rgba(155, 123, 92, 0.06);
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 6px;
}

.archive-region {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.archive-region-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-region-selects {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
}

.archive-select-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  height: 36px;
  padding-left: 10px;
  padding-right: 6px;
  background-color: rgba(155, 123, 92, 0.06);
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 6px;
}

.archive-select {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  height: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 20px;
  color: #9b7b5c;
  background-color: transparent;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.archive-select-icon {
  width: 19.5px;
  height: 19.5px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  pointer-events: none;
}

.archive-eval {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.archive-field-label-block {
  display: block;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-field-hint {
  margin-left: 4px;
  font-size: 11px;
  color: rgba(155, 123, 92, 0.85);
}

.archive-textarea {
  display: block;
  width: 100%;
  min-height: 72px;
  padding: 10px 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  background-color: rgba(155, 123, 92, 0.06);
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 6px;
  resize: vertical;
}

.archive-grid-2 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
}

.archive-grid-2 > .archive-field {
  width: calc(50% - 6px);
}

.archive-contact-block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.archive-grid-3 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}

.archive-grid-3 > .archive-field {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  width: calc(33.33% - 6px);
  min-width: 0;
}

.archive-field {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  min-width: 0;
}

.archive-input-box {
  display: block;
  width: 100%;
  height: 36px;
  padding: 0 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  background-color: rgba(155, 123, 92, 0.06);
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 6px;
}

.archive-internship-more {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding-top: 4px;
  border-top: 1px solid rgba(216, 200, 176, 0.2);
}

.archive-time-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.archive-time-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 2px;
}

.archive-time-input {
  width: 36px;
  height: 36px;
  padding: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  text-align: center;
  color: #9b7b5c;
  background-color: rgba(155, 123, 92, 0.06);
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 6px;
}

.archive-time-sep {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
}

.archive-time-dash {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-emergency {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
}

.archive-emergency-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 2px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  padding: 10px 8px;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 6px;
}

.archive-emergency-num {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #9b7b5c;
}

.archive-emergency-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-score-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.archive-score-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 12px;
  background-color: rgba(155, 123, 92, 0.06);
  border-radius: 6px;
}

.archive-score-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #042e35;
}

.archive-score-text em {
  font-style: normal;
  font-weight: 700;
  color: #9b7b5c;
}

.archive-link {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 20px;
  color: #9b7b5c;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-stats {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
}

.archive-stat {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  padding: 12px 8px;
  background-color: rgba(155, 123, 92, 0.06);
  border-radius: 6px;
}

.archive-stat-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-stat-value {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  color: #9b7b5c;
}

.archive-stat-icon {
  width: 11px;
  height: 11px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-add-btn {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 4px 10px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 20px;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: transparent;
  border: 1px solid rgba(155, 123, 92, 0.3);
  border-radius: 4px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-edu-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  padding: 16px;
  background-color: rgba(155, 123, 92, 0.06);
  border-radius: 6px;
}

.archive-edu-close {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  background-color: transparent;
  cursor: pointer;
}

.archive-item-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  gap: 8px;
  -webkit-align-self: stretch;
  align-self: stretch;
  margin-bottom: -4px;
}

.archive-item-edit {
  padding: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  background: transparent;
  border: none;
  cursor: pointer;
}

.archive-job-item,
.archive-cert-item {
  position: relative;
}

.archive-edu-close img {
  width: 10.3px;
  height: 10.3px;
}

.archive-edu-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.archive-edu-label {
  width: 64px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-edu-value {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
}

.archive-edu-status {
  padding: 2px 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 16px;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 4px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-edu-upload-row {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.archive-mini-upload {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  background-color: transparent;
  border: 1px dashed rgba(155, 123, 92, 0.4);
  border-radius: 4px;
  cursor: pointer;
}

.archive-mini-upload img {
  width: 11.67px;
  height: 11.67px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-modal-upload-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.archive-file-link {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  text-decoration: underline;
}

.archive-file-empty {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
  line-height: 18px;
  color: rgba(102, 102, 102, 0.7);
}

.archive-upload-tip {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 18px;
  color: rgba(102, 102, 102, 0.7);
}

.archive-cert-files a.archive-cert-thumb {
  display: inline-block;
  text-decoration: none;
  color: #9b7b5c;
}

.archive-job-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  padding: 16px;
  background-color: rgba(155, 123, 92, 0.06);
  border-radius: 6px;
}

.archive-job-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.archive-job-tag {
  padding: 2px 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 16px;
  color: #fcfaf7;
  white-space: nowrap;
  background-color: #9b7b5c;
  border-radius: 4px;
}

.archive-job-date {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
  white-space: nowrap;
}

.archive-job-company {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 22px;
  color: #042e35;
}

.archive-job-role {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 20px;
  color: #9b7b5c;
}

.archive-job-contact {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-cert-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  padding: 16px;
  background-color: rgba(155, 123, 92, 0.06);
  border-radius: 6px;
}

.archive-cert-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.archive-cert-tag {
  padding: 2px 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 16px;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 4px;
}

.archive-cert-date {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
  white-space: nowrap;
}

.archive-cert-name {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 22px;
  color: #042e35;
}

.archive-cert-meta,
.archive-cert-no {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-cert-files {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding-top: 4px;
}

.archive-cert-thumb {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  height: 48px;
  padding: 0 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  background-color: rgba(155, 123, 92, 0.06);
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.archive-cert-upload {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  padding: 8px 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: transparent;
  border: 1px dashed rgba(155, 123, 92, 0.4);
  border-radius: 6px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-cert-upload img {
  width: 9.33px;
  height: 9.33px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding-top: 8px;
}

.archive-commit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  cursor: pointer;
}

.archive-commit-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.archive-commit-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.6);
  border-radius: 3px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-commit-input:checked + .archive-commit-box {
  background-color: #9b7b5c;
  border-color: #9b7b5c;
}

.archive-commit-input:checked + .archive-commit-box::after {
  content: "";
  width: 8px;
  height: 5px;
  margin-top: -2px;
  border-left: 2px solid #fcfaf7;
  border-bottom: 2px solid #fcfaf7;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.archive-commit-text {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(252, 250, 247, 0.7);
}

.archive-btn-primary {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 48px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #fcfaf7;
  background-color: #9b7b5c;
  border: 1px solid #9b7b5c;
  border-radius: 8px;
  cursor: pointer;
}

.archive-btn-secondary {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 48px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #d8c8b0;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.4);
  border-radius: 8px;
  cursor: pointer;
}

/* ========== ????? archive.html ========== */

.archive-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.archive-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  width: 100%;
  height: 64px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: rgba(32, 68, 76, 0.95);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 16px;
  height: 16px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-back-icon {
  width: 16px;
  height: 16px;
}

.archive-header-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  letter-spacing: 3.6px;
  color: #fcfaf7;
  white-space: nowrap;
}

.archive-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  padding: 16px 16px 128px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.archive-identity {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}

.archive-identity-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 36px;
  letter-spacing: -0.6px;
  color: #dab866;
}

.archive-identity-meta {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 300;
  font-size: 13px;
  line-height: 19.5px;
  letter-spacing: 0.325px;
  color: rgba(252, 250, 247, 0.6);
}

.archive-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 24px 20px 20px;
  background-color: #fcfaf7;
  border-radius: 8px;
}

.archive-card-shadow {
  gap: 16px;
  padding: 20px;
  -webkit-box-shadow:
    0px 20px 25px -5px rgba(0, 0, 0, 0.1),
    0px 8px 10px -6px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 20px 25px -5px rgba(0, 0, 0, 0.1),
    0px 8px 10px -6px rgba(0, 0, 0, 0.1);
}

.archive-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.archive-card-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #9b7b5c;
  white-space: nowrap;
}

.archive-badge {
  padding: 3px 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 10px;
  line-height: 15px;
  color: #d8c8b0;
  white-space: nowrap;
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 4px;
}

.archive-basic-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  padding-top: 4px;
}

.archive-basic-fields {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 10px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}

.archive-kv {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.archive-kv-label {
  width: 48px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.5);
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-kv-label-sm {
  width: 36px;
}

.archive-kv-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  color: #9b7b5c;
  white-space: nowrap;
}

.archive-photo-upload {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 96px;
  height: 112px;
  overflow: hidden;
  background-color: rgba(216, 200, 176, 0.1);
  border: 1px dashed rgba(216, 200, 176, 0.4);
  border-radius: 4px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-photo-icon {
  width: 20.167px;
  height: 18.333px;
}

.archive-photo-text {
  margin-top: 4px;
  padding: 0 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  text-align: center;
  color: #d8c8b0;
}

.archive-basic-edit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}

.archive-field-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 36px;
}

.archive-field-label {
  width: 48px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.5);
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-field-label-block {
  display: block;
  margin-bottom: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.5);
}

.archive-input {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  height: 30px;
  padding: 3px 13px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 24px;
  color: #9b7b5c;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.2);
}

.archive-input-box {
  width: 100%;
  padding: 7px 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 24px;
  color: #9b7b5c;
  background-color: #ffffff;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
}

.archive-region {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
}

.archive-region-label {
  width: 72px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.5);
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-region-selects {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  gap: 12px;
  min-width: 0;
}

.archive-select-wrap {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  height: 30px;
  border: 1px solid rgba(216, 200, 176, 0.2);
}

.archive-select {
  width: 100%;
  height: 100%;
  padding: 3px 22px 3px 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 24px;
  color: #9b7b5c;
  background-color: transparent;
  cursor: pointer;
}

.archive-select-icon {
  position: absolute;
  right: 2px;
  top: 50%;
  width: 19.5px;
  height: 19.5px;
  pointer-events: none;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.archive-eval {
  width: 100%;
}

.archive-textarea {
  display: block;
  width: 100%;
  min-height: 82px;
  padding: 9px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 21.13px;
  color: #9b7b5c;
  background-color: rgba(216, 200, 176, 0.05);
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 4px;
  resize: none;
}

.archive-grid-2 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 16px;
  width: 100%;
}

.archive-grid-2 .archive-field {
  width: calc(50% - 8px);
}

.archive-grid-3 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}

.archive-grid-3 .archive-field {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  width: calc(33.33% - 6px);
  min-width: 0;
}

.archive-field {
  width: 100%;
}

.archive-internship-more {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding-top: 9px;
  border-top: 1px solid rgba(216, 200, 176, 0.1);
}

.archive-time-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.archive-time-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
}

.archive-time-input {
  width: 48px;
  padding: 7px 5px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 24px;
  text-align: center;
  color: #9b7b5c;
  background-color: #ffffff;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
}

.archive-time-sep,
.archive-time-dash {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: rgba(67, 93, 99, 0.4);
  white-space: nowrap;
}

.archive-time-dash {
  padding: 0 4px;
}

.archive-emergency {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
}

.archive-emergency-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 95.33px;
  padding: 8px;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 8px;
}

.archive-emergency-num {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 21px;
  color: #9b7b5c;
  white-space: nowrap;
}

.archive-emergency-label {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  color: rgba(155, 123, 92, 0.8);
  white-space: nowrap;
}

.archive-score-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.archive-score-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.archive-score-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #435d63;
}

.archive-score-text em {
  font-style: normal;
  font-weight: 700;
  color: #9b7b5c;
}

.archive-link {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 16.5px;
  color: #9b7b5c;
  white-space: nowrap;
  text-decoration: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-stats {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
}

.archive-stat {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  padding: 12px 4px;
  background-color: rgba(155, 123, 92, 0.05);
  border-radius: 8px;
}

.archive-stat-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.6);
  white-space: nowrap;
}

.archive-stat-value {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 2px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  color: #9b7b5c;
}

.archive-stat-icon {
  width: 11.034px;
  height: 11.086px;
}

.archive-add-btn {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 16.5px;
  color: #9b7b5c;
  white-space: nowrap;
  background: transparent;
  cursor: pointer;
}

.archive-edu-item,
.archive-job-item,
.archive-cert-item {
  position: relative;
  width: 100%;
  padding: 13px;
  border: 1px solid rgba(216, 200, 176, 0.1);
  border-radius: 4px;
}

.archive-edu-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 10px;
  height: 10px;
  padding: 0;
  background: transparent;
  cursor: pointer;
}

.archive-edu-close img {
  width: 10.305px;
  height: 10.305px;
}

.archive-edu-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-bottom: 8px;
}

.archive-edu-row:last-child {
  margin-bottom: 0;
}

.archive-edu-label {
  width: 56px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.5);
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-edu-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 13px;
  line-height: 19.5px;
  color: #9b7b5c;
}

.archive-edu-status {
  margin-left: auto;
  padding: 1px 6px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 4px;
}

.archive-mini-upload {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 16.5px;
  color: #d8c8b0;
  background-color: transparent;
  border: 1px dashed rgba(216, 200, 176, 0.4);
  border-radius: 4px;
  cursor: pointer;
}

.archive-mini-upload img {
  width: 11.667px;
  height: 11.667px;
}

.archive-job-top,
.archive-cert-top {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 4px;
}

.archive-job-tag,
.archive-cert-tag {
  padding: 1px 5px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  color: #d8c8b0;
  white-space: nowrap;
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 4px;
}

.archive-job-date,
.archive-cert-date {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.4);
  white-space: nowrap;
}

.archive-job-company,
.archive-cert-name {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 13px;
  line-height: 19.5px;
  color: #9b7b5c;
}

.archive-job-role,
.archive-job-contact,
.archive-cert-meta {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.6);
}

.archive-cert-no {
  margin-top: 6px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: rgba(67, 93, 99, 0.4);
}

.archive-cert-files {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
  margin-top: 10px;
}

.archive-cert-thumb {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 64px;
  height: 80px;
  padding: 5px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 9px;
  line-height: 13.5px;
  text-align: center;
  color: #9b7b5c;
  white-space: nowrap;
  background-color: rgba(0, 0, 0, 0.05);
  border: 1px solid rgba(216, 200, 176, 0.1);
  border-radius: 4px;
}

.archive-cert-upload {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 64px;
  height: 80px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 9px;
  line-height: 13.5px;
  color: #d8c8b0;
  background-color: transparent;
  border: 1px dashed rgba(216, 200, 176, 0.4);
  border-radius: 4px;
  cursor: pointer;
}

.archive-cert-upload img {
  width: 9.333px;
  height: 9.333px;
  margin-bottom: 2px;
}

.archive-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding-top: 16px;
}

.archive-commit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  margin-bottom: 4px;
  cursor: pointer;
}

.archive-commit-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.archive-commit-box {
  display: block;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  border: 1px solid rgba(216, 200, 176, 0.4);
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-commit-input:checked + .archive-commit-box {
  background-color: #9b7b5c;
  border-color: #9b7b5c;
  -webkit-box-shadow: inset 0 0 0 2px #20444c;
  box-shadow: inset 0 0 0 2px #20444c;
}

.archive-commit-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 19.5px;
  color: #fcfaf7;
}

.archive-btn-primary {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  padding: 14px 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 22.5px;
  text-align: center;
  color: #fcfaf7;
  white-space: nowrap;
  background-color: #9b7b5c;
  border-radius: 8px;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  cursor: pointer;
}

.archive-btn-secondary {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  padding: 13px 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 21px;
  text-align: center;
  color: #d8c8b0;
  white-space: nowrap;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.4);
  border-radius: 8px;
  cursor: pointer;
}

/* ========== ??????????? / ???? / ????? ========== */

.archive-modal {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 200;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 16px 24px;
}

.archive-modal[hidden] {
  display: none;
}

.archive-modal-mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(32, 68, 76, 0.6);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.archive-modal-panel {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 343px;
  max-height: calc(100vh - 48px);
  padding: 24px;
  overflow-x: hidden;
  overflow-y: auto;
  background-color: #fcfaf7;
  border-radius: 12px;
  -webkit-box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.archive-modal-panel-pwd {
  gap: 24px;
  padding: 24px 25px 25px;
  border: 1px solid rgba(216, 200, 176, 0.3);
  -webkit-filter: drop-shadow(0px 4px 10px rgba(32, 68, 76, 0.08));
  filter: drop-shadow(0px 4px 10px rgba(32, 68, 76, 0.08));
  -webkit-box-shadow: none;
  box-shadow: none;
}

.archive-modal-panel-train {
  gap: 23px;
  max-width: 337.5px;
  padding: 23px 24px 24px;
  -webkit-filter: drop-shadow(0px 20px 25px rgba(32, 68, 76, 0.2));
  filter: drop-shadow(0px 20px 25px rgba(32, 68, 76, 0.2));
  -webkit-box-shadow: none;
  box-shadow: none;
}

.archive-modal-title {
  width: 100%;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 27px;
  text-align: center;
  color: #9b7b5c;
  white-space: nowrap;
}

.archive-modal-title-left {
  line-height: 25.2px;
  text-align: left;
  white-space: normal;
}

.archive-modal-form {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.archive-modal-panel-pwd .archive-modal-form {
  gap: 20px;
}

.archive-modal-form-train {
  gap: 19px;
}

.archive-modal-field {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6px;
  width: 100%;
}

.archive-modal-form-train .archive-modal-field {
  gap: 8px;
}

.archive-modal-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  color: #9b7b5c;
}

.archive-modal-panel-pwd .archive-modal-label {
  line-height: 16.8px;
  letter-spacing: 0.7px;
}

.archive-modal-label-soft {
  line-height: 14.4px;
  opacity: 0.8;
}

.archive-modal-input {
  display: block;
  width: 100%;
  height: 44px;
  padding: 10px 17px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: normal;
  color: #20444c;
  background-color: #ffffff;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
}

.archive-modal-panel-pwd .archive-modal-input,
.archive-modal-form-train .archive-modal-input {
  border-color: rgba(216, 200, 176, 0.25);
}

.archive-modal-input::-webkit-input-placeholder {
  color: rgba(65, 72, 74, 0.4);
}

.archive-modal-input::-moz-placeholder {
  color: rgba(65, 72, 74, 0.4);
}

.archive-modal-input:-ms-input-placeholder {
  color: rgba(65, 72, 74, 0.4);
}

.archive-modal-input::placeholder {
  color: rgba(65, 72, 74, 0.4);
}

.archive-modal-input-half {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
}

.archive-modal-range {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}

.archive-modal-dash {
  width: 12.516px;
  height: 11.551px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-modal-select-wrap {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 44px;
  padding: 0 9px 0 17px;
  background-color: #ffffff;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
}

.archive-modal-select {
  width: 100%;
  height: 100%;
  padding-right: 28px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #042e35;
  background-color: transparent;
  cursor: pointer;
}

.archive-modal-select-icon {
  position: absolute;
  right: 9px;
  top: 50%;
  width: 24px;
  height: 24px;
  pointer-events: none;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.archive-modal-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  padding-top: 16px;
}

.archive-modal-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 48px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  white-space: nowrap;
  border-radius: 9999px;
  cursor: pointer;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-modal-btn-cancel {
  width: 142px;
  color: #d8c8b0;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.4);
}

.archive-modal-btn-confirm {
  width: 140px;
  margin-left: 12px;
  color: #fcfaf7;
  background-color: #9b7b5c;
  border: 1px solid #9b7b5c;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(155, 123, 92, 0.2),
    0px 4px 6px -4px rgba(155, 123, 92, 0.2);
  box-shadow:
    0px 10px 15px -3px rgba(155, 123, 92, 0.2),
    0px 4px 6px -4px rgba(155, 123, 92, 0.2);
}

/* ========== ????? contact.html ========== */

.contact-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.contact-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.contact-header-title {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  letter-spacing: 0.425px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.contact-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  padding: 16px 16px 128px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.contact-card {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 20px;
  background-color: #fcfaf7;
  border-radius: 8px;
  -webkit-box-shadow:
    0px 20px 25px -5px rgba(0, 0, 0, 0.1),
    0px 8px 10px -6px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 20px 25px -5px rgba(0, 0, 0, 0.1),
    0px 8px 10px -6px rgba(0, 0, 0, 0.1);
}

.contact-block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}

.contact-label {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16.5px;
  color: #9b7b5c;
}

.contact-label-gap {
  padding-top: 4px;
}

.contact-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: #20444c;
}

.contact-name-lg {
  font-size: 18px;
  line-height: 27px;
}

.contact-phone {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: rgba(32, 68, 76, 0.8);
}

.contact-detail {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 19.5px;
  color: rgba(32, 68, 76, 0.8);
}

.contact-address {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 22.75px;
  color: rgba(32, 68, 76, 0.8);
}

.contact-divider {
  width: 100%;
  height: 1px;
  background-color: rgba(155, 123, 92, 0.1);
}

.contact-emergency {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  padding-top: 8px;
}

.contact-emergency-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
}

.contact-emergency-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 95.33px;
  padding: 8px;
  background-color: rgba(155, 123, 92, 0.1);
  border-radius: 8px;
}

.contact-emergency-num {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 21px;
  color: #20444c;
  white-space: nowrap;
}

.contact-emergency-text {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 10px;
  line-height: 15px;
  color: rgba(155, 123, 92, 0.8);
  white-space: nowrap;
}

/* ========== ???? ========== */
.checkin-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.checkin-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 56px;
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.checkin-header-title {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  letter-spacing: 0.425px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.checkin-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding: 24px 24px 40px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.checkin-action-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding: 24px;
  background-color: #fcfaf7;
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.checkin-datetime {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding-bottom: 24px;
}

.checkin-date {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 19.5px;
  text-align: center;
  color: #41484a;
  white-space: nowrap;
}

.checkin-date-btn {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 6px;
  margin: 0 auto;
  padding: 4px 8px;
  background: transparent;
  border: none;
  cursor: pointer;
}

.checkin-date-arrow {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  opacity: 0.7;
}

.checkin-back-today {
  display: block;
  margin: 4px auto 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  text-align: center;
  text-decoration: underline;
}

.date-picker-day-disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.checkin-clock {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 48px;
  line-height: 48px;
  letter-spacing: -1.2px;
  text-align: center;
  color: #20444c;
  white-space: nowrap;
}

.checkin-slots {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 12px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  width: 100%;
  margin-bottom: 48px;
}

.checkin-slot {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3px;
  padding: 13px;
  background-color: #f4f3f4;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
}

.checkin-slot-current {
  background-color: #fff8ef;
  border-color: #c9a06a;
}

.checkin-slot-clickable {
  cursor: pointer;
}

.checkin-slot-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  width: 100%;
}

.checkin-slot-name {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 13px;
  line-height: 18px;
  color: #41484a;
}

.checkin-slot-tag {
  margin-left: auto;
  padding: 0 6px;
  border-radius: 999px;
  background: #c9a06a;
  color: #fff;
  font-size: 11px;
  line-height: 16px;
}

.checkin-slot-tag-overtime {
  background: rgba(196, 92, 38, 0.9);
}

.checkin-slot-dot {
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.checkin-slot-dot-ok {
  background-color: #7a9b7a;
}

.checkin-slot-dot-pending {
  background-color: #c1c8ca;
}

.checkin-slot-range {
  margin: 0;
  padding-left: 12px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #8a8176;
  white-space: nowrap;
}

.checkin-slot-status {
  margin: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 11px;
  line-height: 13.75px;
  color: #9b7b5c;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.checkin-slot-abnormal {
  color: #be0f12;
}

.checkin-tips {
  width: 100%;
  margin-top: -24px;
  margin-bottom: 12px;
  opacity: 0.8;
}

.checkin-tips p {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
}

.checkin-btn-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.checkin-current-meta {
  margin: 0 0 12px;
  padding: 0 16px;
  text-align: center;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 13px;
  line-height: 20px;
  color: #6b6258;
}

.checkin-current-meta strong {
  color: #9b7b5c;
  font-weight: 600;
}

.checkin-current-place {
  display: inline;
  color: #8a8176;
}

.checkin-btn {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 4px;
  width: 160px;
  height: 160px;
  border-radius: 9999px;
  background-color: #9b7b5c;
  cursor: pointer;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.checkin-btn-icon {
  width: 24.065px;
  height: 26.619px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.checkin-btn-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  text-align: center;
  color: #fcfaf7;
  white-space: nowrap;
}

.checkin-btn-time {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
  color: #fcfaf7;
  opacity: 0.8;
  white-space: nowrap;
}

.checkin-location {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  padding-top: 24px;
  opacity: 0.8;
}

.checkin-location-icon {
  width: 10.667px;
  height: 13.333px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.checkin-location-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
  /*white-space: nowrap;*/
}

.checkin-integrity {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding: 24px 25px 25px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
}

.checkin-integrity-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 22.5px;
  color: #9b7b5c;
}

.checkin-integrity-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 21.13px;
  color: #41484a;
}

.checkin-history-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 46px;
  border: 1px solid #9b7b5c;
  border-radius: 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 22.5px;
  text-align: center;
  color: #9b7b5c;
  text-decoration: none;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

/* ========== ?????? ========== */
.chistory-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 0;
}

.chistory-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chistory-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chistory-back-icon {
  width: 129px;
  height: 20.5px;
  max-width: none;
}

.chistory-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.chistory-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chistory-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  padding: 0 24px 80px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.chistory-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding-top: 24px;
  padding-bottom: 24px;
}

.chistory-month-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.chistory-month-grid {
  width: 100%;
  overflow: hidden;
  padding-top: 8px;
}

.chistory-month-grid::after {
  content: "";
  display: table;
  clear: both;
}

.chistory-month-cell {
  float: left;
  display: block;
  box-sizing: border-box;
  width: 31.3%;
  height: 44px;
  margin: 0 3.05% 10px 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background-color: #f5f1eb;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 44px;
  text-align: center;
  color: #20444c;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.chistory-month-cell:nth-child(3n) {
  margin-right: 0;
}

.chistory-month-cell-active {
  background-color: #9b7b5c;
  color: #ffffff;
  font-weight: 700;
}

.chistory-month-cell-disabled {
  opacity: 0.35;
  cursor: default;
}

.chistory-month-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #8cb1ba;
  white-space: nowrap;
}

.chistory-month-arrow {
  width: 12px;
  height: 7.4px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chistory-stats {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding: 25px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.25);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.chistory-stats-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
}

.chistory-stats-left,
.chistory-stats-right {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
}

.chistory-stats-icon {
  width: 18px;
  height: 18px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chistory-stats-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #9b7b5c;
  white-space: nowrap;
}

.chistory-stats-count {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #ba1a1a;
  white-space: nowrap;
}

.chistory-chevron {
  width: 12px;
  height: 7.4px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chistory-chevron-up {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.chistory-stats-body {
  width: 100%;
  padding-top: 13px;
  border-top: 1px solid rgba(193, 200, 202, 0.2);
}

.chistory-stats-sub {
  margin-bottom: 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #9b7b5c;
}

.chistory-reason-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.chistory-reason-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
}

.chistory-reason-dot {
  width: 6px;
  height: 6px;
  margin-top: 4px;
  border-radius: 9999px;
  background-color: #ba1a1a;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chistory-reason-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  color: #71787a;
  /*white-space: nowrap;*/
}

.chistory-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding-top: 24px;
}

.chistory-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 25px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.25);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.chistory-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
}

.chistory-card-date {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 25.6px;
  color: #9b7b5c;
  white-space: nowrap;
}

.chistory-badge {
  padding: 1px 8px 2.39px;
  background-color: #eeeeee;
  border-radius: 9999px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  color: #71787a;
  white-space: nowrap;
}

.chistory-slots {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 24px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  width: 100%;
  padding-top: 12px;
  padding-bottom: 13px;
  border-top: 1px solid rgba(193, 200, 202, 0.2);
  border-bottom: 1px solid rgba(193, 200, 202, 0.2);
}

.chistory-slot {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3px;
}

.chistory-slot-range {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: #41484a;
}

.chistory-slot-range-em {
  font-weight: 500;
}

.chistory-slot-value {
  padding-top: 1px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #042e35;
  white-space: pre-wrap;
}

.chistory-slot-abnormal {
  color: #ba1a1a;
}

.chistory-slot-ok {
  color: #20444c;
}

.chistory-slot-empty {
  padding-top: 1px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: rgba(113, 120, 122, 0.5);
}

.chistory-loc {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 19.5px;
  color: #71787a;
  opacity: 0.8;
}

.chistory-anomaly {
  width: 100%;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(193, 200, 202, 0.1);
}

.chistory-anomaly-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding-top: 4px;
  padding-bottom: 4px;
}

.chistory-anomaly-left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
}

.chistory-warn-icon {
  width: 13.5px;
  height: 13.5px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chistory-anomaly-count {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #ba1a1a;
  white-space: nowrap;
}

.chistory-anomaly-detail {
  margin-top: 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: #695d49;
  white-space: nowrap;
}

.chistory-end {
  width: 100%;
  padding-top: 80px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  text-align: center;
  color: #8cb1ba;
  opacity: 0.4;
  white-space: nowrap;
}

/* ========== ?????? ========== */
.evalstats-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 96px;
}

.evalstats-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(216, 200, 176, 0.06);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evalstats-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.evalstats-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.evalstats-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  letter-spacing: 0.425px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.evalstats-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evalstats-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 32px 16px 24px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.evalstats-profile {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding: 2px 8px;
}

.evalstats-name {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 33px;
  color: #dab866;
}

.evalstats-meta {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 19.5px;
  color: #fcfaf7;
}

.evalstats-avg {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 65px;
  width: 100%;
  padding: 21px 32px;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);
}

.evalstats-avg-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.evalstats-avg-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  text-align: center;
  white-space: nowrap;
}

.evalstats-avg-label-self {
  color: #d8c8b0;
}

.evalstats-avg-label-mentor {
  color: #dab866;
}

.evalstats-avg-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 900;
  font-size: 24px;
  line-height: 36px;
  text-align: center;
  white-space: nowrap;
}

.evalstats-avg-value-self {
  color: #d8c8b0;
}

.evalstats-avg-value-mentor {
  color: #dab866;
}

.evalstats-avg-divider {
  width: 1px;
  height: 40px;
  background-color: rgba(216, 200, 176, 0.2);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evalstats-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 17px;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.evalstats-filter-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  cursor: pointer;
  text-align: left;
}

.evalstats-filter-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  letter-spacing: 0.5px;
  color: #dab866;
  text-transform: uppercase;
}

.evalstats-filter-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 4px;
  width: 100%;
  position: relative;
}

.evalstats-filter-select {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  height: 20px;
  margin: 0;
  padding: 0 14px 0 0;
  border: 0;
  outline: none;
  background: transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #dab866;
  cursor: pointer;
}

.evalstats-filter-select::-ms-expand {
  display: none;
}

.evalstats-filter-select option {
  color: #20444c;
  background: #fcfaf7;
}

.evalstats-filter-value {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #dab866;
  white-space: nowrap;
}

.evalstats-filter-arrow {
  position: absolute;
  right: 0;
  top: 50%;
  width: 8px;
  height: 4.933px;
  max-width: none;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  pointer-events: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evalstats-filter-divider {
  width: 1px;
  height: 32px;
  background-color: rgba(216, 200, 176, 0.2);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evalstats-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.evalstats-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 21px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
}

.evalstats-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  gap: 8px;
}

.evalstats-card-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 28px;
  color: #9b7b5c;
  white-space: nowrap;
}

.evalstats-badge {
  padding: 2px 8px;
  border-radius: 9999px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 15px;
  letter-spacing: 0.5px;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evalstats-badge-done {
  background-color: rgba(32, 68, 76, 0.1);
  color: #20444c;
}

.evalstats-badge-pending {
  background-color: rgba(155, 123, 92, 0.1);
  color: #9b7b5c;
}

.evalstats-card-scores {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding-bottom: 8px;
}

.evalstats-score {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  line-height: 20px;
  white-space: nowrap;
}

.evalstats-score-self {
  color: #9b7b5c;
}

.evalstats-score-mentor {
  color: #20444c;
}

.evalstats-score-label {
  font-weight: 700;
}

.evalstats-score-num {
  font-weight: 900;
}

.evalstats-card-foot {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding-top: 17px;
  border-top: 1px solid rgba(216, 200, 176, 0.1);
}

.evalstats-submit-time {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding-bottom: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  color: #000000;
}

.evalstats-detail-link {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 16px;
  color: #9b7b5c;
  text-decoration: none;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evalstats-detail-arrow {
  width: 4.933px;
  height: 8px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.evalstats-fab {
  position: fixed;
  right: 20px;
  bottom: 88px;
  z-index: 50;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 12px 24px;
  background-color: #9b7b5c;
  border-radius: 9999px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #fcfaf7;
  text-decoration: none;
  white-space: nowrap;
  -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
}

@media (min-width: 391px) {
  .evalstats-fab {
    right: calc(50% - 195px + 20px);
  }
}

/* ========== ???? ========== */
.journal-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.journal-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.journal-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.journal-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.journal-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.journal-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.journal-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding: 24px 24px 128px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.journal-week-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  min-height: 94px;
  padding: 25px;
  background-color: #ffffff;
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.journal-week-inner {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3.99px;
  padding-left: 16px;
}

.journal-week-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #9b7b5c;
  white-space: nowrap;
}

.journal-week-range {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 25.6px;
  color: #41484a;
  white-space: nowrap;
}

.journal-summary-card,
.journal-mentor-card {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 25px;
  overflow: hidden;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
}

.journal-summary-card {
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.12);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.12);
}

.journal-mentor-card {
  -webkit-box-shadow: 0px 4px 20px rgba(32, 68, 76, 0.12);
  box-shadow: 0px 4px 20px rgba(32, 68, 76, 0.12);
}

.journal-mentor-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 64px;
  height: 64px;
  background-color: rgba(216, 200, 176, 0.1);
  border-radius: 0 0 0 9999px;
  pointer-events: none;
}

.journal-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(216, 200, 176, 0.2);
}

.journal-card-title {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  color: #9b7b5c;
  white-space: nowrap;
}

.journal-score {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
  -webkit-align-items: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  gap: 4px;
}

.journal-score-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  white-space: nowrap;
}

.journal-score-num {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 36px;
  white-space: nowrap;
}

.journal-fen-icon {
  width: 11.133px;
  height: 10.993px;
  max-width: none;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.journal-score-self .journal-score-label,
.journal-score-self .journal-score-num {
  color: #9b7b5c;
}

.journal-score-mentor .journal-score-label,
.journal-score-mentor .journal-score-num {
  color: #20444c;
}

.journal-summary-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.journal-block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.journal-block-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 1.4px;
  color: #9b7b5c;
  text-transform: uppercase;
}

.journal-block-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 350;
  font-size: 14px;
  line-height: 26px;
  color: #41484a;
}

.journal-mentor-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.journal-mentor-name {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #1a1c1c;
  white-space: nowrap;
}

.journal-mentor-quote {
  margin: 0;
  padding: 4px 0 4px 18px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 350;
  font-size: 14px;
  line-height: 26px;
  color: #41484a;
  border-left: 2px solid rgba(216, 200, 176, 0.3);
}

.journal-mentor-time {
  padding-top: 7px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  text-align: right;
  color: #41484a;
  opacity: 0.4;
  white-space: nowrap;
}

/* ========== ???? ========== */
.jsubmit-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.jsubmit-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.jsubmit-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.jsubmit-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.jsubmit-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.jsubmit-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.jsubmit-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 18px;
  width: 100%;
  padding: 32px 16px 96px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.jsubmit-week-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  min-height: 112px;
  padding: 25px;
  background-color: #ffffff;
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.jsubmit-week-card-clickable {
  cursor: pointer;
}

.jsubmit-week-icon {
  width: 42px;
  height: 46px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.jsubmit-week-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3.99px;
  padding-left: 16px;
  min-width: 0;
}

.jsubmit-week-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #9b7b5c;
  white-space: nowrap;
}

.jsubmit-week-range {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 25.6px;
  color: #41484a;
  white-space: nowrap;
}

.jsubmit-week-tip {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.6);
}

.jsubmit-locked-tip {
  margin: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 13px;
  line-height: 20px;
  color: #c96a62;
}

.jsubmit-week-picker-list {
  max-height: 52vh;
  overflow-y: auto;
  padding: 0 16px 8px;
}

.jsubmit-week-option {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 12px 4px;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(216, 200, 176, 0.25);
  text-align: left;
  cursor: pointer;
}

.jsubmit-week-option-active {
  background-color: #fff8ef;
}

.jsubmit-week-option-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.jsubmit-week-option-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 21px;
  color: #20444c;
}

.jsubmit-week-option-range {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
}

.jsubmit-week-option-status {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 12px;
  line-height: 18px;
  color: #9b7b5c;
}

.jsubmit-week-option-status.is-makeup {
  color: #c96a62;
}

.jsubmit-week-option-status.is-done {
  color: #6a8f6e;
}

.jsubmit-card {
  width: 100%;
  background-color: #ffffff;
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.08);
}

.jsubmit-card-textarea {
  padding: 24px;
}

.jsubmit-section-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 33.6px;
  color: #9b7b5c;
}

.jsubmit-textarea {
  display: block;
  width: 100%;
  height: 149px;
  margin-top: 0;
  padding: 15px 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 25.6px;
  color: #41484a;
  background-color: #faf9f9;
  border: 1px solid rgba(216, 200, 176, 0.25);
  border-radius: 8px;
  resize: none;
  overflow: auto;
}

.jsubmit-textarea::-webkit-input-placeholder {
  color: rgba(107, 114, 128, 0.4);
}

.jsubmit-textarea::-moz-placeholder {
  color: rgba(107, 114, 128, 0.4);
}

.jsubmit-textarea:-ms-input-placeholder {
  color: rgba(107, 114, 128, 0.4);
}

.jsubmit-textarea::placeholder {
  color: rgba(107, 114, 128, 0.4);
}

.jsubmit-score-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  padding: 25px;
}

.jsubmit-score-intro {
  width: 100%;
}

.jsubmit-score-tip {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: rgba(155, 123, 92, 0.6);
}

.jsubmit-score-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding-bottom: 8px;
}

.jsubmit-score-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}

.jsubmit-score-name {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  color: #9b7b5c;
}

.jsubmit-score-desc {
  padding-bottom: 4px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  color: rgba(65, 72, 74, 0.7);
}

.jsubmit-score-input {
  display: block;
  width: 100%;
  height: 42px;
  padding: 8px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #41484a;
  background-color: #faf9f9;
  border: 1px solid rgba(216, 200, 176, 0.25);
  border-radius: 8px;
}

.jsubmit-score-input::-webkit-outer-spin-button,
.jsubmit-score-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.jsubmit-score-input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}

.jsubmit-score-input::-webkit-input-placeholder {
  color: #6b7280;
}

.jsubmit-score-input::-moz-placeholder {
  color: #6b7280;
}

.jsubmit-score-input:-ms-input-placeholder {
  color: #6b7280;
}

.jsubmit-score-input::placeholder {
  color: #6b7280;
}

.jsubmit-total {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding-top: 17px;
  border-top: 1px solid rgba(216, 200, 176, 0.3);
}

.jsubmit-total-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #9b7b5c;
  white-space: nowrap;
}

.jsubmit-total-value {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 900;
  font-size: 30px;
  line-height: 36px;
  color: #9b7b5c;
  white-space: nowrap;
}

.jsubmit-upload-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  padding: 25px;
}

.jsubmit-upload-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 16.8px;
  letter-spacing: 0.7px;
  color: #9b7b5c;
}

.jsubmit-upload-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 16px 1fr 16px 1fr;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  width: 100%;
}

.jsubmit-upload-btn {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 1 / 1;
  min-height: 92px;
  border: 2px dashed rgba(216, 200, 176, 0.4);
  border-radius: 8px;
  cursor: pointer;
}

.jsubmit-file {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.jsubmit-upload-plus {
  width: 17.5px;
  height: 17.5px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.jsubmit-upload-text {
  margin-top: 3px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  text-align: center;
  color: rgba(155, 123, 92, 0.6);
  white-space: nowrap;
}

.jsubmit-submit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  padding-top: 16px;
  padding-bottom: 16px;
  background-color: #9b7b5c;
  border-radius: 9999px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 33.6px;
  text-align: center;
  color: #ffffff;
  cursor: pointer;
  -webkit-box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
  box-shadow:
    0px 10px 15px -3px rgba(0, 0, 0, 0.1),
    0px 4px 6px -4px rgba(0, 0, 0, 0.1);
}

/* ========== ???? ========== */
.lmgmt-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 96px;
}

.lmgmt-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.lmgmt-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.lmgmt-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.lmgmt-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.lmgmt-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.lmgmt-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding: 24px 16px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.lmgmt-tabs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.05);
  border-radius: 9999px;
}

.lmgmt-tab {
  padding: 6px 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 22.5px;
  text-align: center;
  color: rgba(216, 200, 176, 0.6);
  white-space: nowrap;
  cursor: pointer;
  border-radius: 9999px;
}

.lmgmt-tab-active {
  padding-left: 36px;
  padding-right: 36px;
  font-weight: 700;
  color: #fcfaf7;
  background-color: #9b7b5c;
}

.lmgmt-list-section {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.lmgmt-list-title {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.8px;
  color: #fcfaf7;
  text-transform: uppercase;
  opacity: 0.7;
}

.lmgmt-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  padding: 25px;
  background-color: #fcfaf7;
  border: 1px solid rgba(216, 200, 176, 0.2);
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.15);
  box-shadow: 0px 4px 10px rgba(32, 68, 76, 0.15);
}

.lmgmt-card-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  gap: 12px;
}

.lmgmt-card-meta {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4.5px;
}

.lmgmt-card-type {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.4px;
  color: #9b7b5c;
  white-space: nowrap;
}

.lmgmt-card-time {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #41484a;
  white-space: nowrap;
}

.lmgmt-badge {
  padding: 4px 12px;
  border-radius: 9999px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.lmgmt-badge-pending {
  background-color: rgba(32, 68, 76, 0.1);
  color: #20444c;
}

.lmgmt-badge-passed {
  background-color: #dcfce7;
  color: #166534;
}

.lmgmt-badge-rejected {
  background-color: rgba(186, 26, 26, 0.1);
  color: #ba1a1a;
}

.lmgmt-block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding-left: 4px;
  padding-right: 4px;
}

.lmgmt-block-pad {
  padding-top: 0;
  padding-bottom: 0;
}

.lmgmt-block-label {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #9b7b5c;
  text-transform: uppercase;
}

.lmgmt-block-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #042e35;
}

.lmgmt-result {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  padding-top: 16px;
  padding-left: 4px;
  padding-right: 4px;
  overflow: hidden;
}

.lmgmt-result .lmgmt-block {
  gap: 8px;
  padding-left: 0;
  padding-right: 0;
}

.lmgmt-result .lmgmt-block-text {
  padding-top: 4px;
}

.lmgmt-result-foot {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  opacity: 0.6;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #41484a;
  white-space: nowrap;
}
.lmgmt-result-foot span{
    display: block;
}
.lmgmt-fab {
  position: fixed;
  right: 25px;
  bottom: 72px;
  z-index: 50;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 7.99px;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  background-color: #9b7b5c;
  border-radius: 9999px;
  text-decoration: none;
  -webkit-box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.lmgmt-fab-icon {
  width: 13px;
  height: 13px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.lmgmt-fab-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #ffffff;
  white-space: nowrap;
}

@media (min-width: 391px) {
  .lmgmt-fab {
    right: calc(50% - 195px + 25px);
  }
}

/* ========== ???? ========== */
.about-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100vh;
  padding-bottom: 0;
}

.about-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.about-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.about-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.about-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.about-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.about-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  padding: 48px 24px 48px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

.about-brand {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 8px;
}

.about-logo {
  width: 112px;
  height: 135px;
  max-width: none;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.about-slogan-zh {
  margin-top: 10px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #c7ac63;
  white-space: nowrap;
}

.about-slogan-en {
  margin-top: 0;
  padding-left: 30px;
  padding-right: 30px;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 600;
  font-size: 12px;
  line-height: 16.5px;
  letter-spacing: 0.55px;
  text-align: center;
  text-transform: uppercase;
  color: #d8d1ca;
  white-space: nowrap;
}

.about-nav {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
}

.about-nav-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding: 24px 8px;
  text-decoration: none;
}

.about-nav-text {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 30px;
  letter-spacing: 0.5px;
  color: #dab866;
  white-space: nowrap;
}

.about-nav-arrow {
  width: 7.4px;
  height: 12px;
  max-width: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.about-divider {
  position: relative;
  width: 100%;
  height: 1px;
  opacity: 0.4;
  background-image: -webkit-linear-gradient(left, rgba(216, 200, 176, 0) 0%, #d8c8b0 20%, #d8c8b0 80%, rgba(216, 200, 176, 0) 100%);
  background-image: linear-gradient(90deg, rgba(216, 200, 176, 0) 0%, #d8c8b0 20%, #d8c8b0 80%, rgba(216, 200, 176, 0) 100%);
}

.about-divider-diamond {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 8px;
  height: 8px;
  margin-left: -4px;
  margin-top: -4px;
  background-color: #20444c;
  border: 1px solid #d8c8b0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.about-footer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  padding: 33px 24px 40px;
  background-color: #20444c;
  border-top: 1px solid rgba(32, 68, 76, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.about-footer-text {
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 1.2px;
  text-align: center;
  color: #ffffff;
  white-space: nowrap;
}

.about-footer-brand {
  font-weight: 600;
  color: #dab866;
}

/* ========== ???? ========== */
.intro-page {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 0;
}

.intro-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 56px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 1px;
  background-color: #20444c;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.intro-back {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 21px;
  overflow: hidden;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.intro-back-icon {
  width: 137px;
  height: 20.5px;
  max-width: none;
}

.intro-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 25.5px;
  text-align: center;
  color: #dab866;
  white-space: nowrap;
}

.intro-header-spacer {
  width: 24px;
  height: 21px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.intro-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  padding: 32px 24px 128px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.intro-card {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  overflow: hidden;
  background-color: #fcfaf7;
  border-radius: 8px;
  -webkit-box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.intro-card-inner {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 40px;
  width: 100%;
  padding: 31.25px 32px 32px;
}

.intro-meta {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.intro-title {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 24px;
  color: #042e35;
}

.intro-time {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: rgba(65, 72, 74, 0.7);
}

.intro-hero {
  position: relative;
  width: 100%;
  height: 156.38px;
  overflow: hidden;
  border-radius: 8px;
}

.intro-hero-img {
  width: 100%;
  height: 100%;
  max-width: none;
  -o-object-fit: cover;
  object-fit: cover;
}

.intro-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 100%);
  pointer-events: none;
}

.intro-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 31.4px;
  width: 100%;
  padding-bottom: 24px;
}

.intro-text {
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 32.4px;
  color: #9b7b5c;
}

/* ========== 学校老师底部导航 ========== */
.teacher-tabbar {
  padding-left: 4px;
  padding-right: 4px;
  border-top: 1px solid rgba(216, 200, 176, 0.04);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.teacher-tabbar .students-tab {
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 0;
  -ms-flex: 1 0 0;
  flex: 1 0 0;
  min-width: 0;
  gap: 2px;
  opacity: 0.8;
}

.teacher-tabbar .students-tab-active {
  opacity: 1;
}

.teacher-tabbar .students-tab-label {
  margin-top: 0;
  font-size: 12px;
  line-height: 16.5px;
  color: #fcfaf7;
}

.teacher-tabbar .teacher-tab-icon-active {
  display: none;
}

.teacher-tabbar .students-tab-active .teacher-tab-icon:not(.teacher-tab-icon-active) {
  display: none;
}

.teacher-tabbar .students-tab-active .teacher-tab-icon-active {
  display: block;
}

.teacher-tab-icon-alerts {
  width: 18.58px;
  height: 17.5px;
}

.teacher-tab-icon-leave {
  width: 20px;
  height: 18.4px;
}

.teacher-tab-icon-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.teacher-tab-dot {
  position: absolute;
  top: -2px;
  right: -3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #e85d4c;
  box-shadow: 0 0 0 1.5px #20444c;
  pointer-events: none;
}

.teacher-tab-icon-handling {
  width: 15.58px;
  height: 17.5px;
}

.teacher-tab-icon-ledger {
  width: 18.7px;
  height: 17.5px;
}

.leave-status-rejected {
  color: #c96a62;
}

.ledger-main,
.leave-main,
.alerts-main,
.handling-main {
  padding-bottom: 72px;
}

/* 档案页左上角退出：避免沿用 16px 返回图标尺寸导致「退出」换行 */
.archive-logout {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-width: 40px;
  height: 27px;
  padding: 0 2px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  color: #fcfaf7;
  text-decoration: none;
  white-space: nowrap;
}

.archive-header-spacer {
  display: block;
  flex-shrink: 0;
  width: 40px;
  height: 27px;
}

/* ========== 实习生底部导航（5 Tab） ========== */
.student-tabbar {
  padding-left: 0;
  padding-right: 0;
  border-top: 1px solid rgba(216, 200, 176, 0.04);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.student-tabbar .students-tab {
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 0;
  -ms-flex: 1 0 0;
  flex: 1 0 0;
  min-width: 0;
  gap: 4px;
  opacity: 1;
}

.student-tabbar .students-tab-label {
  margin-top: 0;
  font-size: 12px;
  line-height: 15px;
  letter-spacing: -0.25px;
  color: #d8c8b0;
  white-space: nowrap;
}

.student-tabbar .students-tab-active .students-tab-label {
  color: #fcfaf7;
  font-weight: 500;
}

.student-tabbar .student-tab-icon-active {
  display: none;
}

.student-tabbar .students-tab-active .student-tab-icon:not(.student-tab-icon-active) {
  display: none;
}

.student-tabbar .students-tab-active .student-tab-icon-active {
  display: block;
}

.student-tab-icon-archive {
  width: 17.42px;
  height: 15.75px;
}

.student-tab-icon-contact {
  width: 15.58px;
  height: 17.58px;
}

.student-tab-icon-checkin {
  width: 18.33px;
  height: 20.33px;
}

.student-tab-icon-journal {
  width: 15.58px;
  height: 17.58px;
}

.student-tab-icon-leave {
  width: 20px;
  height: 18.4px;
}

.archive-page .archive-main,
.checkin-page .checkin-main,
.jsubmit-page .jsubmit-main,
.lmgmt-page .lmgmt-main,
.contact-page .contact-main,
.evalstats-page .evalstats-main {
  padding-bottom: 88px;
}

/* 周记提交：版块间距 */
.jsubmit-page #jsubmitForm {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

/* 档案页：版块间距 + 基础信息左对齐 */
.archive-page .archive-main {
  gap: 16px;
}

.archive-page #archiveForm {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.archive-page .archive-basic-fields {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  gap: 10px;
  text-align: left;
}

.archive-page .archive-kv {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  text-align: left;
}

.archive-page .archive-kv-label,
.archive-page .archive-kv-label-sm {
  width: 48px;
  text-align: left;
}

.archive-page .archive-kv-label-sm {
  width: 36px;
}

.archive-page .archive-kv-value {
  text-align: left;
}

/* 档案页承诺勾选框 */
.archive-page .archive-commit {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  margin-bottom: 4px;
  cursor: pointer;
}

.archive-page .archive-commit-input {
  position: absolute;
  left: 0;
  top: 2px;
  width: 16px;
  height: 16px;
  margin: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 1;
}

.archive-page .archive-commit-box {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  background-color: transparent;
  border: 1px solid rgba(216, 200, 176, 0.6);
  border-radius: 3px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.archive-page .archive-commit-box::after {
  content: none;
}

.archive-page .archive-commit-input:checked + .archive-commit-box {
  background-color: #9b7b5c;
  border-color: #9b7b5c;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.archive-page .archive-commit-input:checked + .archive-commit-box::after {
  content: "";
  display: block;
  width: 8px;
  height: 5px;
  margin-top: -2px;
  border-left: 2px solid #fcfaf7;
  border-bottom: 2px solid #fcfaf7;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.archive-page .archive-commit-text {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  color: rgba(252, 250, 247, 0.7);
  text-align: left;
}

/* 期望就业省市：标签在上，三列输入并排 */
.archive-page .archive-region {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  min-height: 0;
}

.archive-page .archive-region-label {
  width: auto;
  font-size: 12px;
  line-height: 18px;
  color: rgba(67, 93, 99, 0.5);
  text-align: left;
  white-space: nowrap;
}

.archive-page .archive-region-selects {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.archive-page .archive-select-wrap {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0px;
  flex: 1 1 0;
  min-width: 0;
  height: 36px;
  padding: 0 10px;
  background-color: rgba(155, 123, 92, 0.06);
  border: 1px solid rgba(216, 200, 176, 0.3);
  border-radius: 6px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.archive-page .archive-select {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 18px 0 0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 400;
  font-size: 13px;
  line-height: 20px;
  color: #9b7b5c;
  background-color: transparent;
  border: 0;
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.archive-page .archive-select-icon {
  position: absolute;
  right: 2px;
  top: 50%;
  width: 19.5px;
  height: 19.5px;
  pointer-events: none;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.archive-page .archive-select::-webkit-input-placeholder {
  color: rgba(155, 123, 92, 0.45);
}

.archive-page .archive-select::-moz-placeholder {
  color: rgba(155, 123, 92, 0.45);
}

.archive-page .archive-select::placeholder {
  color: rgba(155, 123, 92, 0.45);
}

/* ========== 登录后页头右上角退出 ========== */
.app-header-bar {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.app-header-side {
  display: block;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 40px;
  height: 27px;
}

.app-header-title {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
}

.app-logout {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  min-width: 40px;
  height: 27px;
  padding: 0 2px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  color: #fcfaf7;
  text-decoration: none;
  white-space: nowrap;
}

/* ========== 退出登录弹窗 ========== */
.logout-modal {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 320;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 24px;
}

.logout-modal[hidden] {
  display: none;
}

.logout-modal-mask {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(32, 68, 76, 0.75);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.logout-modal-panel {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 20px;
  width: 100%;
  max-width: 300px;
  padding: 28px 24px 24px;
  background-color: #fcfaf7;
  border-radius: 12px;
  -webkit-box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.logout-modal-icon {
  width: 64px;
  height: 64px;
  -o-object-fit: contain;
  object-fit: contain;
}

.logout-modal-text {
  width: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #20444c;
  word-break: break-word;
}

.logout-modal-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  width: 100%;
}

.logout-modal-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 44px;
  padding: 0 16px;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 22px;
  border: 0;
  border-radius: 9999px;
  cursor: pointer;
}

.logout-modal-actions .logout-modal-btn {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0;
  -ms-flex: 1 1 0;
  flex: 1 1 0;
  min-width: 0;
}

.logout-modal-btn-cancel {
  color: #20444c;
  background-color: rgba(155, 123, 92, 0.12);
}

.logout-modal-btn-confirm {
  color: #fcfaf7;
  background-color: #9b7b5c;
}

.logout-modal-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
