/* =========================================================================
   序 XU · Views
   XU 编辑器头部 / Timeline / Calendar / List / 详情面板 / 分享面板 / 协作存在感
   ========================================================================= */

/* ---------- XU 编辑器头部（在视图内，顶栏之下） ---------- */
.editor-head {
  display: flex; align-items: flex-start; gap: var(--sp-3);
  padding-bottom: var(--sp-3);
  margin-bottom: var(--sp-3);
  border-bottom: 1px solid var(--line);
}
.editor-head__emoji {
  font-size: 2.4rem; line-height: 1;
  width: 56px; height: 56px; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md);
  cursor: pointer; transition: background-color var(--dur-1) var(--ease);
}
.editor-head__emoji:hover { background: var(--ghost); }
.editor-head__main { min-width: 0; flex: 1; }
.editor-head__title {
  font-family: var(--font-serif); font-size: var(--fs-h2); font-weight: 400;
  line-height: 1.25; letter-spacing: .01em; width: 100%;
  background: transparent; border: 0; padding: .1rem 0; border-radius: var(--r-sm);
  transition: background-color var(--dur-1) var(--ease);
}
.editor-head__title:focus { background: var(--ghost); outline: none; }
.editor-head__desc {
  display: block; width: 100%;
  font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6;
  background: transparent; border: 0; padding: .25rem 0; resize: none;
  border-radius: var(--r-sm); transition: background-color var(--dur-1) var(--ease);
}
.editor-head__desc:focus { background: var(--ghost); outline: none; }
.editor-head__meta { display: flex; align-items: center; gap: .75rem; margin-top: .65rem; flex-wrap: wrap; color: var(--ink-3); font-size: var(--fs-xs); }
.editor-head__meta .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--ink-3); }

/* ---------- Timeline（产品核心视觉） ---------- */
.timeline { position: relative; padding-top: .25rem; }
.tl-item {
  position: relative;
  display: grid;
  grid-template-columns: 5rem 1px 1fr;
  column-gap: 1.1rem;
  align-items: stretch;
  padding: .35rem 0;
  cursor: pointer;
  border-radius: var(--r-sm);
  transition: background-color var(--dur-1) var(--ease);
}
.tl-item:hover { background: var(--ghost); }
.tl-item.is-selected { background: var(--accent-soft); }
.tl-item__time {
  font-family: var(--font-mono); font-size: var(--fs-sm);
  color: var(--ink-3); letter-spacing: .02em;
  font-variant-numeric: tabular-nums;
  padding-top: .55rem; text-align: right;
  align-self: start;
}
.tl-item__time--none { color: transparent; }
.tl-item__rail {
  position: relative; background: var(--line-2);
}
.tl-item__rail::after {
  content: ""; position: absolute; top: .9rem; left: 50%; transform: translateX(-50%);
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--paper); border: 1.5px solid var(--line-2);
}
.tl-item--first .tl-item__rail::after { background: var(--accent); border-color: var(--accent); }
.tl-item--checklist .tl-item__rail::after { border-radius: 2px; }
.tl-item--done .tl-item__rail::after { background: var(--st-done); border-color: var(--st-done); }
.tl-item--record .tl-item__rail::after { background: var(--accent); border-color: var(--accent); width: 8px; height: 8px; }

/* 未来安排：分割线分组 + 换色区分（v2.1.3） */
.tl-divide {
  display: flex; align-items: center; gap: .5rem;
  padding: .8rem 0 .3rem;
}
.tl-divide__txt {
  display: inline-flex; align-items: center; gap: .3rem;
  font-size: var(--fs-xs); color: var(--accent);
  font-weight: 500; white-space: nowrap;
}
.tl-divide__txt svg { width: 13px; height: 13px; }
.tl-divide__line { flex: 1; height: 1px; background: linear-gradient(to right, var(--accent-line), transparent); }
.tl-item--future .tl-item__time { color: var(--accent); opacity: .85; }
.tl-item--future .tl-item__rail { background: color-mix(in srgb, var(--accent) 22%, var(--line-2)); }
.tl-item--future .tl-item__rail::after { border-color: var(--accent-line); }
/* 从日历「查看这一天的时间线」跳转后的短暂高亮 */
.tl-item--locate { background: var(--accent-soft); border-radius: var(--r-sm); transition: background-color .6s var(--ease); }

.tl-legend { display: flex; gap: 1.2rem; padding: 0 0 .75rem; font-size: var(--fs-sm); color: var(--ink-3); }
.tl-legend__item { display: flex; align-items: center; gap: .35rem; }
.tl-legend__dot { width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid var(--line-2); background: var(--paper); }
.tl-legend__dot--filled { background: var(--accent); border-color: var(--accent); }

/* 今日 · 记录时间线：可点击进入编辑 */
.timeline--today .tl-item--record.rec-editable { cursor: pointer; border-radius: var(--r-sm); transition: background-color var(--dur-1) var(--ease); }
.timeline--today .tl-item--record.rec-editable:hover { background: var(--ghost); }
.timeline--today .tl-item--record.rec-editable:hover .tl-item__title { color: var(--accent); }
.timeline--today .tl-item--record.is-editing { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.rec-del { flex: none; width: 28px; height: 28px; opacity: 0; color: var(--ink-3); transition: opacity var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.tl-item--record:hover .rec-del, .tl-item--record.is-editing .rec-del { opacity: .7; }
.rec-del:hover { opacity: 1; color: var(--danger); }

.tl-item__body {
  display: flex; align-items: flex-start; gap: .75rem;
  padding: .45rem .75rem .45rem .25rem;
  min-width: 0;
}
.tl-item__check {
  flex: none; width: 18px; height: 18px; margin-top: .15rem;
  border-radius: var(--r-xs); border: 1.5px solid var(--line-2);
  display: grid; place-items: center; color: transparent;
  transition: background-color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.tl-item--done .tl-item__check { background: var(--st-done); border-color: var(--st-done); color: var(--paper); }
.tl-item__check svg { width: 12px; height: 12px; }
.tl-item__content { min-width: 0; flex: 1; }
.tl-item__title { font-size: var(--fs-body); color: var(--ink); line-height: 1.5; transition: color var(--dur-1) var(--ease); }
.tl-item--done .tl-item__title { color: var(--ink-3); text-decoration: line-through; text-decoration-color: var(--line-2); }
.tl-item__tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .35rem; min-width: 0; overflow: hidden; }

/* 时间线底部「加一条」 */
.tl-add {
  display: grid; grid-template-columns: 5rem 1px 1fr; column-gap: 1.1rem;
  margin-top: .35rem;
}
.tl-add__btn {
  grid-column: 3; display: flex; align-items: center; gap: .5rem;
  padding: .6rem .75rem; border-radius: var(--r-sm);
  color: var(--ink-3); font-size: var(--fs-sm);
  border: 1px dashed var(--line-2);
  transition: color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.tl-add__btn:hover { color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }

/* ---------- Calendar ---------- */
.cal { display: grid; grid-template-columns: 1fr; gap: var(--sp-3); }
.cal__head { display: flex; align-items: center; gap: var(--sp-2); }
.cal__ym { flex: 1; text-align: center; font-family: var(--font-serif); font-size: var(--fs-h3); color: var(--ink); }
.cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.cal__dow { text-align: center; font-size: var(--fs-micro); letter-spacing: .08em; color: var(--ink-3); padding: .35rem 0; text-transform: uppercase; }
.cal__cell {
  position: relative; aspect-ratio: 1 / 1;
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  padding: .4rem; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--paper-2);
  font-size: var(--fs-sm); color: var(--ink-2);
  transition: border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.cal__cell:hover { border-color: var(--accent-line); }
.cal__cell--muted { color: var(--ink-3); opacity: .55; }
.cal__cell--inrange { background: color-mix(in srgb, var(--accent) 7%, var(--paper-2)); }
.cal__cell--today { border-color: var(--accent); color: var(--ink); }
.cal__cell--has { cursor: pointer; }
.cal__cell--pick { cursor: pointer; }
.cal__cell--sel { background: var(--accent-soft); border-color: var(--accent-line); }
.cal__pips { display: flex; gap: 3px; flex-wrap: wrap; }
/* 圆点与时间线图例一致：空心 = 安排，实心 = 记录 */
.cal__pip { width: 6px; height: 6px; border-radius: 50%; }
.cal__pip--ev { background: transparent; border: 1.5px solid var(--accent); }
.cal__pip--rec { background: var(--accent); }
.cal__day-foot { margin-top: var(--sp-3); }
.cal__day-foot__head { display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; margin-bottom: .75rem; }
.cal__day-foot__head h3 { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-h3); margin: 0; }
.cal__day-foot__count { font-size: var(--fs-xs); color: var(--ink-3); }
.cal__day-foot h3 { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-h3); margin-bottom: .75rem; }

/* ---------- List ---------- */
.list { display: flex; flex-direction: column; }
.list__group { padding: .5rem 0; }
.list__group + .list__group { border-top: 1px solid var(--line); }
.list__group-h {
  display: flex; align-items: center; gap: .6rem;
  font-size: var(--fs-micro); letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-3); padding: .5rem .25rem;
}
.list__row {
  display: flex; align-items: center; gap: .8rem;
  padding: .65rem .25rem; cursor: pointer; border-radius: var(--r-sm);
  transition: background-color var(--dur-1) var(--ease);
}
.list__row:hover { background: var(--ghost); }
.list__row.is-selected { background: var(--accent-soft); }
.list__time { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--ink-3); width: 4.5rem; flex: none; font-variant-numeric: tabular-nums; }
.list__title { flex: 1; min-width: 0; font-size: var(--fs-body); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.list__row--done .list__title { color: var(--ink-3); text-decoration: line-through; text-decoration-color: var(--line-2); }
.list__xu { font-size: var(--fs-micro); color: var(--ink-3); flex: none; }

/* ---------- 详情面板（桌面：右侧抽屉） ---------- */
.panel {
  position: fixed; top: 0; right: 0; z-index: 95;
  width: min(420px, 94vw); height: 100vh;
  background: var(--paper-3);
  border-left: 1px solid var(--line);
  box-shadow: var(--shadow-2);
  transform: translateX(100%);
  transition: transform var(--dur-3) var(--ease);
  display: flex; flex-direction: column;
  visibility: hidden;
}
.panel.is-open { transform: translateX(0); visibility: visible; }
.panel__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--sp-2) var(--sp-3); border-bottom: 1px solid var(--line);
}
.panel__head .eyebrow { color: var(--ink-3); }
.panel__close { width: 34px; height: 34px; border-radius: var(--r-sm); color: var(--ink-2); display: grid; place-items: center; transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.panel__close:hover { color: var(--ink); background: var(--ghost); }
.panel__body { flex: 1; overflow: auto; padding: var(--sp-3); display: flex; flex-direction: column; gap: var(--sp-3); }

/* 内联编辑字段（去表单感） */
.field { display: flex; flex-direction: column; gap: .4rem; }
.field__label { font-size: var(--fs-micro); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.field__input, .field__area {
  width: 100%; background: var(--paper-2); border: 1px solid var(--line-2);
  border-radius: var(--r-sm); padding: .55rem .6rem;
  font-size: var(--fs-body); color: var(--ink); line-height: 1.6;
  transition: border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease);
}
.field__input:hover, .field__area:hover { border-color: var(--line); background: var(--paper); }
.field__input:focus, .field__area:focus { background: var(--paper); border-color: var(--accent-line); outline: none; }
.field__input::placeholder, .field__area::placeholder { color: var(--ink-3); }
.field__area { resize: vertical; min-height: 72px; line-height: 1.7; }
.field__select {
  width: 100%; background: var(--paper-2); border: 1px solid var(--line-2);
  border-radius: var(--r-sm); padding: .55rem .6rem;
  font-size: var(--fs-body); color: var(--ink); line-height: 1.6;
  transition: border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease);
  appearance: auto;
}
.field__select:hover { border-color: var(--line); background: var(--paper); }
.field__select:focus { background: var(--paper); border-color: var(--accent-line); outline: none; }
.field__hint { font-size: var(--fs-micro); color: var(--ink-3); line-height: 1.6; }
.field__hint.is-ok { color: var(--st-done); }
.field__hint.is-bad { color: var(--danger); }

.field-row { display: flex; gap: var(--sp-2); }
.field-row .field { flex: 1; }

/* 类型选择胶囊 */
.typechips { display: flex; flex-wrap: wrap; gap: .5rem; }
.typechip {
  display: inline-flex; align-items: center; gap: .4rem;
  height: 34px; padding: 0 .85rem; border-radius: var(--r-pill);
  border: 1px solid var(--line); font-size: var(--fs-xs); color: var(--ink-2);
  transition: color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.typechip .icon { width: 15px; height: 15px; }
.typechip.is-active { color: var(--ink); border-color: var(--accent-line); background: var(--accent-soft); }

/* 指派成员 */
.assignees { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.assignee-add {
  width: 30px; height: 30px; border-radius: 50%; border: 1px dashed var(--line-2);
  color: var(--ink-3); display: grid; place-items: center; font-size: 1rem;
  transition: color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease);
}
.assignee-add:hover { color: var(--accent); border-color: var(--accent-line); }

.panel__foot { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: var(--sp-2) var(--sp-3); border-top: 1px solid var(--line); }
.panel__foot .btn--quiet { color: var(--ink-3); border-color: var(--line); }
.panel__foot .btn--quiet:hover { color: var(--accent); border-color: var(--accent-line); }

/* ---------- 分享面板（弹层） ---------- */
.modal {
  position: fixed; inset: 0; z-index: 100;
  display: grid; place-items: center; padding: var(--sp-3);
  background: color-mix(in srgb, var(--ink) 38%, transparent);
  opacity: 0; visibility: hidden;
  transition: opacity var(--dur-2) var(--ease), visibility var(--dur-2) var(--ease);
}
.modal.is-open { opacity: 1; visibility: visible; }
.modal__card {
  width: min(480px, 100%);
  background: var(--paper-3); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--shadow-2);
  padding: var(--sp-3);
  transform: translateY(14px) scale(.99);
  transition: transform var(--dur-3) var(--ease);
  /* 限制弹窗高度：超过可视区时由弹窗内部滚动，头部与底部按钮通过 sticky 常驻 */
  max-height: calc(100vh - 2 * var(--sp-3));
  max-height: calc(100dvh - 2 * var(--sp-3));
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.modal.is-open .modal__card { transform: translateY(0) scale(1); }
.modal__head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 0 0 var(--sp-2);
  position: sticky; top: calc(-1 * var(--sp-3));
  margin-top: calc(-1 * var(--sp-3));
  padding: var(--sp-3) var(--sp-3) var(--sp-2);
  background: var(--paper-3); z-index: 2;
  border-radius: var(--r-lg) var(--r-lg) 0 0;
}
.modal__head h3 { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-h3); }
.modal__close { width: 34px; height: 34px; border-radius: var(--r-sm); color: var(--ink-2); display: grid; place-items: center; }
.modal__close:hover { color: var(--ink); background: var(--ghost); }

/* 确认弹窗（自定义，替代系统 confirm） */
.modal__card--confirm { width: min(400px, 100%); }
.modal__msg { font-size: var(--fs-sm); line-height: 1.7; color: var(--ink-2); margin: .3rem 0 var(--sp-3); }
.modal__actions {
  display: flex; justify-content: flex-end; gap: .6rem;
  margin-top: var(--sp-1);
  position: sticky; bottom: calc(-1 * var(--sp-3));
  margin-bottom: calc(-1 * var(--sp-3));
  padding: var(--sp-2) var(--sp-3) var(--sp-3);
  background: var(--paper-3); z-index: 2;
  border-radius: 0 0 var(--r-lg) var(--r-lg);
  border-top: 1px solid var(--line);
}

.perm { display: flex; flex-direction: column; gap: .5rem; margin: var(--sp-2) 0; }
.perm__opt {
  display: flex; align-items: flex-start; gap: .75rem;
  width: 100%; text-align: left; padding: .8rem .9rem;
  border: 1px solid var(--line); border-radius: var(--r-md);
  transition: border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.perm__opt:hover { border-color: var(--line-2); }
.perm__opt.is-active { border-color: var(--accent-line); background: var(--accent-soft); }
.perm__opt .icon { width: 18px; height: 18px; color: var(--accent); margin-top: .1rem; }
.perm__opt b { font-weight: 600; color: var(--ink); font-size: var(--fs-sm); }
.perm__opt p { color: var(--ink-2); font-size: var(--fs-xs); line-height: 1.6; margin-top: .15rem; }

.share-link {
  display: flex; align-items: center; gap: .5rem;
  margin-top: var(--sp-2); padding: .5rem .6rem;
  background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-sm);
}
.share-link input { flex: 1; min-width: 0; background: transparent; border: 0; font-size: var(--fs-xs); color: var(--ink-2); font-family: var(--font-mono); }
.share-members { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-top: var(--sp-2); }
.share-members .lbl { font-size: var(--fs-micro); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }

/* 个人权限下的「锁定的协作功能」提示卡 */
.perm-locked {
  display: flex; gap: .75rem; align-items: flex-start;
  margin-top: var(--sp-2); padding: .9rem 1rem;
  background: var(--paper-2); border: 1px dashed var(--line-2); border-radius: var(--r-md);
}
.perm-locked .icon { width: 20px; height: 20px; color: var(--ink-3); margin-top: .1rem; flex: none; }
.perm-locked__body { flex: 1; min-width: 0; }
.perm-locked__body b { display: block; font-size: var(--fs-sm); color: var(--ink); }
.perm-locked__body .muted { margin: .25rem 0 .65rem; line-height: 1.6; }
.perm-locked--ro { background: transparent; border-style: solid; }

/* 仅受邀模式下的协作管理入口 */
.perm-manage {
  margin-top: var(--sp-2); padding: var(--sp-2);
  background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md);
}
.perm-manage__head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.perm-manage__head .lbl { font-size: var(--fs-micro); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.perm-manage__count { margin-left: auto; font-size: var(--fs-micro); color: var(--ink-3); }

/* 访客管理（link / public 模式） */
.visitor-list { max-height: 56vh; overflow: auto; padding: .25rem 0; }
.visitor-row { display: flex; align-items: center; gap: .7rem; padding: .55rem .35rem; border-radius: var(--r-sm); }
.visitor-row + .visitor-row { border-top: 1px solid var(--line); }
.visitor-row.is-blocked { opacity: .68; }
.visitor-row__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .05rem; }
.visitor-row__main b { font-size: var(--fs-sm); color: var(--ink); font-weight: 600; }
.visitor-row__main .muted { font-size: var(--fs-micro); }
.visitor-row__tag { font-size: var(--fs-micro); color: #B4493B; background: rgba(180,73,59,.12); padding: .15rem .45rem; border-radius: 999px; margin-right: .25rem; white-space: nowrap; }
.visitor-empty { padding: 1.2rem .4rem; text-align: center; font-size: var(--fs-sm); }

/* 文档日志 */
.doclog { max-height: 60vh; overflow: auto; padding: .25rem 0; }
.doclog-row { display: flex; align-items: flex-start; gap: .7rem; padding: .6rem .35rem; border-radius: var(--r-sm); }
.doclog-row + .doclog-row { border-top: 1px solid var(--line); }
.doclog-row__ic { width: 28px; height: 28px; flex: none; border-radius: 999px; background: var(--ghost); color: var(--ink-2); display: grid; place-items: center; }
.doclog-row__ic .icon { width: 16px; height: 16px; }
.doclog-row__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.doclog-row__title { font-size: var(--fs-sm); color: var(--ink); line-height: 1.5; }
.doclog-row__title b { color: var(--ink); }
.doclog-row__main .muted { font-size: var(--fs-micro); }
/* v1.9.21：按自然日分组 + 编辑前后差异 */
.doclog-day {
  padding: .9rem .35rem .35rem; font-size: var(--fs-micro);
  letter-spacing: .12em; color: var(--ink-3);
}
.doclog-row__time { display: block; margin-top: .15rem; }
.doclog-diff { display: flex; flex-direction: column; gap: .3rem; margin-top: .4rem; }
.doclog-diff__row { display: flex; align-items: baseline; gap: .6rem; font-size: var(--fs-xs); }
.doclog-diff__f { flex: none; min-width: 4.4em; color: var(--ink-3); }
.doclog-diff__pair { display: inline-flex; align-items: center; gap: .45rem; flex-wrap: wrap; min-width: 0; }
.doclog-diff__arrow { color: var(--ink-3); opacity: .55; }
.doclog-val {
  background: var(--ghost); border: 1px solid var(--line); border-radius: var(--r-xs);
  padding: .08rem .45rem; color: var(--ink); overflow-wrap: anywhere; line-height: 1.5;
}
.doclog-val.is-empty { background: transparent; border-style: dashed; color: var(--ink-3); font-style: italic; }
.doclog-diff__block { display: flex; flex-direction: column; gap: .25rem; font-size: var(--fs-xs); margin-top: .15rem; }
.doclog-diff__text {
  border-radius: var(--r-xs); padding: .4rem .55rem; line-height: 1.7;
  white-space: pre-wrap; overflow-wrap: anywhere;
}
.doclog-diff__text.is-old {
  background: color-mix(in srgb, var(--danger) 6%, transparent);
  border: 1px dashed color-mix(in srgb, var(--danger) 32%, var(--line));
  color: var(--ink-2);
}
.doclog-diff__text.is-new {
  background: color-mix(in srgb, var(--st-done) 9%, transparent);
  border: 1px solid color-mix(in srgb, var(--st-done) 34%, var(--line));
}
/* 条目行 / 面板：协作编辑者头像（v2.1.3） */
.it-editors { display: inline-flex; align-items: center; gap: .25rem; flex: none; min-width: 0; max-width: 100%; }
.it-ed {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  flex: none;
}
.it-ed .avatar { box-shadow: 0 0 0 2px var(--paper); }
.it-ed__ring {
  position: absolute; inset: 0;
  border-radius: 50%;
  border: 2px solid var(--accent);
  opacity: 0;
  pointer-events: none;
}
/* 正在编辑：直播扩散动画 */
.it-ed--live .it-ed__ring { animation: presence-live-ring 2s ease-out infinite; }
.it-ed--live .avatar {
  box-shadow: 0 0 0 2px var(--accent), 0 0 8px var(--accent-glow, rgba(255,77,79,.4));
}
@keyframes presence-live-ring {
  0%   { transform: scale(1); opacity: .8; border-width: 2px; }
  100% { transform: scale(1.8); opacity: 0; border-width: 1px; }
}
.tl-item__tags { align-items: center; }
.tl-item__tags .it-editors { margin-left: .1rem; }
.list__editors { flex: none; display: inline-flex; align-items: center; min-width: 0; }
.panel__editors-row { display: flex; align-items: center; min-height: 26px; flex-wrap: wrap; gap: .3rem; }

/* 实时协作「正在编辑」气泡（纯文字版，插在正在编辑者的头像后） */
.presence-bubble {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .15rem .6rem;
  border-radius: 999px;
  background: var(--accent-soft);
  border: 1px solid var(--accent-line);
  color: var(--accent);
  font-size: var(--fs-micro);
  line-height: 1.4;
  white-space: nowrap;
  animation: presence-in .25s var(--ease) both;
}
@keyframes presence-in {
  from { opacity: 0; transform: translateY(-2px) scale(.92); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.presence-bubble__text { font-weight: 500; }

/* 协作成员管理弹窗 */
.collab__row {
  display: flex; align-items: center; gap: .7rem;
  padding: .6rem .4rem; border-radius: var(--r-sm);
}
.collab__row + .collab__row { border-top: 1px solid var(--line); }
.collab__meta { flex: 1; min-width: 0; }
.collab__name { display: block; font-size: var(--fs-sm); color: var(--ink); font-weight: 600; }
.collab__hint { display: block; font-size: var(--fs-micro); color: var(--ink-3); margin-top: .1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.collab__role {
  appearance: none; -webkit-appearance: none;
  font-size: var(--fs-xs); color: var(--ink-2);
  padding: .3rem .5rem; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--paper);
}
.collab__role--owner { color: var(--accent); font-weight: 600; font-size: var(--fs-xs); }
.collab__remove { width: 28px; height: 28px; color: var(--ink-3); }
.collab__remove:hover { color: var(--danger, #B4493B); background: var(--ghost); }
.collab__invite { margin-top: var(--sp-2); }
.collab__invite .assign-modal__search { position: static; z-index: auto; margin: 0 0 .5rem; border-bottom: 1px solid var(--line); border-radius: var(--r-md); }
.assign-list__add { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; color: var(--accent); }
.assign-list__add .icon { width: 16px; height: 16px; }

/* 协作者状态徽章（pending / declined） */
.collab__badge {
  display: inline-flex; align-items: center; flex: none;
  font-size: var(--fs-micro); line-height: 1; letter-spacing: .04em;
  padding: .25rem .55rem; border-radius: var(--r-pill);
  border: 1px solid var(--line); background: var(--paper-2); color: var(--ink-3);
  white-space: nowrap;
}
.collab__badge--pending { color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }
.collab__badge--declined { color: var(--danger, #B4493B); border-color: var(--danger, #B4493B); background: transparent; }
/* 无管理权限时角色选择器只读 */
.collab__role--readonly { opacity: .6; pointer-events: none; }
/* 等待接受的协作者行做轻量高亮 */
.collab__row--pending { background: var(--accent-soft); border-radius: var(--r-sm); }

/* 编辑器中「等待接受邀请」横幅 */
.invite-banner {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .7rem .9rem; margin-bottom: var(--sp-3);
  border: 1px solid var(--accent-line); border-radius: var(--r-md);
  background: var(--accent-soft);
  animation: fade var(--dur-2) var(--ease);
}
.invite-banner__meta { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.invite-banner__meta .avatar { width: 30px; height: 30px; font-size: var(--fs-micro); flex: none; }
.invite-banner__meta span { font-size: var(--fs-sm); color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.invite-banner__meta b { color: var(--ink); font-weight: 600; }
.invite-banner__actions { display: flex; align-items: center; gap: .5rem; flex: none; }

/* ---------- 协作存在感 ---------- */
.presence {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .3rem .7rem; border-radius: var(--r-pill);
  background: var(--accent-soft); color: var(--accent);
  font-size: var(--fs-xs);
  animation: fade var(--dur-2) var(--ease);
}
@keyframes fade { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.presence .avatar { width: 20px; height: 20px; font-size: var(--fs-micro); }

/* 实时提示条（顶部轻提示） */
.toast {
  position: fixed; left: 50%; bottom: calc(var(--bottomnav-h) + 16px);
  transform: translate(-50%, 16px);
  z-index: 120;
  display: flex; align-items: center; gap: .6rem;
  padding: .6rem 1rem; border-radius: var(--r-pill);
  background: var(--ink); color: var(--paper);
  font-size: var(--fs-xs); box-shadow: var(--shadow-2);
  opacity: 0; visibility: hidden;
  transition: opacity var(--dur-2) var(--ease), transform var(--dur-2) var(--ease), visibility var(--dur-2) var(--ease);
}
.toast.is-show { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.toast__avatar {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  font-size: 9px; font-weight: 600; flex: none;
}

/* ---------- 公开分享页（只读） ---------- */
.sharepage { max-width: 720px; margin: 0 auto; }
.sharepage__head { text-align: center; padding: var(--sp-5) 0 var(--sp-3); border-bottom: 1px solid var(--line); }
.sharepage__emoji { font-size: 3rem; }
.sharepage__title { font-family: var(--font-serif); font-size: var(--fs-display); font-weight: 400; margin: .5rem 0; }
.sharepage__meta { display: flex; align-items: center; justify-content: center; gap: .6rem; color: var(--ink-3); font-size: var(--fs-xs); flex-wrap: wrap; }
.sharepage__note { text-align: center; color: var(--ink-3); font-size: var(--fs-xs); margin-top: var(--sp-3); }
.sharepage__owner { color: var(--accent); font-weight: 600; text-decoration: none; }
.sharepage__owner:hover { text-decoration: underline; }

/* ---------- Emoji 选择器弹窗 ---------- */
.emoji-picker { padding: var(--sp-3); }
.emoji-presets {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 6px;
}
.emoji-btn {
  width: 100%; aspect-ratio: 1;
  font-size: 1.8rem; line-height: 1;
  background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-sm);
  cursor: pointer; transition: all var(--dur-1) var(--ease);
}
.emoji-btn:hover { background: var(--ghost); transform: scale(1.1); }
.emoji-btn.is-active { border-color: var(--accent); background: var(--accent-bg); }
.emoji-btn--plus {
  font-size: 1.4rem; color: var(--ink-3);
}
.emoji-custom-input {
  display: flex; align-items: center; gap: var(--sp-2);
  padding-top: var(--sp-2);
}
.emoji-input {
  flex: 1; min-width: 0;
  padding: .4rem .6rem;
  font-size: var(--fs-sm);
  background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-sm);
}
.emoji-input:focus { outline: none; border-color: var(--accent); }

/* ---------- 个人主页（#/user/） ---------- */
.up { max-width: 720px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--sp-3); }
.up__card { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); }
.up__head { display: flex; align-items: flex-start; gap: var(--sp-3); flex-wrap: wrap; }
.avatar--xl { width: 72px; height: 72px; font-size: 1.5rem; }
.up__meta { flex: 1; min-width: 220px; }
.up__name { font-family: var(--font-serif); font-size: var(--fs-h2); font-weight: 400; margin: 0; }
.up__id { color: var(--ink-3); font-size: var(--fs-sm); font-family: var(--font-mono); margin-top: .2rem; }
.up__id .dot { margin: 0 .4rem; }
.up__badges { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .7rem; }
.up-badge { display: inline-flex; align-items: center; gap: .35rem; padding: .28rem .65rem; border: 1px solid var(--accent-line); background: var(--accent-soft); color: var(--accent); border-radius: var(--r-pill); font-size: var(--fs-micro); }
.up-badge .icon { width: 13px; height: 13px; }
.up-badge em { font-style: normal; color: var(--ink); }
/* v1.9.22：个人主页认证徽章（类型名 + 关键内容：学校/机构、身份角色、软件名） */
.up-badge--full {
  display: inline-flex; align-items: center; gap: .55rem; flex: none;
  padding: .5rem .75rem; border-radius: var(--r-md);
  background: var(--paper-2); border: 1px solid var(--line);
  text-align: left;
}
.up-badge--full .up-badge__ic {
  flex: none; width: 32px; height: 32px; border-radius: var(--r-pill);
  display: inline-grid; place-items: center;
  background: var(--accent-soft); color: var(--accent);
}
.up-badge--full .up-badge__ic .icon { width: 17px; height: 17px; }
.up-badge--full .up-badge__bd { display: inline-flex; flex-direction: column; gap: .08rem; min-width: 0; }
.up-badge--full .up-badge__t { font-size: var(--fs-xs); font-weight: 600; color: var(--ink); letter-spacing: .02em; }
.up-badge--full .up-badge__m { font-size: var(--fs-micro); color: var(--ink-2); max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 教育认证徽章可点击跳转高校主页 */
a.up-badge { text-decoration: none; cursor: pointer; transition: border-color var(--dur-1) var(--ease), transform var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease); }
a.up-badge:hover { border-color: var(--accent); transform: translateY(-1px); box-shadow: var(--shadow); }
.up__action { flex: none; align-self: center; }
.up-rel { display: inline-flex; align-items: center; gap: .35rem; color: var(--ink-3); font-size: var(--fs-sm); }
.up-rel .icon { width: 15px; height: 15px; }
.up-rel--ok { color: var(--st-done); }
.up__section-title { font-size: var(--fs-micro); color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; margin: 0 0 var(--sp-2); }
.up__xus { display: flex; flex-direction: column; gap: .45rem; }
.up-xu { display: flex; align-items: center; gap: .8rem; padding: .65rem .8rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper); text-decoration: none; transition: border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease); }
.up-xu:hover { border-color: var(--accent-line); background: var(--accent-soft); }
.up-xu__emoji { font-size: 1.3rem; flex: none; }
.up-xu__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.up-xu__title { color: var(--ink); font-size: var(--fs-body); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.up-xu__meta { color: var(--ink-3); font-size: var(--fs-micro); }
.up-xu > .badge { flex: none; }
.up__bio { margin: .55rem 0 0; padding: 0; color: var(--ink); font-size: var(--fs-sm); line-height: 1.7; max-width: 60ch; white-space: pre-wrap; }
.profile-bio-text { color: var(--ink-2); font-size: var(--fs-sm); line-height: 1.7; white-space: pre-wrap; }
.sharepage__brand { text-align: center; margin: var(--sp-4) 0; }

/* ---------- 通知 / 消息 ---------- */
.notif-bell { position: relative; }
.notif-bell .icon { width: 18px; height: 18px; }
.notif-badge { position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--danger); color: #fff; font-size: 10px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.notif-badge.is-overflow { padding: 0 5px; font-size: 9px; }
.notif { max-width: 720px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--sp-2); }
.notif__list { display: flex; flex-direction: column; gap: .45rem; }
.notif__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); flex-wrap: wrap; }
.notif__head .viewswitch { flex: none; }
.notif__head #notifReadAll { flex: none; }
.notif__loading, .notif__empty { padding: var(--sp-4) 0; text-align: center; color: var(--ink-3); font-size: var(--fs-sm); }
.notif__empty { display: flex; flex-direction: column; align-items: center; gap: .5rem; color: var(--ink-3); }
.notif__empty .icon { width: 28px; height: 28px; opacity: .6; }
/* 分类 chips：大 tab（通知/消息）下的二级分类 */
.notif__cats { display: flex; flex-wrap: wrap; gap: .4rem; }
.notif__cat {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .28rem .7rem; border-radius: 999px;
  border: 1px solid var(--line); background: var(--paper-2);
  color: var(--ink-2); font-size: var(--fs-xs); cursor: pointer;
  transition: color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.notif__cat .icon { width: 13px; height: 13px; }
.notif__cat i { font-style: normal; font-size: var(--fs-micro); color: var(--ink-3); font-variant-numeric: tabular-nums; }
.notif__cat:hover { color: var(--ink); border-color: var(--accent-line); }
.notif__cat.is-active { color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }
.notif__cat.is-active i { color: var(--accent); }
.notif__item { display: flex; align-items: flex-start; gap: .8rem; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper-2); text-decoration: none; color: var(--ink); transition: background var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease); position: relative; }
.notif__item:hover { border-color: var(--accent-line); background: var(--paper); }
.notif__item.is-unread { border-color: var(--accent-line); background: var(--accent-soft); }
.notif__item.is-read { color: var(--ink-3); }
.notif__item.is-read .notif__title { color: var(--ink-2); }
.notif__ic { flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--paper-3); display: grid; place-items: center; color: var(--accent); }
.notif__ic .icon { width: 16px; height: 16px; }
.notif__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.notif__title { font-size: var(--fs-body); color: var(--ink); line-height: 1.5; }
.notif__actor { font-style: normal; color: var(--ink-3); font-size: var(--fs-micro); margin-left: .25rem; }
.notif__body { margin: 0; color: var(--ink-2); font-size: var(--fs-sm); line-height: 1.6; white-space: pre-wrap; }
.notif__meta { font-size: var(--fs-micro); color: var(--ink-3); }
.notif__dot { position: absolute; top: 12px; right: 12px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }

/* 通知气泡（右上角） */
.notif-bubble { position: fixed; top: 16px; right: 16px; z-index: 250; display: flex; align-items: flex-start; gap: .65rem; max-width: 360px; padding: .8rem .9rem; background: var(--paper-2); border: 1px solid var(--accent-line); border-radius: var(--r-md); box-shadow: var(--shadow-2); opacity: 0; transform: translateY(-12px); transition: opacity var(--dur-2) var(--ease), transform var(--dur-2) var(--ease); cursor: pointer; }
.notif-bubble.is-in { opacity: 1; transform: translateY(0); }
.notif-bubble.is-message { border-color: var(--accent-2, var(--line)); }
.notif-bubble__ic { flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; }
.notif-bubble__ic .icon { width: 16px; height: 16px; }
.notif-bubble__body { flex: 1; min-width: 0; }
.notif-bubble__title { font-size: var(--fs-sm); color: var(--ink); font-weight: 500; line-height: 1.5; }
.notif-bubble__text { margin: .15rem 0 0; font-size: var(--fs-xs); color: var(--ink-3); line-height: 1.5; }
.notif-bubble__close { flex: none; width: 24px; height: 24px; border-radius: 50%; color: var(--ink-3); display: grid; place-items: center; cursor: pointer; }
.notif-bubble__close:hover { background: var(--ghost); color: var(--ink); }
.notif-bubble__close .icon { width: 12px; height: 12px; }

/* ---------- 帮助页 ---------- */
.help { max-width: 640px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--sp-3); }
.help__group { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); }
.help__group h3 { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-h3); margin-bottom: .6rem; }
.help__q { padding: .5rem 0; border-top: 1px solid var(--line); }
.help__q:first-of-type { border-top: 0; }
.help__q b { color: var(--ink); font-size: var(--fs-sm); }
.help__q p { color: var(--ink-2); font-size: var(--fs-sm); line-height: 1.7; margin-top: .2rem; }

/* 小工具 */
.muted { color: var(--ink-3); }
.row-gap { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.spread { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }

/* ---------- 鉴权弹窗（登录 / 注册） ---------- */
.auth-card { width: min(420px, 100%); }
.auth-lead { font-size: var(--fs-sm); line-height: 1.7; margin-bottom: var(--sp-2); }
.auth-form { display: flex; flex-direction: column; gap: var(--sp-2); margin-top: var(--sp-2); }
.auth-form .btn { margin-top: .35rem; }
[hidden] { display: none !important; }
.auth-err {
  margin: 0; padding: .55rem .7rem;
  background: color-mix(in srgb, var(--st-done) 14%, transparent);
  color: var(--st-done);
  border: 1px solid color-mix(in srgb, var(--st-done) 28%, transparent);
  border-radius: var(--r-sm);
  font-size: var(--fs-xs); line-height: 1.6;
}
.auth-foot {
  margin-top: var(--sp-3); padding-top: var(--sp-2);
  border-top: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center; gap: .35rem;
  font-size: var(--fs-sm); color: var(--ink-2);
}
.auth-agree { margin: .6rem 0 0; font-size: var(--fs-xs); color: var(--ink-3); text-align: center; line-height: 1.6; }
.auth-agree a { color: var(--accent); text-decoration: none; }
.auth-agree a:hover { text-decoration: underline; }
.auth-toggle {
  color: var(--accent); font-weight: 500;
  transition: color var(--dur-1) var(--ease);
}
.auth-toggle:hover { color: var(--accent-2); }

/* ---------- 侧栏用户区 ---------- */
.sidebar__cta {
  width: 100%; display: flex; flex-direction: column; align-items: flex-start;
  gap: .15rem; padding: .65rem .7rem;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--paper-2); color: var(--ink);
  text-align: left; cursor: pointer;
  transition: border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.sidebar__cta:hover { border-color: var(--accent-line); background: var(--accent-soft); }
.sidebar__cta .icon { width: 16px; height: 16px; margin-bottom: .15rem; color: var(--ink-2); }
.sidebar__cta span { font-size: var(--fs-sm); color: var(--ink); }
.sidebar__cta small { font-size: var(--fs-micro); color: var(--ink-3); }

.sidebar__logout { margin-left: auto; }
.sidebar__logout .icon { width: 16px; height: 16px; }

/* ---------- 自定义下拉选择框（状态 / 时间 / 搜索） ---------- */
.xu-dropdown {
  position: fixed; z-index: 130;
  min-width: 180px; max-width: 320px;
  background: var(--paper-3); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--shadow-2);
  padding: .35rem;
  animation: rise var(--dur-2) var(--ease) both;
}
.xu-dropdown__search {
  display: flex; align-items: center; gap: .4rem;
  padding: .4rem .5rem; margin-bottom: .25rem;
  background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-sm);
}
.xu-dropdown__search input {
  flex: 1; min-width: 0; background: transparent; border: 0; font-size: var(--fs-sm); color: var(--ink);
}
.xu-dropdown__search input:focus { outline: none; }
.xu-dropdown__list {
  display: flex; flex-direction: column; gap: .1rem;
  max-height: 260px; overflow: auto;
}
.xu-dropdown__item {
  display: flex; align-items: center; gap: .55rem;
  width: 100%; text-align: left;
  padding: .55rem .6rem; border-radius: var(--r-sm);
  font-size: var(--fs-sm); color: var(--ink-2);
  transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.xu-dropdown__item:hover { background: var(--ghost); color: var(--ink); }
.xu-dropdown__item.is-active { background: var(--accent-soft); color: var(--ink); }
.xu-dropdown__item.is-disabled { opacity: .45; pointer-events: none; }
.xu-dropdown__empty {
  padding: 1rem .5rem; text-align: center;
  color: var(--ink-3); font-size: var(--fs-sm);
}
.xu-dropdown__check {
  width: 16px; height: 16px; flex: none;
  color: var(--accent); opacity: 0;
}
.xu-dropdown__item.is-active .xu-dropdown__check { opacity: 1; }

/* 状态选择下拉 */
.status-dropdown .xu-dropdown__item::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%; flex: none;
}
.status-dropdown .xu-dropdown__item[data-value="草稿"]::before    { background: var(--st-draft); }
.status-dropdown .xu-dropdown__item[data-value="进行中"]::before   { background: var(--st-active); }
.status-dropdown .xu-dropdown__item[data-value="已完成"]::before   { background: var(--st-done); }
.status-dropdown .xu-dropdown__item[data-value="已归档"]::before   { background: var(--st-archived); }

/* 时间选择器 */
.time-field { position: relative; display: flex; align-items: center; gap: .4rem; }
.time-field__input {
  flex: 1; font-variant-numeric: tabular-nums;
}
.time-field__trigger {
  width: 30px; height: 30px; flex: none;
  display: grid; place-items: center;
  border-radius: var(--r-sm); color: var(--ink-3);
  transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.time-field__trigger:hover { background: var(--ghost); color: var(--ink); }
.time-picker__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: .25rem;
  max-height: 220px; overflow: auto; padding-right: .15rem;
}
.time-picker__cell {
  padding: .45rem .2rem; text-align: center;
  border-radius: var(--r-sm); font-size: var(--fs-xs); font-family: var(--font-mono);
  color: var(--ink-2); transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.time-picker__cell:hover { background: var(--ghost); color: var(--ink); }
.time-picker__cell.is-active { background: var(--accent-soft); color: var(--ink); }

/* 日期选择器（条目用，自绘 · 只能选今天及未来） */
.date-picker { width: 252px; padding: .6rem; }
.dp__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .4rem; }
.dp__title { font-size: var(--fs-sm); font-weight: 600; color: var(--ink); letter-spacing: .02em; }
.dp__nav {
  width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center;
  border: 0; background: transparent; border-radius: var(--r-sm); color: var(--ink-2); cursor: pointer;
  transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.dp__nav .icon { width: 14px; height: 14px; }
.dp__nav:hover:not(:disabled) { background: var(--ghost); color: var(--ink); }
.dp__nav:disabled { opacity: .35; cursor: default; }
.dp__quick-row { display: flex; gap: .3rem; margin-bottom: .45rem; }
.dp__quick {
  flex: 1; height: 26px; border: 1px solid var(--line); background: transparent;
  border-radius: 999px; font-size: var(--fs-xs); color: var(--ink-2); cursor: pointer;
  transition: border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.dp__quick:hover { border-color: var(--accent-line); color: var(--accent); }
.dp__quick.is-active { background: var(--accent); border-color: var(--accent); color: var(--paper); }
.dp__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.dp__dow { text-align: center; font-size: var(--fs-micro); color: var(--ink-3); padding: .15rem 0; }
.dp__cell {
  height: 30px; display: inline-flex; align-items: center; justify-content: center;
  border: 0; background: transparent; border-radius: var(--r-sm);
  font-size: var(--fs-xs); color: var(--ink-2); cursor: pointer;
  transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}
.dp__cell:hover:not(:disabled) { background: var(--ghost); color: var(--ink); }
.dp__cell--pad { cursor: default; }
.dp__cell.is-off { color: var(--ink-3); opacity: .4; cursor: default; }
.dp__cell.is-today { box-shadow: inset 0 0 0 1px var(--accent-line); }
.dp__cell.is-active { background: var(--accent); color: var(--paper); }
.dp__cell.is-active.is-today { box-shadow: none; }

/* ---------- 指派弹窗 ---------- */
.assign-modal__search {
  position: sticky; top: 0; z-index: 1;
  display: flex; align-items: center; gap: .5rem;
  padding: .55rem .7rem; margin: -.35rem -.35rem .5rem;
  background: var(--paper-2); border-bottom: 1px solid var(--line);
  border-radius: var(--r-md) var(--r-md) 0 0;
}
.assign-modal__search input {
  flex: 1; min-width: 0; background: transparent; border: 0; font-size: var(--fs-sm); color: var(--ink);
}
.assign-modal__search input:focus { outline: none; }
.assign-list { display: flex; flex-direction: column; gap: .25rem; }
.assign-list__item {
  display: flex; align-items: center; gap: .7rem;
  width: 100%; text-align: left;
  padding: .6rem .5rem; border-radius: var(--r-sm);
  font-size: var(--fs-sm); color: var(--ink);
  transition: background-color var(--dur-1) var(--ease);
}
.assign-list__item:hover { background: var(--ghost); }
.assign-list__item.is-assigned { opacity: .5; pointer-events: none; }
.assign-list__meta { flex: 1; min-width: 0; }
.assign-list__name { display: block; }
.assign-list__hint { display: block; font-size: var(--fs-micro); color: var(--ink-3); margin-top: .1rem; }
.assign-list__empty {
  text-align: center; padding: 2rem .5rem;
  color: var(--ink-3); font-size: var(--fs-sm);
}
.assign-list__empty svg { width: 40px; height: 40px; margin: 0 auto .5rem; color: var(--line-2); }

/* ---------- 我们的 XU 顶部「我的联系人」入口 ---------- */
.joined-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  margin-bottom: var(--sp-2); flex-wrap: wrap;
}
.joined-bar .viewswitch--page { flex: 1 1 auto; min-width: 0; margin-top: 0; margin-bottom: 0; }
.contacts-link {
  flex: none; display: inline-flex; align-items: center; gap: .4rem;
  padding: .5rem .8rem; border-radius: var(--r-pill);
  border: 1px solid var(--line); color: var(--ink-2);
  transition: color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.contacts-link:hover { color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }
.contacts-link .icon { width: 16px; height: 16px; }

/* ---------- 联系人页 ---------- */
.contacts__toolbar { display: flex; align-items: center; gap: .75rem; margin-bottom: var(--sp-3); flex-wrap: wrap; }
.contacts__hint { font-size: var(--fs-xs); }
.contacts { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--sp-2); }
.contact-card {
  display: flex; align-items: center; gap: .75rem;
  padding: .75rem .85rem; border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--paper-2);
  color: inherit; text-decoration: none;
  transition: border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease), transform var(--dur-1) var(--ease);
}
.contact-card:hover { border-color: var(--accent-line); background: var(--paper-3); transform: translateY(-1px); }
.contact-card:focus-visible { outline: 2px solid var(--accent-line); outline-offset: 2px; }
.contact-card__chev { margin-left: auto; color: var(--ink-3); display: inline-grid; place-items: center; }
.contact-card__chev .icon { width: 14px; height: 14px; }
.contact-card:hover .contact-card__chev { color: var(--accent); }
.contact-card__meta { min-width: 0; display: flex; flex-direction: column; }
.contact-card__name { font-size: var(--fs-body); color: var(--ink); }
.contact-card__id { font-size: var(--fs-micro); color: var(--ink-3); font-family: var(--font-mono); }
.contact-card__badges { display: flex; gap: .25rem; margin-top: .35rem; }
.contact-card__badge { width: 22px; height: 22px; border-radius: var(--r-sm); background: var(--paper-3); border: 1px solid var(--line); color: var(--ink-2); display: inline-grid; place-items: center; }
.contact-card__badge .icon { width: 12px; height: 12px; }

/* 收到的联系人请求 */
.reqs { margin-bottom: var(--sp-3); }
.reqs__title { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-h3); margin-bottom: .6rem; }
.req-row {
  display: flex; align-items: center; gap: .75rem;
  padding: .6rem .75rem; border: 1px solid var(--accent-line); border-radius: var(--r-md);
  background: var(--accent-soft); margin-bottom: .5rem;
}
.req-row__meta { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.req-row__name { font-size: var(--fs-body); color: var(--ink); }
.req-row__id { font-size: var(--fs-micro); color: var(--ink-3); font-family: var(--font-mono); }
.req-row__actions { display: flex; align-items: center; gap: .5rem; flex: none; }

/* 添加联系人弹窗中的行 */
.addcontact-row { justify-content: flex-start; }
.addcontact-row .assign-list__meta { flex: 1; min-width: 0; }
.addcontact-btn { flex: none; }

/* 小号按钮 */
.btn--xs {
  height: 28px; padding: 0 .7rem; font-size: var(--fs-micro);
  border-radius: var(--r-pill); border: 1px solid var(--line);
  color: var(--ink-2); background: transparent;
  transition: color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.btn--xs:hover:not(:disabled) { color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }
.btn--xs:disabled { opacity: .5; cursor: default; }

/* ---------- 协作邀请（我加入的 XU 页） ---------- */
.reqs--collab .req-row { border-color: var(--line); background: var(--paper-2); }
.req-row__xu {
  flex: none; width: 38px; height: 38px; border-radius: var(--r-sm);
  display: grid; place-items: center; font-size: 1.3rem;
  background: var(--paper); border: 1px solid var(--line);
}

/* ---------- 侧栏 / 底部导航 勋章角标 ---------- */
.sidebar__nav .navlink, .bottomnav__item { position: relative; }
.nav-badge {
  position: absolute; top: 4px; right: 8px;
  display: inline-flex; align-items: center; gap: 2px;
  height: 16px; padding: 0 4px; border-radius: var(--r-pill);
  background: var(--accent); color: #fff;
  font-size: 10px; line-height: 1; font-weight: 700;
  box-shadow: 0 0 0 2px var(--paper-3);
  animation: rise var(--dur-2) var(--ease) both;
}
.nav-badge__n { font-variant-numeric: tabular-nums; }

/* ---------- 注册：XUID 预览 + 姓名提示 ---------- */
.auth-handle {
  margin: .35rem 0 0; padding: .4rem .55rem;
  border-radius: var(--r-sm); font-size: var(--fs-xs); line-height: 1.5;
  background: color-mix(in srgb, var(--st-done) 12%, transparent);
  color: var(--st-done); border: 1px solid color-mix(in srgb, var(--st-done) 26%, transparent);
}
.auth-handle.is-ok { background: color-mix(in srgb, var(--st-done) 12%, transparent); color: var(--st-done); border-color: color-mix(in srgb, var(--st-done) 26%, transparent); }
.auth-handle.is-alt { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); border-color: color-mix(in srgb, var(--accent) 26%, transparent); }
.auth-handle b { font-family: var(--font-mono); font-weight: 700; }
.auth-name-note {
  margin: .4rem 0 0; font-size: var(--fs-micro); line-height: 1.6; color: var(--ink-3);
}

/* =========================================================================
   账户中心 · 我的身份 · 我的方案 · 安全与账号 · XU 共创
   （复用既有设计令牌：paper-2 卡片 / hairline 行 / 克制暖灰 / 深色重新设计）
   ========================================================================= */

/* 侧栏：头像按钮（触发用户菜单） */
.sidebar__user-btn {
  display: flex; align-items: center; gap: .65rem;
  flex: 1; min-width: 0; padding: 0;
  background: none; border: 0; cursor: pointer; text-align: left;
  border-radius: var(--r-sm);
}
.sidebar__user-btn:hover .sidebar__user-name { color: var(--ink); }

/* 侧栏：共创入口（featured） */
.navlink--feature { color: var(--ink); }
.navlink--feature .navlink__ic { color: var(--accent); }
.navlink--feature:hover { color: var(--accent); }
.navlink--feature.is-active { color: var(--accent); background: var(--accent-soft); }
.navlink--feature.is-active .navlink__ic { color: var(--accent); }

/* 用户菜单下拉分隔 */
.xu-dropdown__sep { height: 1px; background: var(--line); margin: .35rem .25rem; }
.xu-dropdown__item .icon { width: 17px; height: 17px; flex: none; color: var(--ink-3); }
.xu-dropdown__item:hover .icon { color: var(--ink-2); }

/* 大号头像（个人资料卡） */
.avatar--lg { width: 48px; height: 48px; font-size: var(--fs-body); }

/* 账户中心：二级左栏 + 内容 */
.account__layout { display: grid; grid-template-columns: 200px 1fr; gap: var(--sp-4); align-items: start; }
.account__nav {
  position: sticky; top: calc(var(--topbar-h) + var(--sp-3));
  display: flex; flex-direction: column; gap: .15rem;
}
.account__nav-item {
  display: flex; align-items: center; gap: .7rem;
  height: 38px; padding: 0 .8rem; border-radius: var(--r-sm);
  font-size: var(--fs-sm); color: var(--ink-2);
  transition: color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.account__nav-item .icon { width: 18px; height: 18px; color: var(--ink-3); flex: none; }
.account__nav-item:hover { color: var(--ink); background: var(--ghost); }
.account__nav-item.is-active { color: var(--ink); background: var(--accent-soft); }
.account__nav-item.is-active .icon { color: var(--accent); }
.account__body { max-width: 720px; width: 100%; }
.account__head { margin-bottom: var(--sp-3); }
.account__head .display { font-family: var(--font-serif); font-size: var(--fs-h2); font-weight: 400; }
.account__lead { margin-top: .4rem; color: var(--ink-2); font-size: var(--fs-lead); max-width: 56ch; }

/* 个人资料卡 */
.profile-card { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); }
.profile-card__top { display: flex; align-items: center; gap: 1rem; }
.profile-card__id { flex: 1; min-width: 0; }
.profile-card__name { font-family: var(--font-serif); font-size: var(--fs-h3); font-weight: 400; }
.profile-card__xuid { font-size: var(--fs-sm); color: var(--ink-3); font-family: var(--font-mono); }
.profile-card__rows { margin: var(--sp-3) 0 0; display: flex; flex-direction: column; }
.profile-card__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .65rem 0; border-top: 1px solid var(--line); }
.profile-card__row dt { color: var(--ink-3); font-size: var(--fs-sm); }
.profile-card__row dd { margin: 0; color: var(--ink); font-size: var(--fs-sm); text-align: right; }
.profile-card__edit { margin-top: var(--sp-2); padding-top: var(--sp-2); border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: .6rem; }

/* 个人简介块：可编辑 */
.profile-bio-block { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-2) var(--sp-3); margin-top: var(--sp-3); display: flex; flex-direction: column; gap: .6rem; }
.profile-bio-block__head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.profile-bio-block__lbl { font-size: var(--fs-micro); color: var(--ink-3); letter-spacing: .1em; text-transform: uppercase; }
.profile-bio-block__edit { display: inline-flex; align-items: center; gap: .25rem; padding: .2rem .55rem; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--paper-2); color: var(--ink-2); font-size: var(--fs-micro); cursor: pointer; }
.profile-bio-block__edit:hover { color: var(--accent); border-color: var(--accent-line); }
.profile-bio-block__edit .icon { width: 12px; height: 12px; }
.profile-bio-block__content { font-size: var(--fs-sm); color: var(--ink); line-height: 1.7; white-space: pre-wrap; min-height: 1.4em; }
.profile-bio-block__form { display: flex; flex-direction: column; gap: .6rem; }
.profile-bio-block__form-actions { display: flex; gap: .5rem; justify-content: flex-end; }
.profile-card__edit-actions { display: flex; gap: .5rem; }

/* 我的身份：认证卡 */
.idcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--sp-3); }
.idcard { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); display: flex; flex-direction: column; gap: .7rem; }
.idcard.is-verified { border-color: var(--accent-line); background: var(--accent-soft); }
.idcard__top { display: flex; align-items: flex-start; gap: .8rem; }
.idcard__ic { flex: none; width: 40px; height: 40px; border-radius: var(--r-sm); display: grid; place-items: center; background: var(--paper-3); border: 1px solid var(--line); color: var(--ink-2); }
.idcard__ic .icon { width: 20px; height: 20px; }
.idcard__t { flex: 1; min-width: 0; }
.idcard__title { font-family: var(--font-serif); font-size: var(--fs-h3); font-weight: 400; }
.idcard__badge { display: inline-flex; align-items: center; gap: .3rem; margin-top: .3rem; font-size: var(--fs-micro); color: var(--st-done); }
.idcard__badge .icon { width: 14px; height: 14px; }
.idcard__badge--off { color: var(--ink-3); }
.idcard__desc { color: var(--ink-2); font-size: var(--fs-sm); line-height: 1.6; }
.idcard__org { font-size: var(--fs-sm); color: var(--ink); background: var(--paper-3); border: 1px solid var(--line); border-radius: var(--r-sm); padding: .4rem .6rem; }
.idcard__privacy { display: flex; align-items: flex-start; gap: .4rem; font-size: var(--fs-micro); color: var(--ink-3); line-height: 1.6; margin-top: auto; }
.idcard__privacy .icon { width: 14px; height: 14px; flex: none; margin-top: .1rem; }
.idcard__foot { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; margin-top: .3rem; }
.idcard__foot .btn { flex: 1 1 auto; justify-content: center; }

/* 认证资料结构化键值行 */
.cert-meta__row { display: flex; align-items: baseline; gap: .6rem; padding: .16rem 0; }
.cert-meta__row + .cert-meta__row { border-top: 1px dashed var(--line); }
.cert-meta__k { flex: none; width: 5.5em; font-size: var(--fs-micro); color: var(--ink-3); }
.cert-meta__v { flex: 1; min-width: 0; font-size: var(--fs-sm); color: var(--ink); line-height: 1.5; word-break: break-word; }
.cert-meta__v b { font-weight: 600; }
.cert-meta__sub { display: block; font-size: var(--fs-xs); color: var(--ink-3); margin-top: .1rem; }

/* 认证审核中（待审核态） */
.idcard.is-pending { border-color: rgba(183, 121, 31, .32); background: rgba(183, 121, 31, .08); }
.idcard__badge--pending { color: #B7791F; }
.idcard.is-revoking { border-color: rgba(122, 92, 160, .32); background: rgba(122, 92, 160, .08); }
.idcard__badge--revoking { color: #7A5CA0; }

/* 认证被拒绝态 */
.idcard.is-rejected { border-color: rgba(196, 69, 62, .32); background: rgba(196, 69, 62, .06); }
.idcard__badge--rejected { color: var(--danger); }
.idcard__note { font-size: var(--fs-xs); color: var(--danger); background: rgba(196, 69, 62, .08); border: 1px solid rgba(196, 69, 62, .25); border-radius: var(--r-sm); padding: .4rem .6rem; line-height: 1.6; }
.idcard__note .icon { width: 14px; height: 14px; vertical-align: -2px; margin-right: .25rem; }
.idcard__note--info { color: var(--ink-2); background: var(--ghost); border-color: var(--line); }

/* 开发者 / 团队认证表单：chips 多选 / 下拉弹层 / 备案切换 / 上传 */
.verify-form { display: flex; flex-direction: column; gap: var(--sp-2); }
.dev-soft-block { border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-2) var(--sp-2) var(--sp-2); display: flex; flex-direction: column; gap: .6rem; background: var(--paper-2); }
.dev-soft-block__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.dev-soft-block__title { font-size: var(--fs-xs); font-weight: 600; color: var(--ink-2); }
.dev-soft-block__del { width: 26px; height: 26px; border-radius: 50%; color: var(--danger); display: grid; place-items: center; cursor: pointer; background: transparent; border: 0; }
.dev-soft-block__del:hover { background: rgba(196, 69, 62, .1); }
.dev-soft-add { display: flex; justify-content: center; }
.dev-soft-add .btn { border-style: dashed; }
.req { color: var(--danger); margin-left: .15rem; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chip { border: 1px solid var(--line); border-radius: var(--r-pill); padding: .3rem .75rem; font-size: var(--fs-xs); background: var(--paper-2); color: var(--ink-2); cursor: pointer; transition: background var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.chip:hover { border-color: var(--accent-line); }
.chip.is-active { background: var(--accent); border-color: var(--accent); color: #fff; }
.msel { position: relative; }
.msel__btn { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .55rem .8rem; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); color: var(--ink-2); font-size: var(--fs-sm); cursor: pointer; text-align: left; }
.msel__btn:hover { border-color: var(--accent-line); }
.msel__panel { position: absolute; top: calc(100% + 5px); left: 0; right: 0; z-index: 40; background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow); padding: .6rem; max-height: 220px; overflow: auto; }
.msel__panel[hidden] { display: none; }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r-pill); overflow: hidden; }
.seg__btn { padding: .4rem 1rem; font-size: var(--fs-xs); background: var(--paper-2); color: var(--ink-2); border: 0; cursor: pointer; }
.seg__btn.is-active { background: var(--paper-3); color: var(--ink); font-weight: 600; }
.seg__btn .icon { width: 14px; height: 14px; vertical-align: -2px; margin-right: .25rem; }

/* ---------- 隐私设置 ---------- */
.privacy-card { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); margin-bottom: var(--sp-3); }
.privacy-section__title { font-size: var(--fs-micro); color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; margin-bottom: var(--sp-2); }
.privacy-section__lead { font-size: var(--fs-xs); color: var(--ink-3); margin-bottom: var(--sp-2); line-height: 1.6; }
.privacy-toggles { display: flex; flex-direction: column; gap: .6rem; }
.priv-row { display: flex; align-items: center; gap: .9rem; padding: .8rem .9rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper); cursor: pointer; transition: border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease); }
.priv-row:hover { border-color: var(--accent-line); background: var(--accent-soft); }
.priv-row__ic { flex: none; width: 36px; height: 36px; border-radius: var(--r-sm); display: grid; place-items: center; background: var(--paper-3); border: 1px solid var(--line); color: var(--ink-2); }
.priv-row__ic .icon { width: 18px; height: 18px; }
.priv-row__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .2rem; }
.priv-row__t { font-size: var(--fs-body); color: var(--ink); font-weight: 500; }
.priv-row__d { font-size: var(--fs-xs); color: var(--ink-3); line-height: 1.6; }
.priv-row__switch { position: relative; flex: none; width: 44px; height: 24px; border-radius: var(--r-pill); background: var(--line); transition: background var(--dur-2) var(--ease); cursor: pointer; }
.priv-row__switch b { position: absolute; top: 2px; left: 2px; width: 20px; height: 20px; border-radius: 50%; background: var(--paper); box-shadow: 0 1px 2px rgba(0,0,0,.15); transition: transform var(--dur-2) var(--ease); }
.priv-row__switch.is-on { background: var(--accent); }
.priv-row__switch.is-on b { transform: translateX(20px); }
.privacy-certs { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--sp-2); }
.priv-cert-card { display: flex; flex-direction: column; gap: .6rem; padding: .85rem .95rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper); }
.priv-cert-card__head { display: flex; align-items: center; gap: .55rem; }
.priv-cert-card__head .idcard__ic { width: 32px; height: 32px; }
.priv-cert-card__title { font-size: var(--fs-sm); color: var(--ink); font-weight: 500; flex: 1; }
.priv-cert-card__status { font-size: var(--fs-micro); color: var(--ink-3); border: 1px solid var(--line); border-radius: var(--r-pill); padding: .12rem .55rem; }
.priv-cert-card__status.is-ok { color: var(--st-done); border-color: color-mix(in srgb, var(--st-done) 25%, transparent); background: color-mix(in srgb, var(--st-done) 10%, transparent); }
.priv-cert-card__hint { font-size: var(--fs-xs); color: var(--ink-3); line-height: 1.6; min-height: 1.6em; }
.seg.seg--vert { display: flex; flex-direction: column; border-radius: var(--r-md); }
.seg.seg--vert .seg__btn { padding: .5rem .75rem; display: flex; align-items: center; gap: .35rem; border-radius: 0; }
.seg.seg--vert .seg__btn:first-child { border-top-left-radius: var(--r-md); border-top-right-radius: var(--r-md); }
.seg.seg--vert .seg__btn:last-child { border-bottom-left-radius: var(--r-md); border-bottom-right-radius: var(--r-md); }
.seg.seg--vert .seg__btn + .seg__btn { border-top: 1px solid var(--line); }
.seg.seg--vert.is-disabled { opacity: .6; pointer-events: none; }
.privacy-actions { display: flex; justify-content: flex-end; }
.up-row { display: flex; align-items: center; gap: .7rem; }
.up-input { flex: 1; font-size: var(--fs-xs); }
.up-state { font-size: var(--fs-xs); color: var(--ink-3); white-space: nowrap; }
.up-state.is-ok { color: var(--st-done); }
.up-hint, .up-demo { font-size: var(--fs-xs); color: var(--ink-3); margin: .2rem 0 0; line-height: 1.6; }

/* 证明材料小节（教育 / 团队认证表单内的「证明材料」标题与分区） */
.cert-proofs-section { margin-top: var(--sp-2); }
.cert-proofs-section__title { font-size: var(--fs-micro); color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; margin-bottom: var(--sp-1); }

/* 证明材料上传控件（点选 / 缩略预览 / 错误反馈） */
.xu-up { position: relative; }
.xu-up__file { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
.xu-up__zone { width: 100%; display: flex; align-items: center; gap: .7rem; padding: .7rem .85rem; border: 1.5px dashed var(--line); border-radius: var(--r-md); background: var(--paper-2); color: var(--ink-3); cursor: pointer; transition: border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.xu-up__zone:hover { border-color: var(--accent-line); background: var(--accent-soft); color: var(--ink-2); }
.xu-up__zone:disabled { opacity: .55; cursor: progress; }
.xu-up__ic { flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--paper-3); display: grid; place-items: center; color: var(--accent); }
.xu-up__ic .icon { width: 18px; height: 18px; }
.xu-up__zone-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.xu-up__title { font-size: var(--fs-sm); color: var(--ink); font-weight: 500; }
.xu-up__title .xu-up__label { color: var(--ink); }
.xu-up__title .xu-up__label em { color: var(--danger); font-style: normal; margin-right: .15rem; }
.xu-up__hint { font-size: var(--fs-xs); color: var(--ink-3); line-height: 1.5; }
.xu-up__progress { font-size: var(--fs-xs); color: var(--ink-3); padding: .3rem .1rem 0; }
.xu-up__progress b { color: var(--ink-2); font-weight: 500; }
.xu-up__preview { display: flex; align-items: center; gap: .75rem; padding: .6rem .8rem; border: 1px solid var(--accent-line); border-radius: var(--r-md); background: var(--accent-soft); }
.xu-up__thumb { width: 48px; height: 48px; border-radius: var(--r-sm); background: var(--paper); display: grid; place-items: center; overflow: hidden; flex: none; color: var(--ink-2); }
.xu-up__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.xu-up__thumb .icon { width: 22px; height: 22px; color: var(--danger); }
.xu-up__meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.xu-up__name { font-size: var(--fs-sm); color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.xu-up__size { font-size: var(--fs-xs); color: var(--ink-3); }
.xu-up__acts { display: flex; gap: .35rem; flex: none; }
.xu-up__act { padding: .35rem .7rem; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--paper); color: var(--ink-2); font-size: var(--fs-xs); cursor: pointer; transition: background var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.xu-up__act:hover { background: var(--paper-3); color: var(--ink); }
.xu-up__act--danger { color: var(--danger); border-color: rgba(196, 69, 62, .35); }
.xu-up__act--danger:hover { background: rgba(196, 69, 62, .08); }
.xu-up__error { display: flex; align-items: center; gap: .6rem; padding: .5rem .75rem; border: 1px solid rgba(196, 69, 62, .35); border-radius: var(--r-md); background: rgba(196, 69, 62, .06); color: var(--danger); font-size: var(--fs-xs); margin-top: .45rem; }
.xu-up__error .icon { width: 16px; height: 16px; flex: none; }
.xu-up__errmsg { flex: 1; min-width: 0; line-height: 1.6; }
.xu-up--error .xu-up__zone { border-color: rgba(196, 69, 62, .35); background: rgba(196, 69, 62, .04); }

/* 模式选择卡（个人认证 / 认领） */
.cert-modes { display: flex; flex-direction: column; gap: .6rem; margin: var(--sp-2) 0; }
.cert-mode { display: flex; align-items: flex-start; gap: .8rem; text-align: left; padding: .8rem .95rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper-2); cursor: pointer; transition: border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease); }
.cert-mode:hover { border-color: var(--accent-line); background: var(--accent-soft); }
.cert-mode__ic { flex: none; width: 38px; height: 38px; border-radius: var(--r-sm); display: grid; place-items: center; background: var(--paper-3); border: 1px solid var(--line); color: var(--ink-2); }
.cert-mode__ic .icon { width: 20px; height: 20px; }
.cert-mode__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .2rem; }
.cert-mode__t { font-size: var(--fs-body); color: var(--ink); font-weight: 600; }
.cert-mode__d { font-size: var(--fs-xs); color: var(--ink-3); line-height: 1.6; }
.cert-mode__tag { display: inline-block; font-size: var(--fs-micro); color: var(--accent); border: 1px solid var(--accent-line); border-radius: var(--r-pill); padding: .12rem .55rem; margin-bottom: .25rem; align-self: flex-start; }
.edu-cats { display: flex; flex-direction: column; gap: .6rem; margin: var(--sp-2) 0; }
.edu-cat { display: flex; flex-direction: column; gap: .25rem; text-align: left; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper-2); cursor: pointer; }
.edu-cat:hover { border-color: var(--accent-line); background: var(--accent-soft); }
.edu-cat__t { font-size: var(--fs-body); color: var(--ink); font-weight: 600; }
.edu-cat__d { font-size: var(--fs-micro); color: var(--ink-3); }
.modal__step-note { font-size: var(--fs-xs); color: var(--ink-3); line-height: 1.6; margin: .2rem 0 var(--sp-2); }

/* 我的方案：方案卡 */
.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--sp-3); align-items: start; }
.plan-card { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); display: flex; flex-direction: column; gap: var(--sp-2); }
.plan-card.is-current { border-color: var(--accent-line); }
.plan-card__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.plan-card__name { font-family: var(--font-serif); font-size: var(--fs-h3); font-weight: 400; }
.plan-card__tag { font-size: var(--fs-micro); color: var(--ink-3); border: 1px solid var(--line); border-radius: var(--r-pill); padding: .2rem .6rem; }
.plan-card.is-current .plan-card__tag { color: var(--accent); border-color: var(--accent-line); }
.plan-card__feats { list-style: none; display: flex; flex-direction: column; gap: .5rem; }
.plan-card__feats li { display: flex; align-items: flex-start; gap: .5rem; font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.5; }
.plan-card__feats .icon { width: 15px; height: 15px; flex: none; color: var(--st-done); margin-top: .15rem; }
.plan-card.is-soon .plan-card__feats .icon { color: var(--ink-3); }
.plan-card__cta { align-self: flex-start; }

/* 安全与账号 */
.sec-card { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-2) var(--sp-3); }
.sec-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-top: 1px solid var(--line); }
.sec-row:first-child { border-top: 0; }
.sec-row__lbl { color: var(--ink-3); font-size: var(--fs-sm); }
.sec-row__val { color: var(--ink); font-size: var(--fs-sm); font-family: var(--font-mono); }
.sec-actions { display: flex; gap: .6rem; margin-top: var(--sp-3); flex-wrap: wrap; }

/* XU 共创 */
.coc { display: flex; flex-direction: column; gap: var(--sp-4); }
.coc-head { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-2); }
.coc-stat { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); text-align: center; }
.coc-stat__n { font-family: var(--font-serif); font-size: var(--fs-h2); font-weight: 400; color: var(--accent); }
.coc-stat__l { font-size: var(--fs-xs); color: var(--ink-3); margin-top: .2rem; }
.coc-submit, .coc-list { background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--sp-3); display: flex; flex-direction: column; gap: var(--sp-2); }
.coc-submit__title, .coc-list__title { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-h3); }
.coc-submit__actions { display: flex; justify-content: flex-end; }
.coc-list { gap: 0; padding: 0; overflow: hidden; }
.coc-list__title { padding: var(--sp-3) var(--sp-3) 0; }
.coc-group__head { display: flex; align-items: center; gap: .45rem; padding: .55rem var(--sp-3); background: var(--ghost); border-top: 1px solid var(--line); }
.coc-group:first-of-type .coc-group__head { border-top: 0; }
.coc-group__name { font-size: var(--fs-xs); color: var(--ink-2); font-weight: 600; letter-spacing: .02em; }
.coc-group__count { font-size: var(--fs-micro); color: var(--ink-3); background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-pill); padding: 0 .45rem; line-height: 1.5; }
.coc-row { padding: var(--sp-3); border-top: 1px solid var(--line); }
.coc-group__rows .coc-row:first-child { border-top: 0; }
.coc-row__top { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.coc-row__type { font-size: var(--fs-micro); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.coc-row__mine { font-size: var(--fs-micro); color: var(--accent); border: 1px solid var(--accent-line); border-radius: var(--r-pill); padding: .1rem .45rem; }
.coc-row__title { font-size: var(--fs-body); color: var(--ink); margin-top: .35rem; }
.coc-row__detail { font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; margin-top: .25rem; }
.coc-row__meta { display: flex; align-items: center; gap: .4rem; font-size: var(--fs-micro); color: var(--ink-3); margin-top: .45rem; }
.coc-row__user { display: inline-flex; align-items: center; gap: .35rem; color: var(--ink-2); text-decoration: none; border-radius: var(--r-pill); transition: color var(--dur-1) var(--ease); }
.coc-row__user:hover { color: var(--accent); }
.coc-row__user .avatar--xs { flex: none; }

/* 共创状态标签 */
.co-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 .6rem; border-radius: var(--r-pill); font-size: var(--fs-micro); letter-spacing: .04em; border: 1px solid transparent; }
.co-tag--pending  { color: var(--st-draft);    background: color-mix(in srgb, var(--st-draft) 12%, transparent); }
.co-tag--accepted { color: var(--accent);      background: var(--accent-soft); }
.co-tag--planned  { color: var(--accent-2);    background: color-mix(in srgb, var(--accent-2) 14%, transparent); }
.co-tag--done     { color: var(--st-done);     background: color-mix(in srgb, var(--st-done) 14%, transparent); }
.co-tag--closed   { color: var(--ink-3);       background: var(--ghost); }

/* 共创分类 tab + 点赞 + 官方回复 */
.coc-tabs { display: flex; flex-wrap: wrap; gap: .4rem; padding: var(--sp-3) var(--sp-3) var(--sp-2); }
.coc-tab { display: inline-flex; align-items: center; gap: .3rem; height: 28px; padding: 0 .7rem; border: 1px solid var(--line); border-radius: var(--r-pill); background: transparent; color: var(--ink-2); font-size: var(--fs-xs); cursor: pointer; transition: color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease); }
.coc-tab i { font-style: normal; font-size: var(--fs-micro); color: var(--ink-3); }
.coc-tab:hover { border-color: var(--ink-3); color: var(--ink); }
.coc-tab.is-active { background: var(--ink); border-color: var(--ink); color: var(--paper-2); }
.coc-tab.is-active i { color: color-mix(in srgb, var(--paper-2) 72%, transparent); }
.coc-list__rows .coc-row:first-child { border-top: 0; }
.coc-list__empty { padding: var(--sp-3) var(--sp-3) var(--sp-4); }
.coc-like { display: inline-flex; align-items: center; gap: .28rem; margin-left: auto; height: 24px; padding: 0 .55rem; border: 1px solid var(--line); border-radius: var(--r-pill); background: transparent; color: var(--ink-3); font-size: var(--fs-micro); cursor: pointer; transition: color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease), transform var(--dur-1) var(--ease); }
.coc-like .icon { width: 13px; height: 13px; }
.coc-like:hover { color: var(--accent); border-color: var(--accent-line); }
.coc-like:active { transform: scale(.94); }
.coc-like.is-liked { color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }
.coc-reply { margin-top: .5rem; padding: .45rem .65rem; background: var(--accent-soft); border-left: 2px solid var(--accent); border-radius: 0 var(--r-sm) var(--r-sm) 0; }
.coc-reply__label { display: block; font-size: var(--fs-micro); font-weight: 600; letter-spacing: .05em; color: var(--accent); }
.coc-reply__text { margin: .15rem 0 0; font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; }

/* ===================== 高校空间 ===================== */
.school-page, .school-detail { display: flex; flex-direction: column; gap: var(--sp-4); }
.school-section { display: flex; flex-direction: column; gap: var(--sp-2); }
.school-section__title { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-h3); color: var(--ink); }

/* 高校标签（985 / 211 / 双一流） */
.school-tag { display: inline-flex; align-items: center; height: 20px; padding: 0 .5rem; border-radius: var(--r-pill); font-size: var(--fs-micro); letter-spacing: .04em; color: var(--accent); background: var(--accent-soft); border: 1px solid var(--accent-line); }

/* 我的高校卡网格 */
.school-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--sp-3); }
.school-card { display: flex; flex-direction: column; gap: .45rem; padding: var(--sp-3); background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); text-decoration: none; color: inherit; transition: border-color var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease); }
.school-card:hover { border-color: var(--accent-line); box-shadow: 0 2px 12px rgba(0,0,0,.04); }
.school-card__top { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.school-card__name { font-family: var(--font-serif); font-size: var(--fs-h3); font-weight: 400; color: var(--ink); }
.school-card__en { font-size: var(--fs-xs); color: var(--ink-3); }
.school-card__tags { display: flex; flex-wrap: wrap; gap: .3rem; }
.school-card__meta { display: flex; flex-wrap: wrap; gap: .6rem; font-size: var(--fs-sm); color: var(--ink-2); }
.school-card__major { font-size: var(--fs-sm); color: var(--ink-3); }

/* 审核中 / 未通过 列表 */
.school-list-plain { display: flex; flex-direction: column; gap: 0; background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.school-plain { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .7rem var(--sp-3); border-top: 1px solid var(--line); font-size: var(--fs-sm); color: var(--ink); }
.school-plain:first-child { border-top: 0; }
.school-plain__status { font-size: var(--fs-micro); padding: .15rem .55rem; border-radius: var(--r-pill); border: 1px solid transparent; }
.school-plain__status--pending { color: var(--st-draft); background: color-mix(in srgb, var(--st-draft) 12%, transparent); border-color: color-mix(in srgb, var(--st-draft) 20%, transparent); }
.school-plain__status--rejected { color: var(--ink-3); background: var(--ghost); }

/* 空状态 */
.school-empty { padding: var(--sp-4) 0; text-align: center; }

/* 搜索 */
.school-search { display: flex; flex-direction: column; gap: var(--sp-2); }
.school-search__results { display: flex; flex-direction: column; gap: 0; }
.school-search-item { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .65rem var(--sp-3); border-top: 1px solid var(--line); text-decoration: none; color: inherit; transition: background var(--dur-1) var(--ease); }
.school-search-item:first-child { border-top: 0; }
.school-search-item:hover { background: var(--accent-soft); }
.school-search-item__name { font-size: var(--fs-body); color: var(--ink); }
.school-search-item__meta { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.school-search-item__loc { font-size: var(--fs-micro); color: var(--ink-3); }

/* 教育认证 — 学校自动补全下拉 */
.school-autocomplete { position: relative; }
.school-autocomplete__dd {
  position: absolute; left: 0; right: 0; top: 100%; z-index: 10;
  background: var(--paper-3); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--shadow-2);
  max-height: 200px; overflow-y: auto; margin-top: 2px;
}
.school-autocomplete__dd:empty { display: none; }
.school-autocomplete__item {
  display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  padding: .55rem var(--sp-2); cursor: pointer; transition: background var(--dur-1) var(--ease);
}
.school-autocomplete__item:hover { background: var(--accent-soft); }
.school-autocomplete__item-name { font-size: var(--fs-sm); color: var(--ink); }
.school-autocomplete__item-meta { display: flex; align-items: center; gap: .3rem; flex-wrap: wrap; }
.school-autocomplete__item-loc { font-size: var(--fs-micro); color: var(--ink-3); }

/* 高校主页 Hero */
.school-hero { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; padding: var(--sp-3); background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); }
.school-hero__main { display: flex; flex-direction: column; gap: .35rem; flex: 1; min-width: 200px; }
.school-hero__name { font-family: var(--font-serif); font-size: var(--fs-display); font-weight: 400; color: var(--ink); line-height: 1.2; }
.school-hero__en { font-size: var(--fs-sm); color: var(--ink-3); }
.school-hero__tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .2rem; }
.school-hero__loc { display: flex; align-items: center; gap: .3rem; font-size: var(--fs-sm); color: var(--ink-2); margin-top: .3rem; }
.school-hero__loc .icon { width: 14px; height: 14px; }
.school-hero__web { margin-top: .2rem; }
.school-hero__stats { display: flex; gap: var(--sp-4); flex: none; }
.school-hero__stat { display: flex; flex-direction: column; align-items: center; gap: .15rem; min-width: 64px; }
.school-hero__n { font-family: var(--font-serif); font-size: var(--fs-h2); font-weight: 400; color: var(--accent); }
.school-hero__l { font-size: var(--fs-xs); color: var(--ink-3); }

/* 排名 */
.school-rankings { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.school-rank { display: flex; align-items: baseline; gap: .4rem; padding: .5rem .8rem; background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); }
.school-rank__type { font-size: var(--fs-micro); color: var(--ink-3); letter-spacing: .04em; text-transform: uppercase; }
.school-rank__val { font-family: var(--font-serif); font-size: var(--fs-h3); font-weight: 400; color: var(--ink); }
.school-rank__year { font-size: var(--fs-micro); color: var(--ink-3); }

/* 校区 */
.school-campus-list { display: flex; flex-direction: column; gap: 0; background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.school-campus { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; padding: .7rem var(--sp-3); border-top: 1px solid var(--line); }
.school-campus:first-child { border-top: 0; }
.school-campus__name { font-size: var(--fs-body); color: var(--ink); font-weight: 500; }
.school-campus__en { font-size: var(--fs-xs); color: var(--ink-3); }
.school-campus__addr { font-size: var(--fs-sm); color: var(--ink-3); margin-left: auto; }

/* 移动端：高校空间 */
@media (max-width: 859px) {
  .school-grid { grid-template-columns: 1fr; }
  .school-hero { flex-direction: column; }
  .school-hero__stats { align-self: flex-start; }
  .school-campus__addr { margin-left: 0; }
}

/* 移动端：账户中心二级栏改为横向滚动标签，内容单列 */
@media (max-width: 859px) {
  .account__layout { grid-template-columns: 1fr; gap: var(--sp-3); }
  .account__nav {
    position: static; flex-direction: row; overflow-x: auto;
    gap: .5rem; padding-bottom: .5rem; border-bottom: 1px solid var(--line);
    -webkit-overflow-scrolling: touch;
  }
  .account__nav-item { flex: 0 0 auto; height: 34px; padding: 0 .8rem; border: 1px solid var(--line); }
  .account__body { max-width: none; }
}

/* 设置页头像上传行 */
.settings__row--avatar { display: flex; align-items: center; justify-content: space-between; }
.avatar-upload-row { display: flex; justify-content: flex-end; flex: 1; }
.avatar-wrapper { position: relative; display: inline-block; }
.avatar-overlay-btn {
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  font-size: var(--fs-xs);
  padding: 2px 8px;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.avatar-wrapper:hover .avatar-overlay-btn { opacity: 1; }

@media (max-width: 768px) {
  .settings__row--avatar { flex-direction: column; align-items: flex-start; gap: var(--sp-2); }
  .avatar-upload-row { justify-content: flex-start; }
  .avatar-overlay-btn { opacity: 1; bottom: -4px; }
}

/* 头像裁剪模态框 */
.modal__card--wide { max-width: 600px; width: 90vw; }
.avatar-crop-container { display: flex; flex-direction: column; align-items: center; gap: var(--sp-3); padding: var(--sp-3) 0; }
#avatarCropCanvas {
  border-radius: var(--r-md);
  cursor: move;
  background: #f5f5f5;
  box-shadow: inset 0 0 0 1px var(--line);
}
.avatar-crop-controls { display: flex; flex-direction: column; align-items: center; gap: var(--sp-2); width: 100%; }
.avatar-crop-hint { font-size: var(--fs-sm); color: var(--ink-3); text-align: center; }
.avatar-crop-actions { display: flex; gap: var(--sp-2); }

@media (max-width: 768px) {
  .avatar-upload-row { flex-direction: column; align-items: flex-start; }
  .avatar-upload-actions { flex-direction: row; }
  .modal__card--wide { width: 95vw; }
  #avatarCropCanvas { width: 300px !important; height: 300px !important; }
}
