/* ==========================================================================
   TY 登录页 · 依赖 ty.tokens.css
   结构：顶栏 + 左品牌栏（终端卡/信息卡）+ 右登录卡
   注意：allow_login_*_captcha 的显隐由模板内 JS 控制，此处不设置 display
   ========================================================================== */

.ty-login {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  /* 品牌粉→蓝整屏氛围。必须 in oklab 插值：sRGB 直接插会在粉蓝之间
     穿过一段发灰发脏的带子，oklab 才是感知均匀路径，中段是干净的淡紫灰。
     强度走 --ty-auth-glow（浅色 .40 / 深色 .10）—— 同一个 alpha 压在
     近黑底上亮度提升远大于压在白底上，不分模式就会深色过曝。
     最后兜一层 var(--ty-bg)，保证玻璃卡片始终有东西可透。 */
  background:
    linear-gradient(in oklab 135deg,
      rgba(var(--ty-blush-rgb), var(--ty-auth-glow)) 0%,
      rgba(var(--ty-mist-rgb), calc(var(--ty-auth-glow) * .75)) 46%,
      rgba(var(--ty-powder-rgb), var(--ty-auth-glow)) 100%),
    var(--ty-bg);
  color: var(--ty-text);
}

.ty-login-canvas {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
}

/* ---------- 顶栏 ---------- */
.ty-login-top {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px clamp(20px, 5vw, 56px);
}

.ty-login-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--ty-text);
  text-decoration: none;
  font-weight: 700;
  font-size: 17px;
  letter-spacing: -.01em;
}

.ty-login-brand img {
  height: 34px;
  width: auto;
  display: block;
  border-radius: 10px;
}

.ty-login-top-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ty-theme-toggle {
  cursor: pointer;
  font: inherit;
  transition: border-color .2s ease, color .2s ease, background-color .2s ease;
}

.ty-theme-toggle:hover {
  border-color: var(--ty-border-2);
  color: var(--ty-text);
}

.ty-theme-toggle .ty-ico {
  width: 14px;
  height: 14px;
  display: block;
}

.ty-theme-toggle .ty-ico-sun { display: none; }
.ty-theme-toggle .ty-ico-auto { display: block; }

.ty-theme-toggle[data-ty-resolved="dark"] .ty-ico-moon { display: none; }
.ty-theme-toggle[data-ty-resolved="dark"] .ty-ico-sun { display: block; }
.ty-theme-toggle[data-ty-resolved="dark"] .ty-ico-auto { display: none; }

/* ---------- 主体两栏 ---------- */
.ty-login-body {
  position: relative;
  z-index: 2;
  flex: 1;
  width: 100%;
  max-width: var(--ty-maxw);
  margin: 0 auto;
  padding: clamp(16px, 4vh, 56px) clamp(20px, 5vw, 56px) 64px;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 440px);
  gap: clamp(32px, 6vw, 80px);
  align-items: center;
}

/* ---------- 左：品牌叙述 ---------- */
.ty-hero-badge {
  margin-bottom: 26px;
}

.ty-hero-title {
  margin: 0 0 14px;
  font-size: clamp(34px, 5.2vw, 58px);
  line-height: 1.06;
  font-weight: 800;
  letter-spacing: -.035em;
  color: var(--ty-text);
}

.ty-hero-title em {
  font-style: normal;
  background: linear-gradient(92deg, var(--ty-text) 8%, var(--ty-text-2) 92%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.ty-hero-sub {
  margin: 0 0 34px;
  max-width: 46ch;
  color: var(--ty-text-2);
  font-size: 15.5px;
  line-height: 1.75;
}

/* 终端窗口卡 */
.ty-term {
  position: relative;
  max-width: 460px;
  border-radius: var(--ty-r-lg);
  overflow: hidden;
  font-family: var(--ty-mono);
}

.ty-term + .ty-term {
  /* 原来是 margin-top:-26px 做压角拼贴，但两张卡边框和底色完全一样，
     重叠读起来像渲染错位而不是有意堆叠。保留水平错位（那是好看的），
     去掉负边距，改成正常间距。 */
  margin-top: clamp(14px, 2.4vh, 22px);
  margin-left: clamp(0px, 7vw, 92px);
  max-width: 420px;
}

.ty-term-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--ty-glass-bd);
  background: rgba(var(--ty-hi-rgb), .05);
}

.ty-term-bar i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--ty-border-2);
}

.ty-term-bar i:nth-child(1) { background: var(--ty-err); opacity: .8; }
.ty-term-bar i:nth-child(2) { background: var(--ty-warn); opacity: .8; }
.ty-term-bar i:nth-child(3) { background: var(--ty-ok); opacity: .8; }

.ty-term-bar span {
  margin-left: 8px;
  font-size: 11.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ty-text-3);
}

.ty-term-body {
  padding: 16px 16px 18px;
  font-size: 12.8px;
  line-height: 1.95;
  color: var(--ty-text-2);
}

.ty-term-body .ty-prompt { color: var(--ty-ok); }
.ty-term-body .ty-cmd { color: var(--ty-text); }
.ty-term-body .ty-out { color: var(--ty-text-3); }
.ty-term-body .ty-link {
  color: var(--ty-text);
  text-decoration: none;
  border-bottom: 1px dashed var(--ty-border-2);
}

/* 信息行（IP/会话卡） */
.ty-kv {
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 4px 14px;
  font-size: 12.6px;
}

.ty-kv dt {
  color: var(--ty-text-3);
  font-weight: 500;
}

.ty-kv dd {
  margin: 0;
  color: var(--ty-text);
  font-variant-numeric: tabular-nums;
  word-break: break-all;
}

/* ---------- 右：登录卡 ---------- */
.ty-login-card {
  position: relative;
  padding: clamp(24px, 3.2vw, 34px);
  border-radius: 22px;
}

.ty-login-card::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  pointer-events: none;
  background: linear-gradient(150deg, var(--ty-border-2), transparent 42%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

.ty-login-title h2 {
  margin: 0 0 6px;
  font-size: 23px;
  font-weight: 750;
  letter-spacing: -.02em;
  color: var(--ty-text);
}

.ty-login-title p {
  margin: 0 0 22px;
  color: var(--ty-text-3);
  font-size: 13.5px;
}

/* 标签页 */
.pink-panel { display: none; }
.pink-panel.active { display: block; }

.ty-tabs {
  display: flex;
  gap: 6px;
  padding: 4px;
  margin-bottom: 20px;
  border-radius: var(--ty-r-pill);
  background: var(--ty-surface-2);
  border: 1px solid var(--ty-border);
}

.ty-tab {
  flex: 1;
  padding: 9px 10px;
  border: 0;
  border-radius: var(--ty-r-pill);
  background: transparent;
  color: var(--ty-text-2);
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease;
}

.ty-tab:hover { color: var(--ty-text); }

.ty-tab.active {
  background: var(--ty-sel-bg);
  color: var(--ty-sel-fg);
}

/* 表单 */
.ty-field { margin-bottom: 14px; }

.ty-field .iam-input-text,
.ty-field input[type="text"],
.ty-field input[type="password"],
.ty-field select {
  width: 100%;
  height: 46px;
  padding: 0 14px;
  border-radius: var(--ty-r) !important;
  border: 1px solid var(--ty-border) !important;
  background: var(--ty-surface-2) !important;
  color: var(--ty-text) !important;
  font: inherit;
  font-size: 14.5px;
  transition: border-color .18s ease, background-color .18s ease;
}

.ty-field .iam-input-text::placeholder { color: var(--ty-text-3); }

.ty-field .iam-input-text:hover,
.ty-field input:hover { border-color: var(--ty-border-2) !important; }

.ty-field .iam-input-text:focus,
.ty-field input:focus,
.ty-field select:focus {
  outline: none;
  border-color: var(--ty-text-3) !important;
  background: var(--ty-surface) !important;
}

.ty-phone-row {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  gap: 10px;
}

.ty-code-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.ty-code-row .input-group-append { display: contents; }

.ty-code-row .btn {
  height: 46px;
  padding: 0 16px;
  border-radius: var(--ty-r) !important;
  border: 1px solid var(--ty-border) !important;
  background: var(--ty-surface-2) !important;
  color: var(--ty-text) !important;
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}

.ty-code-row .btn:hover { border-color: var(--ty-border-2) !important; }
.ty-code-row .btn:disabled { opacity: .55; cursor: not-allowed; }

/* 图形验证码容器（includes/verify 注入） */
.ty-verify {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.ty-verify img {
  border-radius: var(--ty-r-sm);
  border: 1px solid var(--ty-border);
}

/* 提交按钮 */
.ty-submit {
  width: 100%;
  height: 48px;
  margin-top: 6px;
  border: 0;
  border-radius: var(--ty-r);
  background: var(--ty-accent);
  color: var(--ty-on-accent);
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .01em;
  cursor: pointer;
  box-shadow: var(--ty-shadow-sm);
  transition: transform .16s ease, opacity .16s ease, box-shadow .16s ease;
}

.ty-submit:hover {
  transform: translateY(-1px);
  box-shadow: var(--ty-shadow);
}

.ty-submit:active { transform: translateY(0); }

/* 密码/验证码模式互切 */
.ty-switch {
  margin-top: 14px;
  text-align: center;
}

.ty-switch span {
  color: var(--ty-text-2);
  font-size: 13.5px;
  cursor: pointer;
  border-bottom: 1px solid transparent;
}

.ty-switch span:hover {
  color: var(--ty-text);
  border-bottom-color: var(--ty-border-2);
}

/* 底部链接 */
.ty-links {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--ty-border);
  font-size: 13.5px;
}

.ty-links a {
  color: var(--ty-text-2);
  text-decoration: none;
}

.ty-links a:hover { color: var(--ty-text); }

.ty-home-link {
  display: inline-block;
  margin-bottom: 18px;
  color: var(--ty-text-3);
  font-size: 13px;
  text-decoration: none;
}

.ty-home-link:hover { color: var(--ty-text); }

/* 二次验证弹窗 */
#secondVerifyModal .modal-content {
  background: var(--ty-surface);
  border: 1px solid var(--ty-border);
  border-radius: var(--ty-r-lg);
  color: var(--ty-text);
}

#secondVerifyModal .modal-header,
#secondVerifyModal .modal-footer { border-color: var(--ty-border); }

#secondVerifyModal .modal-title { color: var(--ty-text); font-weight: 700; }
#secondVerifyModal .close { color: var(--ty-text-2); text-shadow: none; }
#secondVerifyModal label { color: var(--ty-text-2); }

#secondVerifyModal .form-control,
#secondVerifyModal .iam-input-text {
  background: var(--ty-surface-2) !important;
  border: 1px solid var(--ty-border) !important;
  color: var(--ty-text) !important;
  border-radius: var(--ty-r) !important;
}

#secondVerifyModal .btn-primary {
  background: var(--ty-accent) !important;
  border-color: var(--ty-accent) !important;
  color: var(--ty-on-accent) !important;
  border-radius: var(--ty-r) !important;
}

#secondVerifyModal .btn-outline-light {
  background: transparent !important;
  border: 1px solid var(--ty-border-2) !important;
  color: var(--ty-text-2) !important;
  border-radius: var(--ty-r) !important;
}

/* ---------- 响应式 ---------- */
@media (max-width: 1023.98px) {
  .ty-login-body {
    grid-template-columns: minmax(0, 1fr);
    gap: 40px;
    padding-top: 20px;
  }
  .ty-hero { display: none; }
}

@media (max-width: 575.98px) {
  .ty-login-top { padding: 16px 18px; }
  .ty-login-body { padding: 12px 18px 40px; }
  .ty-login-card { padding: 20px 18px; border-radius: 18px; }
  .ty-phone-row { grid-template-columns: 100px minmax(0, 1fr); }
  .ty-links { flex-direction: column; align-items: flex-start; gap: 8px; }
}


/* ==========================================================================
   认证页（登录 / 注册）· 液态玻璃双栏
   登录：左品牌 右卡片    注册：左卡片 右品牌
   ========================================================================== */
.ty-auth-page {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  /* 显式实底 + 高级灰：顶部提亮、四角压暗的棚拍渐变，
     玻璃要有东西可透，纯白底会让玻璃“消失” */
  background-color: var(--ty-page-1);
  background-image:
    /* 与登录页同一道粉→蓝斜向渐变，两页来回切不会断层；
       强度取 auth-glow 的一半，压在下层棚拍渐变之上、不至于盖掉灰调 */
    linear-gradient(in oklab 135deg,
      rgba(var(--ty-blush-rgb), calc(var(--ty-auth-glow) * .55)) 0%,
      rgba(var(--ty-mist-rgb), calc(var(--ty-auth-glow) * .40)) 46%,
      rgba(var(--ty-powder-rgb), calc(var(--ty-auth-glow) * .55)) 100%),
    radial-gradient(ellipse 80% 50% at 50% -14%, var(--ty-page-2), transparent 60%),
    radial-gradient(ellipse 42% 30% at 86% 4%, rgba(var(--ty-hi-rgb), .030), transparent 62%),
    radial-gradient(ellipse 55% 40% at 6% 96%, rgba(var(--ty-hi-rgb), .022), transparent 64%);
}

/* 背景：网格 + 两处柔光，玻璃要有东西可透 */
.ty-auth-page::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(var(--ty-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--ty-grid) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: radial-gradient(ellipse 90% 80% at 50% 45%, #000 25%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 90% 80% at 50% 45%, #000 25%, transparent 78%);
}

.ty-auth-page::after {
  content: "";
  position: absolute;
  inset: -20%;
  pointer-events: none;
  /* 注册页与登录页共用同一对品牌色，两页切换时氛围不断层。
     原来是 accent(近黑) + info(蓝)，在深色下近黑光晕等于没有。 */
  background:
    radial-gradient(circle at 18% 22%, rgba(var(--ty-blush-rgb), calc(var(--ty-auth-glow) * .34)), transparent 36%),
    radial-gradient(circle at 82% 70%, rgba(var(--ty-powder-rgb), calc(var(--ty-auth-glow) * .36)), transparent 38%);
}

.ty-auth-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 460px);
  gap: clamp(28px, 5vw, 72px);
  align-items: center;
  max-width: 1180px;
  min-height: 100vh;
  margin: 0 auto;
  padding: clamp(24px, 4vw, 56px) clamp(18px, 4vw, 40px);
}

/* 注册：卡片在左，品牌在右 */
.ty-auth--register .ty-auth-grid {
  grid-template-columns: minmax(360px, 500px) minmax(0, 1fr);
}

.ty-auth--register .ty-auth-card { order: 1; }
.ty-auth--register .ty-auth-hero { order: 2; }

.ty-auth-card {
  padding: clamp(22px, 3vw, 34px);
  border-radius: 24px;
}

.ty-auth-card-head h1 {
  margin: 0 0 6px;
  font-size: 22px;
  font-weight: 750;
  letter-spacing: -.025em;
  color: var(--ty-text);
}

.ty-auth-card-head p {
  margin: 0 0 22px;
  color: var(--ty-text-3);
  font-size: 13.5px;
}

.ty-auth-hero { position: relative; }

.ty-auth-hero .ty-eyebrow { margin-bottom: 24px; }

.ty-auth-foot {
  position: relative;
  z-index: 2;
  padding: 0 20px 26px;
  color: var(--ty-text-3);
  font-size: 13px;
}

/* 注册卡内部：厂商的 .qrebg 再套一层白卡，这里拆掉 */
.ty-auth-card .qrebg {
  background: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}

.ty-auth-card .item {
  display: none;
}

/* 页签做成胶囊，与登录页一致 */
.ty-auth-card .affs-nav,
.ty-auth-card .nav-tabs-custom {
  display: flex;
  gap: 4px;
  padding: 4px;
  margin-bottom: 22px;
  border: 1px solid var(--ty-glass-bd) !important;
  border-radius: 999px;
  background: var(--ty-surface-2);
}

.ty-auth-card .nav-tabs-custom .nav-item {
  flex: 1;
  border: 0 !important;
}

.ty-auth-card .nav-tabs-custom .nav-link {
  display: block;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 9px 10px !important;
  text-align: center;
  white-space: nowrap;
  color: var(--ty-text-2) !important;
  font-size: 13.5px !important;
  font-weight: 600;
  background: transparent;
}

.ty-auth-card .nav-tabs-custom .nav-item .nav-link.active,
.ty-auth-card .nav-tabs-custom .nav-link.active {
  background: var(--ty-sel-bg) !important;
  color: var(--ty-sel-fg) !important;
  border-bottom: 0 !important;
}

.ty-auth-card label {
  display: block;
  margin-bottom: 7px;
  color: var(--ty-text-2);
  font-size: 13px;
  font-weight: 600;
}

.ty-auth-card .form-group { margin-bottom: 15px; }

.ty-auth-card .form-control {
  height: 46px;
  border-radius: 12px !important;
}

.ty-auth-card .input-group > .form-control {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.ty-auth-card .input-group-append .btn {
  height: 46px;
  border-radius: 0 12px 12px 0 !important;
  white-space: nowrap;
}

.ty-auth-card button[type="submit"] {
  width: 100%;
  height: 48px;
  margin-top: 6px;
  border-radius: 12px !important;
  font-weight: 700;
}

.ty-auth-card .custom-control {
  flex-direction: row;
  justify-content: center;
  gap: 8px;
  min-height: auto;
  margin-top: 18px;
}

.ty-auth-card .custom-control-label { font-size: 13px; }

.ty-auth-card .mt-5.text-center:last-of-type {
  margin-top: 18px !important;
  padding-top: 18px;
  border-top: 1px solid var(--ty-glass-bd);
  font-size: 13.5px;
  color: var(--ty-text-3);
}

@media (max-width: 1023.98px) {
  .ty-auth-grid,
  .ty-auth--register .ty-auth-grid {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    padding-top: 28px;
    padding-bottom: 44px;
  }
  .ty-auth-hero { display: none; }
  .ty-auth--register .ty-auth-card { order: 0; }
}

@media (max-width: 575.98px) {
  .ty-auth-card { border-radius: 18px; padding: 18px 16px; }
}


/* 灰底之上，玻璃卡的描边稍微提亮，避免边界糊掉 */
.ty-auth-page .ty-glass {
  border-color: var(--ty-panel-line);
}

.ty-auth-page .ty-kv dt { min-width: 68px; }
.ty-auth-page .ty-kv dd { font-size: 12.4px; }


/* 认证页品牌栏里的两张终端卡：错位但不重叠，
   登录页那张靠内容撑高可以压边，注册页文字短会被遮住 */
.ty-auth-hero .ty-term + .ty-term {
  margin-top: 16px;
  margin-left: clamp(0px, 4vw, 54px);
}

.ty-auth-hero .ty-term-body { padding-bottom: 20px; }


/* ------------------------------------------------- 认证页独立顶栏
   只放品牌与主题切换，不带站点菜单 */
.ty-auth-top {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px clamp(20px, 5vw, 56px);
}

.ty-auth-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ty-text);
  font-size: 16.5px;
  font-weight: 700;
  letter-spacing: -.02em;
  text-decoration: none;
}

.ty-auth-brand img {
  height: 30px;
  width: auto;
  display: block;
}

.ty-login .ty-auth-top {
  position: relative;
  z-index: 3;
}


/* 深色下玻璃卡要"压得住"：卡面比页面略亮一点点，描边给实 */
:root[data-theme="dark"] .ty-glass,
.ty-glass {
  border-color: var(--ty-glass-bd);
}

.ty-auth-card,
.ty-login-card,
.ty-term {
  background-color: var(--ty-panel);
  background-image: linear-gradient(158deg, var(--ty-glass-1), var(--ty-glass-2));
  border-color: var(--ty-panel-line);
}

/* 输入框在深色卡上要抬起来，不能和卡面一个色 */
.ty-field .iam-input-text,
.ty-auth-card .form-control,
.ty-auth-card select {
  background: var(--ty-surface-2) !important;
  border: 1px solid rgba(var(--ty-hi-rgb), .12) !important;
}

.ty-field .iam-input-text:hover,
.ty-auth-card .form-control:hover {
  border-color: rgba(var(--ty-hi-rgb), .20) !important;
}

/* 主按钮：给一点纵向层次和柔光，避免深色下是一块死白 */
.ty-submit,
.ty-auth-card button[type="submit"] {
  background: linear-gradient(180deg, var(--ty-accent), var(--ty-accent-2)) !important;
  box-shadow: 0 10px 26px rgba(var(--ty-glow-rgb), .38) !important;
}

.ty-submit:hover,
.ty-auth-card button[type="submit"]:hover {
  box-shadow: 0 14px 34px rgba(var(--ty-glow-rgb), .46) !important;
}

/* 聚焦环：深色下用描边提亮，不用大面积白晕 */
.ty-field .iam-input-text:focus,
.ty-auth-card .form-control:focus {
  border-color: rgba(var(--ty-hi-rgb), .34) !important;
  box-shadow: 0 0 0 3px rgba(var(--ty-hi-rgb), .07) !important;
}


/* ------------------------------------------------- 认证页主题切换
   独立顶栏已去掉（品牌块也不要了），按钮收进卡片右上角 */
.ty-login-card,
.ty-auth-card {
  position: relative;
}

.ty-auth-theme {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
  height: 30px;
  padding: 0 10px;
  font-size: 12.5px;
  background: var(--ty-surface-2) !important;
  border-color: var(--ty-border) !important;
}

.ty-login-card > .ty-home-link,
.ty-auth-card .ty-auth-card-head {
  padding-right: 96px;
}

@media (max-width: 575.98px) {
  .ty-auth-theme { top: 12px; right: 12px; }
}


/* ============================================================ 认证页满屏
   厂商 .page-content 有 padding: 94px 顶 / 60px 底，是为 fixed 顶栏预留的。
   认证页顶栏和导航条都不输出，这 154px 就变成上下两条空档。
   注意：之前用 body:has(.ty-topnav) 覆盖，但认证页压根不渲染导航条，
   :has() 不成立，所以那条规则从未生效。 */
body[data-ty-auth] .page-content,
body[data-ty-auth] .main-content,
body[data-ty-auth] .container-fluid {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body[data-ty-auth] .page-content {
  min-height: 100vh;
}

body[data-ty-auth] .main-content {
  min-height: 100vh;
  /* 认证页整屏出血，兜底色要和 .ty-login 一致，
     否则任何一像素没盖住都会露出灰底 */
  background: var(--ty-bg) !important;
}

/* 认证页必须整屏出血。ty.vendor.css 给 .page-content > .container-fluid
   加了 max-width:1440px + 左右 clamp 内距（那是给会员端内容页做 YXVM 留白的），
   登录页被压成 1376px 居中，两侧露出 .main-content 的 #f5f6f8 灰底；
   换成方向性渐变之后，这个宽度约束直接暴露成两条竖接缝。
   内部 .ty-login-body 自己有 max-width + margin:auto + 内距，
   所以摘掉外层帽子内容不会散开。 */
body[data-ty-auth] .page-content > .container-fluid {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ===== TY-CHECKFIX 2026-10-07 注册页"我已阅读并同意"勾选框点不中 =====
   根因：.custom-control 是 flex 且 justify-content:center 把 label 推到中间，
   而可见方框 label::before 用 left:-1.5rem 跟随 label，透明 input 却是相对
   容器 left:0 —— 实测两者 x 相差 108px，点"看得见的框"永远点不到 input。
   解法：容器改 inline-flex + margin auto 居中，保留 Bootstrap 的 1.5rem 轨道，
   让 input / ::before / ::after 三者回到同一坐标。 */
.ty-auth-card .custom-control {
  display: inline-flex;
  align-items: flex-start;
  justify-content: flex-start;   /* 覆盖掉旧的 center，居中改由 margin auto 负责 */
  gap: 0;
  padding-left: 1.5rem;          /* Bootstrap 轨道，::before 的 left:-1.5rem 依赖它 */
  min-height: 1.21875rem;
  margin: 18px auto 0;
}
.ty-auth-card .custom-control-input {
  position: absolute;            /* 关键：别处把它改成了 relative，于是 input 掉进 flex 流里
                                    当了首个条目，把 label 推右 16px，可见框与命中区错开 7px */
  left: 0;
  width: 1rem;
  height: 1rem;
  opacity: 0;
  z-index: 0;                    /* 原来是 -1，会被卡片背景盖住命中测试 */
}
.ty-auth-card .custom-control-label::after { pointer-events: none; }  /* 否则 ::after 吞掉直点 */
.ty-auth-card .custom-control-label {
  display: inline;               /* 覆盖全局 .ty-auth-card label{display:block} */
  font-size: 13px;
  line-height: 1.35;
  padding-top: 1px;
  cursor: pointer;
}
/* 未选中：跟随主题令牌，不再是 Bootstrap 硬编码白块 */
.ty-auth-card .custom-control-label::before {
  background-color: var(--ty-surface-2);
  border: 1px solid var(--ty-border-2);
  border-radius: 5px;
  top: 2px;
}
/* 选中：品牌粉 + 深色勾，压过 app.min.css 的 transparent !important */
.ty-auth-card .custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--pink-main) !important;
  border-color: var(--pink-main) !important;
}
.ty-auth-card .custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
  content: "";
  top: 2px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23ffffff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 50% 50%;
}
.ty-auth-card .custom-control-input:focus-visible ~ .custom-control-label::before {
  box-shadow: 0 0 0 3px var(--ty-ring) !important;
}
/* 触屏放大命中区：透明 input 撑到 28px，视觉上仍是 16px 框 */
@media (max-width: 767.98px) {
  .ty-auth-card .custom-control-input { width: 28px; height: 28px; left: -6px; top: -4px; }
  .ty-auth-card .custom-control { padding-left: 2rem; }
  .ty-auth-card .custom-control-label::before,
  .ty-auth-card .custom-control-label::after { left: -1.75rem; }
}
/* ===== TY-CHECKFIX2 2026-10-07 抵消厂商 ID 补丁 =====
   change.qr.css 里有 #agreePrivacy{position:relative;top:4px}，
   ID 权重(1,0,0)必然压过类选择器，导致 input 掉回文档流、与可见方框错开 7px，
   点方框右半边是死区。用更高权重的 .ty-auth-card #id + 后加载抵消，不堆 !important。 */
.ty-auth-card #agreePrivacy,
.ty-auth-card #agreePrivacy:checked {
  position: absolute;
  top: auto;
  left: 0;
  width: 1rem;
  height: 1rem;
  opacity: 0;
  z-index: 0;
}

/* ===== TY-CHECKFIX3 2026-10-07 焦点态边框收进令牌 =====
   Bootstrap 的 :focus:not(:checked) 会把边框刷成 #b1bbc4，
   暗色下鼠标点一下就出现一圈亮灰描边，过吵。 */
.ty-auth-card .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
  border-color: var(--ty-border-2);
}
/* ----------------------------------------------------
   登录/注册页专属暗色模式（柔粉 × 梅紫灰）
   ---------------------------------------------------- */
html[data-theme= dark] .ty-auth-page,
body[data-theme=dark] .ty-auth-page,
[data-theme=dark] .ty-auth {
  background: #1c1720 !important;
  color: #f5edf3 !important;
}

html[data-theme=dark] .ty-login-card,
html[data-theme=dark] .ty-auth-card,
[data-theme=dark] .ty-glass {
  background: rgba(37, 32, 41, 0.94) !important;
  border-color: #352c38 !important;
  color: #f5edf3 !important;
}

html[data-theme=dark] .ty-login-title h2,
html[data-theme=dark] .ty-auth-title,
[data-theme=dark] .ty-login-title h2 {
  color: #f5edf3 !important;
}

html[data-theme=dark] .form-control,
[data-theme=dark] .form-control {
  background-color: #2c2531 !important;
  border-color: #483a4c !important;
  color: #f5edf3 !important;
}

html[data-theme=dark] .pink-tab.active,
[data-theme=dark] .pink-tab.active {
  background: #342732 !important;
  color: #df88aa !important;
  border-color: #4d3647 !important;
}


/* ===== TY-AUTH-TOPBAR 2026-10-11 登录/注册卡：回到首页左上、日夜切换右上 =====
   ty.nav.css 里 `.ty-theme-toggle{position:relative!important}`（给顶栏胶囊按钮做事件
   穿透保护）把登录卡内的切换按钮也拽回文档流，结果它跑到左边、把"← 回到首页"挤到右边。
   这里给登录/注册卡内的按钮重新钉回右上角：用 `.ty-login-card/.ty-auth-card` 前缀把权重
   提到 (0,2,0)+!important，压过那条 (0,1,0) 的规则。切换按钮出流后，"回到首页"自然回到左上。 */
.ty-login-card .ty-auth-theme,
.ty-auth-card .ty-auth-theme {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  left: auto !important;
  z-index: 6;
}
.ty-login-card > .ty-home-link,
.ty-auth-card .ty-home-link {
  display: inline-block;
  padding-right: 104px;
}


/* ============================================================ TY-AUTH-PAIR
   2026-10-12 「← 回到首页」做成与右上「跟随系统」同款胶囊：同一行、一左一右。
   两者共用 var(--ty-surface-2)+var(--ty-border)+999px 胶囊，卡片顶部让出这一行高度。 */
.ty-login-card { padding-top: 64px !important; }

.ty-login-card .ty-home-link {
  position: absolute !important;
  top: 16px !important;
  left: 16px !important;
  right: auto !important;
  z-index: 2;
  display: inline-flex !important;
  align-items: center !important;
  height: 30px !important;
  padding: 0 10px !important;
  margin-bottom: 0 !important;
  border: 1px solid var(--ty-border) !important;
  border-radius: 999px !important;
  background: var(--ty-surface-2) !important;
  color: var(--ty-text-2) !important;
  font-size: 12.5px !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: color .18s ease, border-color .18s ease, background-color .18s ease;
}

.ty-login-card .ty-home-link:hover {
  color: var(--ty-text) !important;
  border-color: var(--ty-border-2) !important;
  text-decoration: none !important;
}

@media (max-width: 575.98px) {
  .ty-login-card { padding-top: 58px !important; }
  .ty-login-card .ty-home-link { top: 12px !important; left: 12px !important; }
}