@font-face { font-family: "nvwafont"; src: url("/nvwafont/nvwafont-han.woff2") format("woff2"); font-display: block; }
@font-face {
  font-family: "nvwafont"; src: url("/nvwafont/nvwafont-latin.woff2") format("woff2");
  unicode-range: U+0020-007E, U+00A0-00FF, U+2013-2014, U+2018-2019, U+201C-201D, U+20AC;
  font-display: block;
}
:root {
  --nv-bg-editor: #fdfcfb;
  --nv-bg-elevated: #ffffff;
  --nv-bg-input: #ffffff;
  --nv-fg: #2e2e2e;
  --nv-fg-secondary: #6b6b6b;
  --nv-fg-tertiary: #8f8f8f;
  --nv-fg-quaternary: #b5b5b5;
  --nv-stroke-primary: rgba(0,0,0,.2);
  --nv-stroke-secondary: rgba(0,0,0,.12);
  --nv-stroke-tertiary: rgba(0,0,0,.05);
  --nv-danger: #8a372b;
  --nv-warn: #8a6418;
  --nv-success: #3f6b3b;
  --nv-radius-base: 6px;
  --nv-space-1: 4px; --nv-space-1-5: 6px; --nv-space-2: 8px; --nv-space-2-5: 10px;
  --nv-space-3: 12px; --nv-space-4: 16px; --nv-space-6: 24px; --nv-space-8: 32px;
  --nv-text-xs: 11px; --nv-text-sm: 12px; --nv-text-base: 13px; --nv-text-lg: 14px;
  --nv-button-bg: #2e2e2e; --nv-button-bg-hover: #4a4a4a; --nv-button-fg: #fbfbfb;
  --nv-titlebar-height: 0px;
  --nv-font-sans: "nvwafont", "Kaiti SC", "STKaiti", "华文楷体", KaiTi, 楷体, system-ui, sans-serif;
  --nv-font-mono: Menlo, Consolas, monospace;
}
body { margin: 0; font-family: var(--nv-font-sans); background: var(--nv-bg-editor); color: var(--nv-fg); }
/* 桌面端登录页：整窗，居中一张毛玻璃卡片；顶部一条可拖动窗口（macOS 红绿灯在这条上）。
   只用黑白灰：在这一页里把强调色、主按钮色换成灰阶（聚焦描边、选中文字等都跟着变），工作台不受影响。 */
.nv-login {
  --login-bg: oklch(0.962 0 0);
  --login-cube-top: oklch(0.935 0 0);
  --login-cube-left: oklch(0.87 0 0);
  --login-cube-right: oklch(0.8 0 0);
  --login-glass: oklch(1 0 0 / 0.5);
  --login-glass-border: oklch(1 0 0 / 0.75);
  --login-glass-edge: oklch(0.191 0 0 / 0.07);
  --login-glass-shadow: 0 16px 48px oklch(0 0 0 / 0.08), 0 2px 6px oklch(0 0 0 / 0.04);
  --login-input: oklch(1 0 0 / 0.6);
  --login-focus-ring: oklch(0.191 0 0 / 0.07);
  --login-btn-disabled: oklch(0.191 0 0 / 0.1);
  --login-btn-disabled-fg: oklch(0.191 0 0 / 0.38);
  --nv-accent: oklch(0.191 0 0 / 0.45);
  --nv-button-bg: oklch(0.18 0 0);
  --nv-button-bg-hover: oklch(0.3 0 0);
  --nv-button-fg: oklch(0.985 0 0);

  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  background: var(--login-bg);
  color: var(--nv-fg);
}

/* 卡片后面的大立方体：比卡片略大，透过毛玻璃是一片柔的明暗，卡片外面露出立方体轮廓 */
.nv-login__backdrop {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(92vh, 92vw, 760px);
  height: min(92vh, 92vw, 760px);
  transform: translate(-50%, -50%);
  filter: blur(10px);
  pointer-events: none;
}

.nv-login__face--top { fill: var(--login-cube-top); }
.nv-login__face--left { fill: var(--login-cube-left); }
.nv-login__face--right { fill: var(--login-cube-right); }

:root[data-theme="dark"] .nv-login {
  --login-bg: oklch(0.165 0 0);
  --login-cube-top: oklch(0.27 0 0);
  --login-cube-left: oklch(0.22 0 0);
  --login-cube-right: oklch(0.13 0 0);
  --login-glass: oklch(1 0 0 / 0.045);
  --login-glass-border: oklch(1 0 0 / 0.1);
  --login-glass-edge: oklch(0 0 0 / 0.3);
  --login-glass-shadow: 0 16px 48px oklch(0 0 0 / 0.35), 0 2px 6px oklch(0 0 0 / 0.2);
  --login-input: oklch(1 0 0 / 0.04);
  --login-focus-ring: oklch(1 0 0 / 0.06);
  --login-btn-disabled: oklch(1 0 0 / 0.08);
  --login-btn-disabled-fg: oklch(1 0 0 / 0.35);
  --nv-accent: oklch(1 0 0 / 0.4);
  --nv-button-bg: oklch(0.94 0 0);
  --nv-button-bg-hover: oklch(1 0 0);
  --nv-button-fg: oklch(0.165 0 0);
}

.nv-login__drag,
.nv-login__center {
  position: relative;
}

.nv-login__drag {
  flex: none;
  height: var(--nv-titlebar-height);
  -webkit-app-region: drag;
}

.nv-login__center {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--nv-space-6);
  padding: var(--nv-space-6) var(--nv-space-4) calc(var(--nv-titlebar-height) + var(--nv-space-6));
}

.nv-login__form {
  display: flex;
  flex-direction: column;
  gap: var(--nv-space-3);
  width: 100%;
  max-width: 368px;
  padding: var(--nv-space-8) var(--nv-space-6) var(--nv-space-6);
  border: 1px solid var(--login-glass-border);
  border-radius: 16px;
  background: var(--login-glass);
  box-shadow: 0 0 0 1px var(--login-glass-edge), var(--login-glass-shadow);
  backdrop-filter: blur(28px) saturate(1.2);
}

.nv-login__brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--nv-space-2);
  margin-bottom: var(--nv-space-4);
}

.nv-login__title {
  margin: 0;
  line-height: 0;
}

/* 只放立方体，不带底板；按主题二选一（浅色底用压暗的那套配色） */
.nv-login__logo {
  display: block;
  width: 48px;
  height: 48px;
}

.nv-login__logo--dark,
:root[data-theme="dark"] .nv-login__logo--light {
  display: none;
}

:root[data-theme="dark"] .nv-login__logo--dark {
  display: block;
}

.nv-login__subtitle {
  margin: 0;
  font-size: var(--nv-text-base);
  color: var(--nv-fg-secondary);
  text-align: center;
}

.nv-login__notice {
  display: flex;
  background: var(--login-input);
  align-items: center;
  gap: var(--nv-space-2);
  padding: var(--nv-space-2) var(--nv-space-3);
  border: 1px solid var(--nv-stroke-secondary);
  border-radius: var(--nv-radius-base);
  font-size: var(--nv-text-sm);
  color: var(--nv-fg-secondary);
}

.nv-field { display: flex; flex-direction: column; gap: var(--nv-space-1-5, 6px); }
.nv-field > span { font-size: var(--nv-text-sm, 12px); color: var(--nv-fg-secondary); }
.nv-field input {
  height: 32px;
  border-color: var(--nv-stroke-secondary);
  background: var(--login-input);
  transition: border-color 120ms, box-shadow 120ms;
}

.nv-login__form .nv-field input:focus {
  box-shadow: 0 0 0 3px var(--login-focus-ring);
}

.nv-login__error {
  font-size: var(--nv-text-sm);
  color: var(--nv-danger);
}

.nv-login__submit {
  width: 100%;
  height: 32px;
  justify-content: center;
  margin-top: var(--nv-space-1);
}

/* 没填完时按钮是一块浅灰，不靠半透明（深色下半透明的白按钮上字会看不清） */
.nv-login__submit:disabled {
  opacity: 1;
  background: var(--login-btn-disabled);
  color: var(--login-btn-disabled-fg);
}

.nv-login__links {
  display: flex;
  justify-content: center;
  gap: var(--nv-space-2);
  font-size: var(--nv-text-sm);
  color: var(--nv-fg-tertiary);
}

.nv-login__links button {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  cursor: pointer;
  color: var(--nv-fg-secondary);
  text-decoration: none;
}

.nv-login__links button:hover {
  color: var(--nv-fg);
  text-decoration: underline;
}

.nv-login__step {
  margin: 0;
  font-size: var(--nv-text-sm);
  color: var(--nv-fg-tertiary);
}

/* 标签行：左标签，右边一个小文字操作（显示密码、改邮箱） */
.nv-login__label {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nv-login__aside {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: var(--nv-fg-tertiary);
  cursor: pointer;
}

.nv-login__aside:hover {
  color: var(--nv-fg);
}

/* 验证码 + 重新发送：按钮与输入框同高、垂直居中 */
.nv-login__code {
  display: flex;
  align-items: center;
  gap: var(--nv-space-2);
}

.nv-login__code input {
  flex: 1;
  min-width: 0;
}

.nv-login__code .nv-btn {
  flex: none;
  height: 32px;
  padding: 0 var(--nv-space-3);
}

/* 密码框：强弱条贴在框内右侧 */
.nv-login__password {
  position: relative;
  display: flex;
}

.nv-login__password input {
  flex: 1;
  min-width: 0;
  padding-right: 72px;
}

.nv-login__strength {
  position: absolute;
  top: 50%;
  right: var(--nv-space-2);
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: var(--nv-text-xs, 11px);
  pointer-events: none;
}

.nv-login__strength i {
  width: 12px;
  height: 3px;
  border-radius: 1px;
  background: var(--nv-stroke-secondary);
}

.nv-login__strength span {
  margin-left: 4px;
}

.nv-login__strength--1 { color: var(--nv-danger); }
.nv-login__strength--2 { color: var(--nv-warn); }
.nv-login__strength--3 { color: var(--nv-success); }
.nv-login__strength--1 i:nth-of-type(-n + 1),
.nv-login__strength--2 i:nth-of-type(-n + 2),
.nv-login__strength--3 i:nth-of-type(-n + 3) {
  background: currentColor;
}

/* 手机号：区号下拉 + 号码，拼成一个框 */
.nv-login__phone {
  display: flex;
  align-items: stretch;
  height: 32px;
  border: 1px solid var(--nv-stroke-secondary);
  border-radius: var(--nv-radius-base);
  background: var(--login-input);
  overflow: hidden;
}

.nv-login__phone:focus-within {
  border-color: var(--nv-accent);
  box-shadow: 0 0 0 3px var(--login-focus-ring);
}

.nv-login__phone select {
  flex: none;
  width: 64px;
  padding: 0 var(--nv-space-2);
  border: 0;
  border-right: 1px solid var(--nv-stroke-secondary);
  background: transparent;
  font: inherit;
  font-size: var(--nv-text-base);
  font-variant-numeric: tabular-nums;
  color: var(--nv-fg);
  outline: none;
}

.nv-login__form .nv-login__phone input {
  flex: 1;
  min-width: 0;
  height: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* 出生日期：年 / 月 / 日三个框，后面跟单位 */
.nv-login__birth {
  display: grid;
  grid-template-columns: 1.3fr auto 1fr auto 1fr auto;
  align-items: center;
  gap: var(--nv-space-2);
  font-size: var(--nv-text-base);
}

.nv-login__birth input {
  min-width: 0;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* 性别：两格分段按钮 */
.nv-login__gender {
  display: grid;
  grid-template-columns: 1fr 1fr;
  height: 32px;
  border: 1px solid var(--nv-stroke-secondary);
  border-radius: var(--nv-radius-base);
  background: var(--login-input);
  overflow: hidden;
}

.nv-login__gender button {
  border: 0;
  background: transparent;
  font: inherit;
  font-size: var(--nv-text-base);
  color: var(--nv-fg);
  cursor: pointer;
}

.nv-login__gender button + button {
  border-left: 1px solid var(--nv-stroke-secondary);
}

.nv-login__gender button[aria-pressed="true"] {
  background: var(--nv-button-bg);
  color: var(--nv-button-fg);
}

/* 上一步 / 完成注册 并排 */
.nv-login__actions {
  display: flex;
  gap: var(--nv-space-2);
  margin-top: var(--nv-space-1);
}

.nv-login__actions .nv-btn {
  flex: 1;
  height: 32px;
  justify-content: center;
  margin-top: 0;
}

.nv-login__actions .nv-login__submit {
  flex: 1.4;
}
.nv-icon {
  font-size: 14px;
  line-height: 1;
  flex-shrink: 0;
}

/* ── 钮（cursor-interactions §3） ───────────────────────────────────── */
.nv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--nv-space-1);
  border: none;
  border-radius: var(--nv-radius-base);
  font-weight: 400;
  white-space: nowrap;
  user-select: none;
  transition:
    background-color var(--nv-duration-fast),
    color var(--nv-duration-fast),
    transform var(--nv-duration-instant);
}

.nv-btn:active:not(:disabled) {
  transform: scale(0.98);
}

.nv-btn:disabled {
  opacity: 0.5;
  cursor: default;
}

.nv-btn--sm {
  height: 20px;
  padding: 0 var(--nv-space-1);
  border-radius: var(--nv-radius-sm);
  font-size: var(--nv-text-sm);
  line-height: var(--nv-leading-sm);
}

.nv-btn--md {
  height: 24px;
  padding: 0 var(--nv-space-1-5);
  font-size: var(--nv-text-base);
  line-height: var(--nv-leading-base);
}

.nv-btn--lg {
  height: 28px;
  padding: 0 var(--nv-space-2);
  font-size: var(--nv-text-base);
}

.nv-btn--primary {
  background: var(--nv-button-bg);
  color: var(--nv-button-fg);
}

.nv-btn--primary:hover:not(:disabled) {
  background: var(--nv-button-bg-hover);
}

.nv-btn--secondary {
  background: var(--nv-button-secondary-bg);
  color: var(--nv-button-secondary-fg);
}

.nv-btn--secondary:hover:not(:disabled) {
  background: var(--nv-button-secondary-bg-hover);
}

.nv-btn--ghost {
  background: transparent;
  color: var(--nv-fg-secondary);
}

.nv-btn--ghost:hover:not(:disabled) {
  background: var(--nv-fill-tertiary);
  color: var(--nv-fg);
}

.nv-btn--danger {
  background: transparent;
  color: var(--nv-danger);
}

.nv-btn--danger:hover:not(:disabled) {
  background: color-mix(in oklch, var(--nv-danger) 12%, transparent);
}

.nv-btn__kbd {
  font-family: var(--nv-font-sans);
  font-size: var(--nv-text-xs);
  opacity: 0.7;
}

/* ── 图标钮 ─────────────────────────────────────────────────────────── */
.nv-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: transparent;
  color: var(--nv-fg-secondary);
  border-radius: var(--nv-radius-base);
  transition:
    background-color var(--nv-duration-fast),
    color var(--nv-duration-fast);
}

.nv-icon-btn:hover:not(:disabled) {
  background: var(--nv-fill-tertiary);
  color: var(--nv-fg);
}

.nv-icon-btn:disabled {
  opacity: 0.4;
  cursor: default;
}

.nv-icon-btn--sm {
  width: 20px;
  height: 20px;
}

.nv-icon-btn--md {
  width: 24px;
  height: 24px;
}

/* ── 其它 ───────────────────────────────────────────────────────────── */
.nv-spinner {
  display: inline-block;
  border: 1.5px solid var(--nv-fill-secondary);
  border-top-color: var(--nv-fg-secondary);
  border-radius: 50%;
  animation: nv-spin 0.8s linear infinite;
  flex-shrink: 0;
}

@keyframes nv-spin {
  to {
    transform: rotate(360deg);
  }
}

/* 标志转圈：运行中唯一的动效 */
.nv-mark-spinner {
  flex-shrink: 0;
  animation: nv-mark-turn 1s linear infinite;
  --nv-mark-top: #cfcfcf;
  --nv-mark-left: #7a7a7a;
  --nv-mark-right: #2e2e2e;
}

:root[data-theme="dark"] .nv-mark-spinner {
  --nv-mark-top: #ececec;
  --nv-mark-left: #9a9a9a;
  --nv-mark-right: #3d3d3d;
}

.nv-mark-spinner__top {
  fill: var(--nv-mark-top);
}

.nv-mark-spinner__left {
  fill: var(--nv-mark-left);
}

.nv-mark-spinner__right {
  fill: var(--nv-mark-right);
}

/* 一圈 1 秒，匀速 */
@keyframes nv-mark-turn {
  to {
    transform: rotate(360deg);
  }
}

/* 少动效：不转，轻轻呼吸 */
@media (prefers-reduced-motion: reduce) {
  .nv-mark-spinner {
    animation: nv-mark-breathe 2.4s ease-in-out infinite;
  }
}

@keyframes nv-mark-breathe {
  50% {
    opacity: 0.45;
  }
}

.nv-kbd {
  font-family: var(--nv-font-sans);
  font-size: var(--nv-text-xs);
  color: var(--nv-fg-tertiary);
}

/* ── 菜单（cursor-interactions §8） ─────────────────────────────────── */
/* 两列对齐：名字一列（宽度跟最长的名字走，有上限），说明一列左对齐、太长才省略。
   原来名字和说明都能被压，说明一长就把名字挤成「/co…」甚至挤没，说明又靠右，参差不齐（斜杠命令菜单） */
.nv-menu {
  display: grid;
  grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
  align-content: start;
  column-gap: var(--nv-space-3);
  position: absolute;
  z-index: var(--nv-z-popover);
  min-width: 180px;
  max-height: 342px;
  overflow-y: auto;
  padding: var(--nv-space-1);
  background: var(--nv-bg-elevated);
  border: 1px solid var(--nv-stroke-secondary);
  border-radius: var(--nv-radius-lg);
  box-shadow: var(--nv-shadow-popup);
  animation: nv-pop-in var(--nv-duration-normal) var(--nv-ease-out-strong);
}

@keyframes nv-pop-in {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
}

.nv-menu--checks {
  grid-template-columns: 14px minmax(0, max-content) minmax(0, 1fr);
}

.nv-menu__header,
.nv-menu__empty {
  grid-column: 1 / -1;
}

.nv-menu__header {
  padding: var(--nv-space-1) var(--nv-space-2);
  font-size: var(--nv-text-xs);
  color: var(--nv-fg-tertiary);
}

.nv-menu__item {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  align-items: center;
  width: 100%;
  min-height: 26px;
  padding: var(--nv-space-1) var(--nv-space-2);
  border: none;
  border-radius: var(--nv-radius-sm);
  background: transparent;
  text-align: left;
  font-size: var(--nv-text-base);
  cursor: pointer;
}

.nv-menu__item[aria-selected="true"] {
  background: var(--nv-list-active);
}

.nv-menu__item-main {
  min-width: 0;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nv-menu__item-hint {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--nv-fg-tertiary);
  font-size: var(--nv-text-sm);
}

.nv-menu__check {
  width: 14px;
  color: var(--nv-fg-secondary);
}

.nv-menu__empty {
  padding: var(--nv-space-2);
  color: var(--nv-fg-tertiary);
}