lockscreen_mod.css

:root {
  --fnos-lockscreen-accent: #68e8ff;
  --fnos-lockscreen-accent-soft: rgba(104, 232, 255, 0.42);
  --fnos-lockscreen-line: rgba(222, 236, 89, 0.72);
  --fnos-lockscreen-shade-top: rgba(3, 23, 70, 0.24);
  --fnos-lockscreen-shade-mid: rgba(3, 23, 70, 0.54);
  --fnos-lockscreen-shade-bottom: rgba(2, 15, 45, 0.78);
}

.login-form {
  position: relative !important;
  overflow: hidden !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

.login-form::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.login-form>* {
  position: relative;
  z-index: 1;
}

#fnos-login-clock {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: flex !important;
  flex-direction: column-reverse;
  align-items: center;
  gap: 8px;
  position: fixed;
  right: 12px;
  top: 8px;
}

#fnos-login-clock .fnos-login-clock-time,
p.text-\[18px\].min-h-\[26px\].leading-xl.text-center.mt-5.mb-\[22px\].select-none {
  line-height: 0.95 !important;
  letter-spacing: 0.03em !important;
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
  font-style: normal;
}

p.text-\[18px\].min-h-\[26px\].leading-xl.text-center.mt-5.mb-\[22px\].select-none {
  position: absolute;
  left: 38px;
  top: 8px;
  margin: 0;
  min-height: unset;
}

p.text-\[18px\].min-h-\[26px\].leading-xl.text-center.mt-5.mb-\[22px\].select-none::before {
  content: '登录至 ';
  margin: 0;
  min-height: unset;
}

img.w-\[60px\].sm\:w-auto[alt="logo"] {
  height: 14px;
  position: absolute;
  left: 12px;
  top: 7px;
  opacity: 0.75;
}

.semi-form-field-password+.mt-\[10px\].flex.w-full.items-center.justify-between>.cursor-pointer.text-base.leading-\[22px\].text-white-80 {
  right: 96px;
  position: absolute;
  top: 8px;
  line-height: 0.95 !important;
  letter-spacing: 0.03em !important;
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
  font-style: normal;
}

.login-form .gradient-border {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  height: 100vh;
  width: 100vw;
  outline: none;
}

.login-form .semi-input,
.login-form .semi-input::placeholder {
  mix-blend-mode: darken;
  font-size: 14px;
}

.login-form .semi-checkbox-addon,
.login-form .cursor-pointer {
  color: rgba(234, 247, 255, 0.88) !important;
}

.login-form form.semi-form {
  display: flex;
  flex-direction: column;
  max-width: 278px;
}

.login-form .fnos-lockscreen-default-username-row {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
}

.login-form .fnos-lockscreen-default-username-text {
  flex: 1;
  min-width: 0;
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: 0 14px 4px;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.95);
  text-shadow: 0 2px 6px #00000083;
  font-size: 28px;
  line-height: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
  justify-content: center;
}

.login-form .fnos-lockscreen-switch-account {
  position: absolute;
  left: 50%;
  bottom: clamp(16px, 5.5vh, 44px);
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(230, 237, 252, 0.88);
  font-size: 15px;
  font-weight: 620;
  letter-spacing: 0.02em;
  line-height: 1;
  cursor: pointer;
  user-select: none;
  z-index: 3;
}

.login-form .fnos-lockscreen-switch-account-icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(10px);
  background-image: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOCAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI3LjU4OSAxNC40NjQyTDI0Ljk2NCAxNy4wODkyQzI0Ljg0MDkgMTcuMjEyMSAyNC42NzQxIDE3LjI4MTEgMjQuNTAwMiAxNy4yODExQzI0LjMyNjMgMTcuMjgxMSAyNC4xNTk1IDE3LjIxMjEgMjQuMDM2NSAxNy4wODkyTDIxLjQxMTUgMTQuNDY0MkMyMS4zNDcgMTQuNDA0MSAyMS4yOTUzIDE0LjMzMTcgMjEuMjU5NCAxNC4yNTEyQzIxLjIyMzYgMTQuMTcwNyAyMS4yMDQzIDE0LjA4MzggMjEuMjAyNyAxMy45OTU3QzIxLjIwMTIgMTMuOTA3NiAyMS4yMTc0IDEzLjgyIDIxLjI1MDQgMTMuNzM4M0MyMS4yODM0IDEzLjY1NjYgMjEuMzMyNSAxMy41ODI0IDIxLjM5NDggMTMuNTIwMUMyMS40NTcxIDEzLjQ1NzcgMjEuNTMxNCAxMy40MDg2IDIxLjYxMzEgMTMuMzc1NkMyMS42OTQ4IDEzLjM0MjYgMjEuNzgyMyAxMy4zMjY0IDIxLjg3MDQgMTMuMzI3OUMyMS45NTg2IDEzLjMyOTUgMjIuMDQ1NSAxMy4zNDg4IDIyLjEyNiAxMy4zODQ3QzIyLjIwNjUgMTMuNDIwNSAyMi4yNzg5IDEzLjQ3MjIgMjIuMzM5IDEzLjUzNjdMMjMuODQ0IDE1LjA0MDZWMTQuMDAwNUMyMy44NDQ5IDExLjkxNjIgMjMuMTg0MyA5Ljg4NTQ0IDIxLjk1NzIgOC4yMDA2OEMyMC43MzAxIDYuNTE1OTIgMTkgNS4yNjQxMiAxNy4wMTU5IDQuNjI1NkMxNS4wMzE5IDMuOTg3MDcgMTIuODk2NCAzLjk5NDc4IDEwLjkxNyA0LjY0NzYxQzguOTM3NiA1LjMwMDQ0IDcuMjE2NTIgNi41NjQ3IDYuMDAxNjQgOC4yNTgyN0M1Ljk1MjU1IDguMzMxMTQgNS44ODkzNCA4LjM5MzQgNS44MTU3NCA4LjQ0MTM4QzUuNzQyMTQgOC40ODkzNiA1LjY1OTY2IDguNTIyMDcgNS41NzMxOCA4LjUzNzU3QzUuNDg2NyA4LjU1MzA3IDUuMzk4IDguNTUxMDYgNS4zMTIzMSA4LjUzMTY0QzUuMjI2NjMgOC41MTIyMiA1LjE0NTcyIDguNDc1NzkgNS4wNzQzOCA4LjQyNDUyQzUuMDAzMDQgOC4zNzMyNSA0Ljk0MjcyIDguMzA4MTcgNC44OTcgOC4yMzMxNUM0Ljg1MTI3IDguMTU4MTMgNC44MjEwOCA4LjA3NDcgNC44MDgyIDcuOTg3NzlDNC43OTUzMyA3LjkwMDg5IDQuODAwMDQgNy44MTIyOCA0LjgyMjA0IDcuNzI3MjJDNC44NDQwNSA3LjY0MjE3IDQuODgyOTEgNy41NjI0IDQuOTM2MzMgNy40OTI2NUM2LjMxMzM1IDUuNTczNzYgOC4yNjM4NCA0LjE0MTQxIDEwLjUwNjkgMy40MDE4NUMxMi43NSAyLjY2MjI5IDE1LjE2OTkgMi42NTM3IDE3LjQxODIgMy4zNzczQzE5LjY2NjUgNC4xMDA5IDIxLjYyNzEgNS41MTkzNiAyMy4wMTc3IDcuNDI4NDJDMjQuNDA4MyA5LjMzNzQ3IDI1LjE1NzIgMTEuNjM4NiAyNS4xNTY1IDE0LjAwMDVWMTUuMDQwNkwyNi42NjE1IDEzLjUzNjdDMjYuNzIxNiAxMy40NzIyIDI2Ljc5NCAxMy40MjA1IDI2Ljg3NDUgMTMuMzg0N0MyNi45NTUgMTMuMzQ4OCAyNy4wNDE5IDEzLjMyOTUgMjcuMTMgMTMuMzI3OUMyNy4yMTgxIDEzLjMyNjQgMjcuMzA1NyAxMy4zNDI2IDI3LjM4NzQgMTMuMzc1NkMyNy40NjkxIDEzLjQwODYgMjcuNTQzMyAxMy40NTc3IDI3LjYwNTYgMTMuNTIwMUMyNy42NjggMTMuNTgyNCAyNy43MTcxIDEzLjY1NjYgMjcuNzUwMSAxMy43MzgzQzI3Ljc4MzEgMTMuODIgMjcuNzk5MyAxMy45MDc2IDI3Ljc5NzcgMTMuOTk1N0MyNy43OTYyIDE0LjA4MzggMjcuNzc2OSAxNC4xNzA3IDI3Ljc0MSAxNC4yNTEyQzI3LjcwNTIgMTQuMzMxNyAyNy42NTM1IDE0LjQwNDEgMjcuNTg5IDE0LjQ2NDJaTTIzLjA2MiAyMC41MDgzQzIxLjY4NDYgMjIuNDI2MiAxOS43MzQzIDIzLjg1NzcgMTcuNDkxNiAyNC41OTY3QzE1LjI0ODkgMjUuMzM1NiAxMi44Mjk2IDI1LjM0NCAxMC41ODE5IDI0LjYyMDVDOC4zMzQyNSAyMy44OTcgNi4zNzQwNyAyMi40NzkgNC45ODM1NiAyMC41NzA1QzMuNTkzMDQgMTguNjYyMSAyLjg0MzkxIDE2LjM2MTcgMi44NDM5OCAxNC4wMDA1VjEyLjk2MDNMMS4zMzg5OCAxNC40NjQyQzEuMjE0NTggMTQuNTgwMSAxLjA1MDA0IDE0LjY0MzIgMC44ODAwMjUgMTQuNjQwMkMwLjcxMDAxMSAxNC42MzcyIDAuNTQ3Nzk5IDE0LjU2ODQgMC40Mjc1NjMgMTQuNDQ4MUMwLjMwNzMyNiAxNC4zMjc5IDAuMjM4NDUzIDE0LjE2NTcgMC4yMzU0NTQgMTMuOTk1N0MwLjIzMjQ1NCAxMy44MjU3IDAuMjk1NTYyIDEzLjY2MTEgMC40MTE0ODIgMTMuNTM2N0wzLjAzNjQ4IDEwLjkxMTdDMy4xNTk1MyAxMC43ODg4IDMuMzI2MzMgMTAuNzE5OCAzLjUwMDIzIDEwLjcxOThDMy42NzQxNCAxMC43MTk4IDMuODQwOTMgMTAuNzg4OCAzLjk2Mzk4IDEwLjkxMTdMNi41ODg5OCAxMy41MzY3QzYuNjUzNDYgMTMuNTk2OCA2LjcwNTE3IDEzLjY2OTIgNi43NDEwNCAxMy43NDk3QzYuNzc2OTEgMTMuODMwMiA2Ljc5NjE5IDEzLjkxNzEgNi43OTc3NSAxNC4wMDUzQzYuNzk5MyAxNC4wOTM0IDYuNzgzMSAxNC4xODA5IDYuNzUwMDkgMTQuMjYyNkM2LjcxNzA4IDE0LjM0NDMgNi42Njc5NiAxNC40MTg2IDYuNjA1NjQgMTQuNDgwOUM2LjU0MzMyIDE0LjU0MzIgNi40NjkwOSAxNC41OTIzIDYuMzg3MzggMTQuNjI1M0M2LjMwNTY3IDE0LjY1ODMgNi4yMTgxNCAxNC42NzQ1IDYuMTMwMDIgMTQuNjczQzYuMDQxOTEgMTQuNjcxNCA1Ljk1NTAxIDE0LjY1MjEgNS44NzQ1MSAxNC42MTYzQzUuNzk0MDEgMTQuNTgwNCA1LjcyMTU2IDE0LjUyODcgNS42NjE0OCAxNC40NjQyTDQuMTU2NDggMTIuOTYwM1YxNC4wMDA1QzQuMTU0NjIgMTYuNTA3NSA1LjExMzE1IDE4LjkyMDEgNi44MzUwOCAyMC43NDIzQzcuODY2MTkgMTkuMTM5MSA5LjQwNzQzIDE3LjkzIDExLjIxMDEgMTcuMzEwMUMxMC4zMTEyIDE2LjcxMTQgOS42Mjg4MyAxNS44Mzk0IDkuMjYzODcgMTQuODIyOUM4Ljg5ODkgMTMuODA2NCA4Ljg3MDcxIDEyLjY5OTUgOS4xODM0NiAxMS42NjU4QzkuNDk2MjEgMTAuNjMyIDEwLjEzMzMgOS43MjYzNiAxMS4wMDA1IDkuMDgyNjhDMTEuODY3OCA4LjQzOSAxMi45MTkxIDguMDkxNDYgMTMuOTk5MSA4LjA5MTQ2QzE1LjA3OTEgOC4wOTE0NiAxNi4xMzA1IDguNDM5IDE2Ljk5NzcgOS4wODI2OEMxNy44NjUgOS43MjYzNiAxOC41MDIxIDEwLjYzMiAxOC44MTQ4IDExLjY2NThDMTkuMTI3NiAxMi42OTk1IDE5LjA5OTQgMTMuODA2NCAxOC43MzQ0IDE0LjgyMjlDMTguMzY5NCAxNS44Mzk0IDE3LjY4NzEgMTYuNzExNCAxNi43ODgyIDE3LjMxMDFDMTguNTkxNSAxNy45MzA1IDIwLjEzMjkgMTkuMTQwOSAyMS4xNjMyIDIwLjc0NTZDMjEuNDYxNSAyMC40MzAxIDIxLjczODUgMjAuMDk1IDIxLjk5MjMgMTkuNzQyNkMyMi4wNDE0IDE5LjY2OTggMjIuMTA0NiAxOS42MDc1IDIyLjE3ODIgMTkuNTU5NUMyMi4yNTE4IDE5LjUxMTYgMjIuMzM0MiAxOS40Nzg5IDIyLjQyMDcgMTkuNDYzNEMyMi41MDcyIDE5LjQ0NzggMjIuNTk1OSAxOS40NDk5IDIyLjY4MTYgMTkuNDY5M0MyMi43NjczIDE5LjQ4ODcgMjIuODQ4MiAxOS41MjUxIDIyLjkxOTUgMTkuNTc2NEMyMi45OTA5IDE5LjYyNzcgMjMuMDUxMiAxOS42OTI3IDIzLjA5NjkgMTkuNzY3OEMyMy4xNDI2IDE5Ljg0MjggMjMuMTcyOCAxOS45MjYyIDIzLjE4NTcgMjAuMDEzMUMyMy4xOTg2IDIwLjEgMjMuMTkzOSAyMC4xODg2IDIzLjE3MTkgMjAuMjczN0MyMy4xNDk5IDIwLjM1ODcgMjMuMTExIDIwLjQzODUgMjMuMDU3NiAyMC41MDgzSDIzLjA2MlpNMTQuMDAwMiAxNi44NDQyQzE0LjczNTcgMTYuODQ0MiAxNS40NTQ3IDE2LjYyNjEgMTYuMDY2MyAxNi4yMTc1QzE2LjY3NzggMTUuODA4OSAxNy4xNTQ0IDE1LjIyODEgMTcuNDM1OSAxNC41NDg2QzE3LjcxNzQgMTMuODY5MSAxNy43OTEgMTMuMTIxMyAxNy42NDc1IDEyLjRDMTcuNTA0IDExLjY3ODYgMTcuMTQ5OSAxMS4wMTYgMTYuNjI5OCAxMC40OTU5QzE2LjEwOTcgOS45NzU4MyAxNS40NDcxIDkuNjIxNjUgMTQuNzI1NyA5LjQ3ODE3QzE0LjAwNDQgOS4zMzQ2OCAxMy4yNTY2IDkuNDA4MzIgMTIuNTc3MSA5LjY4OTc4QzExLjg5NzYgOS45NzEyNSAxMS4zMTY4IDEwLjQ0NzkgMTAuOTA4MiAxMS4wNTk0QzEwLjQ5OTYgMTEuNjcxIDEwLjI4MTUgMTIuMzkgMTAuMjgxNSAxMy4xMjU1QzEwLjI4MTUgMTQuMTExNyAxMC42NzMzIDE1LjA1NzYgMTEuMzcwNyAxNS43NTVDMTIuMDY4MSAxNi40NTI0IDEzLjAxNCAxNi44NDQyIDE0LjAwMDIgMTYuODQ0MlpNMTQuMDAwMiAyMy44NDQyQzE2LjI1MTggMjMuODQyMSAxOC40MzUgMjMuMDcwMyAyMC4xODc2IDIxLjY1NjdDMTkuNTQ1OCAyMC41ODkzIDE4LjYzODggMTkuNzA2IDE3LjU1NDcgMTkuMDkyOEMxNi40NzA2IDE4LjQ3OTYgMTUuMjQ2MyAxOC4xNTc0IDE0LjAwMDggMTguMTU3NEMxMi43NTUzIDE4LjE1NzQgMTEuNTMwOSAxOC40Nzk2IDEwLjQ0NjggMTkuMDkyOEM5LjM2MjczIDE5LjcwNiA4LjQ1NTcyIDIwLjU4OTMgNy44MTM5OCAyMS42NTY3QzkuNTYzMzYgMjMuMDc1MiAxMS43NDggMjMuODQ3NyAxNC4wMDAyIDIzLjg0NDJaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 28px;
  transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
  mix-blend-mode: overlay;
}

.login-form .fnos-lockscreen-switch-account-label {
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
  line-height: 1;
  text-align: center;
}

.login-form .fnos-lockscreen-switch-account:hover .fnos-lockscreen-switch-account-icon {
  background-color: rgba(255, 255, 255, 0.4);
}

.login-form .fnos-lockscreen-text-avatar {
  width: 72px;
  height: 72px;
  margin: 0 auto 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-weight: 640;
  line-height: 1;
  text-transform: uppercase;
  color: var(--fnos-lockscreen-avatar-fg, #ffffff);
  letter-spacing: 0.01em;
  background: rgb(var(--fnos-lockscreen-avatar-bg, var(--semi-brand-4, 0, 102, 255)));
  user-select: none;
  pointer-events: none;
}

.semi-form-field.semi-form-field-username {
  padding: 0 !important;
}

.login-form .semi-button-primary:not(.semi-button-disabled),
.login-form .semi-button-disabled {
  visibility: hidden;
}

.gradient-border:before {
  content: none !important;
}

.login-form .semi-input-wrapper {
  border-color: transparent;
  background: var(--semi-color-white-40);
  backdrop-filter: blur(14px);
  border-radius: 999px;
  max-height: 36px;
}

.semi-form-field-password+.mt-\[10px\].flex.w-full.items-center.justify-between {
  box-sizing: border-box;
  padding: 2px 14px;
  width: fit-content;
  margin: 14px auto 0;
}

.semi-checkbox:hover .semi-checkbox-inner-display {
  box-shadow: inset 0 0 0 1px #FFFFFF !important;
}

.semi-checkbox:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display,
.semi-checkbox-indeterminate .semi-checkbox-inner-display:hover,
.semi-checkbox-checked .semi-checkbox-inner-display:hover {
  background: rgba(255, 255, 255, 0.5) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
}

.semi-checkbox-indeterminate .semi-checkbox-inner-display,
.semi-checkbox-checked .semi-checkbox-inner-display {
  background: rgba(255, 255, 255, 0.25) !important;
  backdrop-filter: blur(6px);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25) !important;
}

.login-form .gradient-border:has(h4)>* {
  max-width: 369px;
}