/* ============================================================
   14280 mobile-shell.css  ·  2026-10-08
   ① 账号入口统一：常驻顶栏右上角（金色胶囊），全站 5 页一致
   ② 移动端：底部 Tab 主导航 + 顶栏压缩单行
   叠加层，不改站点基线。回滚 = 删本文件 + 移除各页引用行
   类名前缀 mshell-  （不与站点已有语义类名冲突）
   ============================================================ */

:root{
  --mshell-gold:#d7b56d;
  --mshell-gold-b:#e2c47e;
  --mshell-gold-d:#b9944c;
  --mshell-hair:rgba(215,181,109,.34);
  --mshell-ink:#f6efdd;
}

@keyframes mshell-breathe{
  0%,100%{ box-shadow:0 8px 24px -14px rgba(215,181,109,.55), inset 0 1px 0 rgba(255,255,255,.14); }
  50%    { box-shadow:0 10px 30px -10px rgba(215,181,109,.95), inset 0 1px 0 rgba(255,255,255,.22); }
}

/* ============================================================
   ① 账号入口 —— 顶栏常驻胶囊
   ============================================================ */

/* 1a. 子页原有 #cornerAuth：解除左下角 fixed，改挂进顶栏右侧 */
.corner-auth.mshell-inline{
  position:relative !important;
  left:auto !important; right:auto !important;
  top:auto !important; bottom:auto !important;
  z-index:6 !important;
  margin:0 0 0 12px !important;
  display:flex !important; align-items:center !important;
  font-family:var(--font-ui,inherit);
}
.corner-auth.mshell-inline > .ca-card{
  position:absolute !important;
  right:0 !important; left:auto !important;
  top:calc(100% + 10px) !important; bottom:auto !important;
  z-index:1300 !important;
}

/* 未登录：金色高亮 + 呼吸微光（已登录时 innerHTML 内含 .ca-card） */
.corner-auth.mshell-inline > .ca-login-btn{
  padding:9px 18px !important;
  border-radius:999px !important;
  border:1px solid var(--mshell-hair) !important;
  background:linear-gradient(180deg,rgba(226,196,126,.20),rgba(185,148,76,.09)) !important;
  color:var(--mshell-ink) !important;
  font-size:13px !important; font-weight:700 !important; letter-spacing:.04em !important;
  box-shadow:0 8px 24px -14px rgba(215,181,109,.6), inset 0 1px 0 rgba(255,255,255,.14) !important;
  backdrop-filter:blur(10px);
  transition:transform .2s, box-shadow .2s, border-color .2s;
}
.corner-auth.mshell-inline > .ca-login-btn:hover{
  transform:translateY(-1px);
  border-color:var(--mshell-gold) !important;
  box-shadow:0 14px 34px -14px rgba(215,181,109,.9), inset 0 1px 0 rgba(255,255,255,.2) !important;
}
.corner-auth.mshell-inline > .ca-login-btn .ca-ico{
  font-size:15px !important;
  filter:drop-shadow(0 0 6px rgba(215,181,109,.75)) !important;
}
.corner-auth.mshell-inline:not(:has(.ca-card)) > .ca-login-btn{ animation:mshell-breathe 3.6s ease-in-out infinite; }
.corner-auth.mshell-inline:has(.ca-card) > .ca-login-btn{
  background:rgba(12,13,12,.9) !important;
  border-color:var(--mshell-hair) !important;
  box-shadow:0 6px 20px -14px rgba(0,0,0,.9) !important;
}
/* 挂件内部：粉→金统一（--zap-magenta 未被全局主题重映射） */
.corner-auth .ca-avatar{
  background:linear-gradient(135deg,var(--mshell-gold-b),var(--mshell-gold-d)) !important;
  color:#16120a !important;
}
.corner-auth .ca-actions a:hover,
.corner-auth .ca-actions button:hover{
  border-color:var(--mshell-hair) !important;
  background:rgba(215,181,109,.12) !important;
  color:#fff !important;
}

/* 1b. 无账号入口的页（dashboard / players）：注入同款胶囊 */
.mshell-acct{ display:inline-flex; align-items:center; }
.mshell-acct > a{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 16px; border-radius:999px; text-decoration:none;
  border:1px solid var(--mshell-hair);
  background:linear-gradient(180deg,rgba(226,196,126,.18),rgba(185,148,76,.08));
  color:var(--mshell-ink); font-size:13px; font-weight:700; letter-spacing:.04em;
  box-shadow:0 8px 24px -14px rgba(215,181,109,.7), inset 0 1px 0 rgba(255,255,255,.14);
  transition:transform .2s, border-color .2s;
}
.mshell-acct > a:hover{ transform:translateY(-1px); border-color:var(--mshell-gold); color:#fff0c9; }
.mshell-acct .ms-av{
  flex:none; width:22px; height:22px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--mshell-gold-b),var(--mshell-gold-d));
  color:#16120a; font-size:12px; font-weight:800;
}
.mshell-acct.is-guest > a{ animation:mshell-breathe 3.6s ease-in-out infinite; }
.mshell-acct.is-guest .ms-av{ display:none; }

/* 1c. 首页自带账号区：统一成金色胶囊 */
body.cinematic-main .account-btn,
.account-cluster .account-btn{
  border:1px solid var(--mshell-hair) !important;
  background:linear-gradient(180deg,rgba(226,196,126,.20),rgba(185,148,76,.09)) !important;
  color:var(--mshell-ink) !important;
  box-shadow:0 8px 24px -14px rgba(215,181,109,.7), inset 0 1px 0 rgba(255,255,255,.14) !important;
  font-weight:700 !important;
}
.account-cluster.is-guest .account-btn{ animation:mshell-breathe 3.6s ease-in-out infinite; }
.account-cluster .account-btn:hover{ border-color:var(--mshell-gold) !important; color:#fff0c9 !important; }

/* ============================================================
   ② 移动端底部 Tab 栏
   ============================================================ */

.mshell-tabs{ display:none; }

@media (max-width:760px){

  /* 顶栏水平导航交给底部 Tab，顶部不再横滑 */
  body.mshell-on #mainNav,
  body.mshell-on .navbar,
  body.mshell-on nav.topbar .nav-links{ display:none !important; }

  body.mshell-on{ padding-bottom:calc(64px + env(safe-area-inset-bottom,0px)) !important; }

  .mshell-tabs{
    display:grid; grid-template-columns:repeat(5,1fr);
    position:fixed; left:0; right:0; bottom:0; z-index:1400;
    background:rgba(9,10,10,.965);
    -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
    border-top:1px solid var(--mshell-hair);
    padding:7px 0 calc(7px + env(safe-area-inset-bottom,0px));
  }
  .mshell-tab{
    display:flex; flex-direction:column; align-items:center; gap:4px;
    text-decoration:none; color:#7e7c76;
    font-size:11px; font-weight:500; letter-spacing:.02em;
    padding:2px 0; -webkit-tap-highlight-color:transparent;
  }
  .mshell-tab svg{ width:21px; height:21px; display:block; }
  .mshell-tab.is-on{ color:var(--mshell-gold-b); }
  .mshell-tab.is-on svg{ filter:drop-shadow(0 0 7px rgba(215,181,109,.7)); }
  .mshell-tab.is-cta{ color:var(--mshell-gold-b); }
  .mshell-tab.is-cta .mt-label{ font-weight:700; }

  /* 顶栏压缩为单行 */
  body.mshell-on #mainTopbar,
  body.mshell-on .topbar{
    padding-top:11px !important; padding-bottom:10px !important;
    gap:8px !important; flex-wrap:nowrap !important;
  }
  body.mshell-on #mainTopbar .topbar-right,
  body.mshell-on .topbar .topbar-right{
    margin-left:auto !important; gap:8px !important;
    flex-wrap:nowrap !important; justify-content:flex-end !important;
  }
  body.mshell-on .badge-demo{ display:none !important; }
  body.mshell-on .badge-updated{ font-size:9px !important; letter-spacing:.06em !important; }

  /* 首页顶栏（cinematic）：隐藏横滑导航，压成单行 */
  body.mshell-on.cinematic-main .topbar-inner{
    display:flex !important; flex-wrap:nowrap !important;
    align-items:center !important; justify-content:space-between !important;
    min-height:0 !important; padding:10px 18px !important; gap:10px !important;
  }
  body.mshell-on.cinematic-main .account-cluster{ width:auto !important; margin:0 !important; }
  body.mshell-on.cinematic-main .account-state{ display:none !important; }
  body.mshell-on.cinematic-main .topbar{ position:sticky; }

  /* 挂件内胶囊移动端略收 */
  .corner-auth.mshell-inline > .ca-login-btn{ padding:8px 13px !important; font-size:12px !important; }
  .corner-auth.mshell-inline{ margin-left:8px !important; }
  .mshell-acct > a{ padding:7px 13px; font-size:12px; }

  /* 移动端正文不再被顶栏横滑撑宽 */
  body.mshell-on .wrap{ padding-bottom:24px !important; }

  /* 表单：桌面是「表格型两列 grid + 横向滚动」，手机端改为上下堆叠全宽
     （根因：.public-form-fields{min-width:430px} + grid 166px/minmax(240px,1fr)） */
  body.mshell-on .public-form-scroll{ overflow-x:visible !important; }
  body.mshell-on .public-form-fields{ display:block !important; min-width:0 !important; width:100% !important; }
  body.mshell-on .public-form-fields .auth-field,
  body.mshell-on .public-form-fields .field{
    display:block !important; width:100% !important; min-width:0 !important;
  }
  body.mshell-on .public-form-fields .auth-field > label,
  body.mshell-on .public-form-fields .field > label{
    display:block !important; width:auto !important;
    margin:0 0 6px !important; white-space:normal !important;
  }
  body.mshell-on .public-form-fields input,
  body.mshell-on .public-form-fields select,
  body.mshell-on .public-form-fields textarea{
    display:block !important; width:100% !important; min-width:0 !important;
    max-width:100% !important; box-sizing:border-box !important;
  }
  body.mshell-on .public-form-fields .auth-field small,
  body.mshell-on .public-form-fields .field small{ width:auto !important; }

  /* 个人资料表单（pf-*）同样堆叠 */
  body.mshell-on .profile-form .pf-basic{ overflow-x:visible !important; }
  body.mshell-on .profile-form .pf-basic .pf-row{
    display:block !important; min-width:0 !important; width:100% !important;
  }
  body.mshell-on .profile-form .pf-basic .pf-label{
    display:block !important; margin:0 0 6px !important; white-space:normal !important;
  }
  body.mshell-on .profile-form .pf-basic input,
  body.mshell-on .profile-form .pf-basic select,
  body.mshell-on .profile-form .pf-basic textarea{
    display:block !important; width:100% !important; min-width:0 !important; box-sizing:border-box !important;
  }

  /* 战队报名成员行 */
  body.mshell-on .sf-row.player-row{ min-width:0 !important; grid-template-columns:1fr !important; }
}

@media (max-width:420px){
  .mshell-tab{ font-size:10px; }
  .mshell-tab svg{ width:19px; height:19px; }
  body.mshell-on .badge-updated{ display:none !important; }
}

@media (prefers-reduced-motion:reduce){
  .corner-auth.mshell-inline:not(:has(.ca-card)) > .ca-login-btn,
  .mshell-acct.is-guest > a,
  .account-cluster.is-guest .account-btn{ animation:none !important; }
}