/*! XWP 账号体系 · 登录注册弹窗 + 共享组件
 *  统一为「暗黑紫金」品牌风（与首页 style.css 同源）。
 */
.xwp-account-btn{
  display:inline-flex; align-items:center; gap:6px; cursor:pointer;
  border:1px solid var(--xwp-line); background:rgba(124,140,255,.12);
  color:var(--xwp-ink); border-radius:999px; padding:5px 12px;
  font-size:13px; line-height:1; transition:.18s; white-space:nowrap;
}
.xwp-account-btn:hover{ border-color:var(--xwp-purple); color:#fff; }
.xwp-account-btn .xwp-avatar{ width:22px; height:22px; border-radius:50%; }
.xwp-account-btn.is-guest{ background:linear-gradient(135deg,var(--xwp-gold-400),var(--xwp-gold-600) 55%,var(--xwp-gold-800)); border-color:transparent; color:#fff; font-weight:600; }
.xwp-account-btn.is-guest:hover{ filter:brightness(1.06); color:#fff; }

.xwp-account-menu{
  position:absolute; z-index:60; min-width:148px; right:0; top:calc(100% + 8px);
  background:var(--xwp-surface); border:1px solid var(--xwp-line); border-radius:14px; padding:8px;
  box-shadow:0 12px 34px rgba(0,0,0,.5); display:none;
}
.xwp-account-menu.open{ display:block; }
.xwp-account-menu a, .xwp-account-menu button{
  display:block; width:100%; text-align:left; border:0; background:none;
  padding:9px 12px; border-radius:9px; font-size:14px; color:var(--xwp-ink); cursor:pointer;
}
.xwp-account-menu a:hover, .xwp-account-menu button:hover{ background:rgba(124,140,255,.12); color:var(--xwp-gold); }

/* 弹窗 —— 移动端整体滚动（mask 滚动 + margin:auto），不居中固定，
   避免键盘弹出遮挡输入框；去掉 backdrop-filter 减少滚动掉帧 */
.xwp-modal-mask{
  position:fixed; inset:0; z-index:200; display:none;
  background:rgba(8,7,20,.66);
  overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;  /* 滚到边界不再链式穿透到下层 body（滚动穿透双保险） */
  box-sizing:border-box; padding:30px 18px 46px;
}
.xwp-modal-mask.open{ display:block; }
.xwp-modal{
  width:100%; max-width:420px; background:var(--xwp-surface); border:1px solid var(--xwp-line); border-radius:20px;
  box-sizing:border-box;
  padding:26px 22px 24px; box-shadow:0 24px 60px rgba(0,0,0,.6);
  animation: xwp-pop .22s cubic-bezier(.16,1,.3,1); margin:auto;
}
@keyframes xwp-pop{ from{ transform:translateY(14px) scale(.98); opacity:0 } to{ transform:none; opacity:1 } }
.xwp-modal h3{ font-size:20px; margin:0 0 4px; color:var(--xwp-ink); font-weight:700; }
.xwp-modal .xwp-sub{ color:var(--xwp-ink2); font-size:12.5px; margin:0 0 18px; }
.xwp-modal-close{
  position:absolute; top:14px; right:16px; border:0; background:none;
  width:34px; height:34px; border-radius:50%;
  font-size:20px; color:var(--xwp-ink2); cursor:pointer; line-height:1;
  display:flex; align-items:center; justify-content:center; transition:.15s;
}
.xwp-modal-close:hover{ background:rgba(255,255,255,.08); color:var(--xwp-gold); }
.xwp-tabs{ display:flex; gap:6px; background:rgba(124,140,255,.1); padding:4px; border-radius:11px; margin-bottom:16px; }
.xwp-tabs button{
  flex:1; border:0; background:none; padding:8px; border-radius:8px; cursor:pointer;
  font-size:14px; color:var(--xwp-ink2); transition:.15s;
}
.xwp-tabs button.on{ background:var(--xwp-surface-2); color:var(--xwp-gold); font-weight:600; box-shadow:0 2px 8px rgba(0,0,0,.3); }
.xwp-field{ margin-bottom:16px; }
.xwp-field label{ display:block; font-size:12.5px; color:var(--xwp-ink2); margin-bottom:7px; font-weight:600; letter-spacing:.02em; }
.xwp-input{
  width:100%; box-sizing:border-box; border:1px solid var(--xwp-line); border-radius:12px;
  padding:13px 15px; font-size:15.5px; outline:none; transition:.18s; background:var(--xwp-surface-2); color:var(--xwp-ink);
  caret-color:var(--xwp-gold); scroll-margin:24px;
}
.xwp-input::placeholder{ color:var(--xwp-ink3, rgba(255,255,255,.32)); }
.xwp-input:focus{ border-color:var(--xwp-gold); background:var(--xwp-surface); box-shadow:0 0 0 3px rgba(231,200,137,.18); }
select.xwp-input{
  appearance:none; -webkit-appearance:none; padding-right:38px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C9A25C' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;
}
select.xwp-input option{ background:var(--xwp-surface-2); color:var(--xwp-ink); }

/* 弹窗内文本域（编辑资料简介） */
.xwp-modal .xwp-textarea{
  width:100%; box-sizing:border-box; min-height:96px; resize:vertical;
  border:1px solid var(--xwp-line); border-radius:12px;
  padding:13px 15px; font-size:15.5px; line-height:1.55; outline:none; transition:.18s;
  background:var(--xwp-surface-2); color:var(--xwp-ink); caret-color:var(--xwp-gold); scroll-margin:24px;
  font-family:inherit;
}
.xwp-modal .xwp-textarea::placeholder{ color:var(--xwp-ink3, rgba(255,255,255,.32)); }
.xwp-modal .xwp-textarea:focus{ border-color:var(--xwp-gold); background:var(--xwp-surface); box-shadow:0 0 0 3px rgba(231,200,137,.18); }

/* 字段分组（编辑资料卡片式分区） */
.xwp-field-group{ border:1px solid var(--xwp-line); border-radius:16px; padding:16px 16px 4px; margin:0 0 16px; background:var(--xwp-surface); }
.xwp-group-title{
  display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:var(--xwp-gold);
  letter-spacing:.06em; margin:0 0 14px;
}
.xwp-group-title::before{ content:""; width:4px; height:14px; border-radius:2px; background:linear-gradient(180deg,var(--xwp-gold-400),var(--xwp-gold-700)); }

.xwp-err{ color:var(--xwp-red); font-size:12.5px; min-height:17px; margin:2px 0 10px; }
.xwp-btn-primary{
  width:100%; border:0; border-radius:999px; padding:12px; font-size:15.5px; font-weight:600;
  background:linear-gradient(135deg,var(--xwp-gold-400),var(--xwp-gold-600) 55%,var(--xwp-gold-800)); color:#fff; cursor:pointer; transition:.15s;
}
.xwp-btn-primary:hover{ filter:brightness(1.06); }
.xwp-btn-primary:disabled{ opacity:.6; cursor:default; }
.xwp-btn-ghost{
  width:100%; border:1px solid var(--xwp-line); border-radius:999px; padding:11px;
  background:var(--xwp-surface); color:var(--xwp-ink); cursor:pointer; font-size:14px; transition:.15s;
}
.xwp-btn-ghost:hover{ border-color:var(--xwp-purple); color:#fff; }
.xwp-modal-tip{ font-size:12px; color:var(--xwp-ink2); text-align:center; margin-top:12px; }

/* 共享：标签 / 头像 / 卡片按钮 */
.xwp-tag{
  display:inline-block; font-size:11.5px; color:var(--xwp-gold); background:rgba(231,200,137,.12);
  border-radius:6px; padding:2px 8px; margin:2px 4px 2px 0;
}
.xwp-avatar{
  width:40px; height:40px; border-radius:50%; background:var(--xwp-surface-2); color:var(--xwp-ink2);
  display:inline-flex; align-items:center; justify-content:center; font-size:15px; font-weight:600;
  object-fit:cover; flex:none;
}
.xwp-avatar.sm{ width:32px; height:32px; font-size:13px; }
.xwp-link{ color:var(--xwp-gold); cursor:pointer; }
.xwp-muted{ color:var(--xwp-ink2); }