/* ============================================================
   GOAT27 领头羊27 —— 视觉系统 v2
   固定配色（不可改动）：
     页面底色 #0B0D10 · 卡片 #151920 · 次级 #1E242D
     品牌橙金 #F5A623 · 主要文字 #F5F7FA · 次要文字 #929BA8
     成功 #2DBE7F · 错误 #F05252 · 分隔线 #2A303A
   仅调整视觉表达，不改动任何业务逻辑与 DOM 契约。
   ============================================================ */

/* ============================================================
   0 · 设计令牌
   ============================================================ */

:root {
  /* 底色层 */
  --bg: #0b0d10;
  --card: #151920;
  --sub: #1e242d;
  --sub-2: #232a34;
  --line: #2a303a;

  /* 描边与高光 */
  --hair: rgba(255, 255, 255, 0.055);
  --hair-2: rgba(255, 255, 255, 0.09);
  --inset-top: inset 0 1px 0 rgba(255, 255, 255, 0.05);

  /* 品牌橙金 */
  --gold: #f5a623;
  --gold-2: #ffc85a;
  --gold-3: #c17d0c;
  --gold-ink: #1b1204;
  --gold-soft: rgba(245, 166, 35, 0.12);
  --gold-soft-2: rgba(245, 166, 35, 0.2);
  --gold-line: rgba(245, 166, 35, 0.38);
  --gold-grad: linear-gradient(135deg, #ffc85a 0%, #f5a623 52%, #d98a0d 100%);
  --gold-grad-soft: linear-gradient(140deg, rgba(245, 166, 35, 0.16), rgba(245, 166, 35, 0) 62%);

  /* 文字层级 */
  --txt: #f5f7fa;
  --txt-2: #929ba8;
  --txt-3: #7b8592;

  /* 语义色 */
  --ok: #2dbe7f;
  --ok-soft: rgba(45, 190, 127, 0.12);
  --ok-line: rgba(45, 190, 127, 0.34);
  --err: #f05252;
  --err-soft: rgba(240, 82, 82, 0.12);
  --err-line: rgba(240, 82, 82, 0.36);

  /* 阴影 / 光 */
  --sh-1: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 22px -16px rgba(0, 0, 0, 0.9);
  --sh-2: 0 2px 6px rgba(0, 0, 0, 0.42), 0 20px 44px -26px rgba(0, 0, 0, 0.95);
  --sh-gold: 0 10px 28px -14px rgba(245, 166, 35, 0.55);
  --ring-gold: 0 0 0 3px rgba(245, 166, 35, 0.14);

  /* 圆角 */
  --radius: 16px;
  --radius-sm: 12px;
  --radius-xs: 9px;
  --radius-pill: 999px;

  /* 节奏 */
  --gutter: 16px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

/* ============================================================
   1 · 基础
   ============================================================ */

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html {
  background: var(--bg);
  -webkit-text-size-adjust: 100%;
}

html, body {
  margin: 0;
  padding: 0;
  color: var(--txt);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "PingFangSC",
               "HarmonyOS Sans SC", "Microsoft YaHei", "Noto Sans", sans-serif;
  font-size: 14px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overscroll-behavior-y: none;
}

body {
  min-height: 100vh;
  padding-bottom: calc(96px + var(--safe-bottom));
  /* 顶部一层极淡的暖光，给纯黑底一点空间纵深 */
  background-color: var(--bg);
  background-image:
    radial-gradient(760px 420px at 50% -220px, rgba(245, 166, 35, 0.1), transparent 72%),
    radial-gradient(520px 320px at 108% 4%, rgba(245, 166, 35, 0.045), transparent 70%),
    radial-gradient(600px 420px at -12% 26%, rgba(45, 190, 127, 0.035), transparent 70%);
  background-repeat: no-repeat;
}

::selection { background: rgba(245, 166, 35, 0.28); color: #fff; }

:focus-visible {
  outline: 2px solid var(--gold-line);
  outline-offset: 2px;
}

/* 细滚动条（省/市/区、日志、抽屉内部） */
* {
  scrollbar-width: thin;
  scrollbar-color: #333b46 transparent;
}
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: #333b46;
  border-radius: 99px;
}
::-webkit-scrollbar-thumb:hover { background: #414b58; }

/* ============================================================
   2 · 工具类
   ============================================================ */

.num {
  font-family: Montserrat, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  letter-spacing: 0.2px;
}
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; }

.gold { color: var(--gold); }
.ok { color: var(--ok); }
.err { color: var(--err); }
.dim { color: var(--txt-2); }
.dimmer { color: var(--txt-3); }
.hidden { display: none !important; }

small {
  font-size: 12px;
  color: var(--txt-2);
  font-weight: 700;
  margin-left: 4px;
  letter-spacing: 0.4px;
}

/* 数字渐变（大额金额用） */
.grad-num {
  background: var(--gold-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ============================================================
   3 · 顶栏
   ============================================================ */

.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px var(--gutter);
  background: rgba(11, 13, 16, 0.82);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border-bottom: 1px solid var(--line);
}
.topbar.show { display: flex; }
/* 顶栏品牌区：左 logo + 右侧上下两行文字 */
.topbar .brand {
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 9px;
  align-items: center;
  min-width: 0;
}
.topbar .brand-logo {
  grid-column: 1;
  grid-row: 1 / span 2;
  flex: none;
  width: 28px;
  height: 28px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 2px 8px rgba(245, 166, 35, 0.28));
}
.topbar .brand > b {
  grid-column: 2;
  grid-row: 1;
}
.topbar .brand > span {
  grid-column: 2;
  grid-row: 2;
}

/* 语言切换（顶栏最右） */
.lang-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 32px;
  padding: 0 10px;
  font-family: Montserrat, -apple-system, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.8px;
  line-height: 1;
  color: var(--gold);
  background: rgba(245, 166, 35, 0.1);
  border: 1px solid var(--gold-line);
  border-radius: var(--radius-pill);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  box-shadow: var(--inset-top);
  transition: background 0.16s, color 0.16s, border-color 0.16s, transform 0.12s;
}
.lang-btn:hover { background: rgba(245, 166, 35, 0.18); }
.lang-btn:active { transform: scale(0.94); }
.lang-btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.lang-btn.on {
  color: #17120a;
  background: var(--gold-grad);
  border-color: transparent;
}

.brand { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.brand b {
  font-family: Montserrat, -apple-system, sans-serif;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: 1px;
  line-height: 1.1;
  background: var(--gold-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 3px 12px rgba(245, 166, 35, 0.3));
}
.brand span {
  font-size: 12px;
  color: var(--txt-3);
  letter-spacing: 1.2px;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.wallet-chip {
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #1f252f, var(--sub));
  padding: 7px 12px;
  border-radius: var(--radius-pill);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--txt);
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  box-shadow: var(--inset-top);
  transition: border-color 0.16s, box-shadow 0.16s, transform 0.12s;
}
.wallet-chip:active { transform: scale(0.97); }
.wallet-chip .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--txt-3);
  transition: background 0.2s;
}
.wallet-chip.on {
  border-color: var(--ok-line);
  color: #d8f5e7;
}
.wallet-chip.on .dot {
  background: var(--ok);
  box-shadow: 0 0 0 3px rgba(45, 190, 127, 0.16), 0 0 8px rgba(45, 190, 127, 0.9);
}

/* ============================================================
   4 · 底部 Tab（悬浮胶囊）
   ============================================================ */

.tabbar {
  position: fixed;
  left: 10px;
  right: 10px;
  bottom: calc(9px + var(--safe-bottom));
  z-index: 40;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  background: rgba(21, 25, 32, 0.9);
  border: 1px solid var(--line);
  border-radius: 20px;
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  box-shadow:
    0 18px 40px -20px rgba(0, 0, 0, 0.95),
    0 0 0 1px rgba(255, 255, 255, 0.02) inset,
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  overflow: hidden;
}

.tab {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 9px 0 10px;
  font-size: 12px;
  letter-spacing: 0.2px;
  color: var(--txt-3);
  cursor: pointer;
  transition: color 0.18s, transform 0.14s;
  user-select: none;
}
.tab:active { transform: scale(0.95); }

.tab svg {
  width: 21px;
  height: 21px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: filter 0.18s, transform 0.18s;
}

.tab.active { color: var(--gold); font-weight: 800; }
.tab.active svg {
  transform: translateY(-1px);
  filter: drop-shadow(0 0 7px rgba(245, 166, 35, 0.55));
}
.tab.active::after {
  content: "";
  position: absolute;
  bottom: 4px;
  left: 50%;
  margin-left: -2px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px 1px rgba(245, 166, 35, 0.7);
}
/* 选中态的柔和底光 */
.tab.active::before {
  content: "";
  position: absolute;
  inset: 5px 8px auto;
  height: 34px;
  border-radius: 12px;
  background: radial-gradient(60% 100% at 50% 0%, rgba(245, 166, 35, 0.16), transparent 72%);
  pointer-events: none;
}

/* ============================================================
   5 · 页面容器
   ============================================================ */

.page { display: none; padding: 0 var(--gutter); }
.page.active { display: block; animation: fade 0.24s ease; }
/* 让页面内的浮动返回按钮以页面为定位基准（桌面居中时不会跑出屏幕） */
#page-invite,
#page-me { position: relative; }

@keyframes fade {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: none; }
}

/* 页头（NFT / 矿机 / 团队）—— 返回按钮已移除，标题直接贴页面左边距
   .page 已经自带 padding: 0 var(--gutter)，这里只补上下内边距，
   左右不能再加（否则左侧会变成 gutter + 46px，标题被推得很右） */
.page-head {
  position: relative;
  padding: 20px 0 14px;
}
.page-head h1 {
  position: relative;
  margin: 0;
  padding-left: 14px;   /* 给左侧金线留位置 */
  font-size: 21px;
  font-weight: 800;
  letter-spacing: 0.3px;
  line-height: 1.25;
  color: var(--txt);
}
/* 标题左侧一道短金线，统一各页的视觉起点 */
.page-head h1::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 3px;
  height: 16px;
  margin-top: -8px;
  border-radius: 3px;
  background: var(--gold-grad);
  box-shadow: 0 0 10px rgba(245, 166, 35, 0.55);
}
.page-sub {
  margin-top: 7px;
  font-size: 12.5px;
  color: var(--txt-2);
  letter-spacing: 0.2px;
}

/* 返回按钮（二级页面） */
.back-btn {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  padding: 0 0 3px;
  margin-bottom: 9px;
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  color: var(--txt);
  background: linear-gradient(180deg, #212832, var(--sub));
  border: 1px solid var(--line);
  border-radius: 10px;
  cursor: pointer;
  box-shadow: var(--inset-top), var(--sh-1);
  transition: background 0.16s, color 0.16s, transform 0.12s, border-color 0.16s;
}
.page-head > .back-btn {
  position: absolute;
  left: 0;
  top: 21px;
  margin: 0;
}
/* 子 Tab 与页头同左边距（原本靠 -46px 抵消返回按钮的缩进，现在不需要了） */
.page-head .subtabs { margin-left: 0; }
.back-btn:active { transform: scale(0.93); }
.back-btn:hover { color: var(--gold); border-color: var(--gold-line); }
.back-btn.back-float {
  position: absolute;
  top: 14px;
  left: var(--gutter);
  margin: 0;
  z-index: 5;
}

/* 子 Tab（下划线式） */
.subtabs {
  display: flex;
  gap: 24px;
  padding: 0 2px;
  margin-bottom: 16px;
}
.subtabs.line { border-bottom: 1px solid var(--line); }

/* NFT 页：标题与子 Tab 之间加大间距（其他页不受影响） */
#page-nft .page-head .subtabs {
  margin-top: 18px;
}

.subtab {
  position: relative;
  padding: 0 0 10px;
  font-size: 14px;
  letter-spacing: 0.2px;
  color: var(--txt-2);
  cursor: pointer;
  user-select: none;
  transition: color 0.16s;
}
.subtab.active { color: var(--txt); font-weight: 800; }
.subtab.active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  border-radius: 2px;
  background: var(--gold-grad);
  box-shadow: 0 0 10px rgba(245, 166, 35, 0.65);
}

.subview { display: none; }
.subview.active { display: block; animation: fade 0.2s ease; }

/* ============================================================
   6 · 启动页 / 绑定邀请
   ============================================================ */

.splash {
  position: relative;
  min-height: calc(100vh - 140px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 34px 22px 46px;
  isolation: isolate;
}
/* 中心暖光 */
.splash::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 4%;
  left: 50%;
  width: 340px;
  height: 340px;
  margin-left: -170px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 166, 35, 0.16), transparent 66%);
  filter: blur(6px);
  pointer-events: none;
}

.splash-logo-img {
  width: 96px;
  height: 96px;
  object-fit: contain;
  display: block;
  margin-bottom: 18px;
  filter: drop-shadow(0 10px 34px rgba(245, 166, 35, 0.34));
  animation: logoFloat 5s ease-in-out infinite;
}
@keyframes logoFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-6px); }
}
@media (prefers-reduced-motion: reduce) {
  .splash-logo-img { animation: none; }
}
.splash-logo {
  font-family: Montserrat, -apple-system, sans-serif;
  font-size: 37px;
  font-weight: 800;
  letter-spacing: 3px;
  line-height: 1.1;
  background: linear-gradient(160deg, #fff1d6 0%, #ffc85a 32%, #f5a623 62%, #b3720a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 8px 30px rgba(245, 166, 35, 0.4));
}
.splash-title {
  margin-top: 20px;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 1.4px;
  color: var(--txt);
}
.splash-desc {
  margin-top: 16px;
  max-width: 320px;
  font-size: 13px;
  line-height: 1.95;
  color: var(--txt-2);
}

/* 首屏能力标签 */
.splash-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
}
.splash-chips span {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.6px;
  color: var(--txt-2);
  padding: 5px 11px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--line);
  background: rgba(30, 36, 45, 0.7);
  box-shadow: var(--inset-top);
}

.btn-splash {
  position: relative;
  margin-top: 44px;
  width: 100%;
  max-width: 244px;
  padding: 15px 0;
  border: none;
  border-radius: 14px;
  background-color: var(--gold);
  background-image: var(--gold-grad);
  color: var(--gold-ink);
  font-size: 14.5px;
  font-weight: 800;
  line-height: 1.45;
  font-family: inherit;
  letter-spacing: 0.8px;
  cursor: pointer;
  box-shadow:
    0 14px 32px -14px rgba(245, 166, 35, 0.75),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
  transition: transform 0.12s, box-shadow 0.2s;
  overflow: hidden;
  min-height: 52px;
}
/* 掠光 */
.btn-splash::after {
  content: "";
  position: absolute;
  top: -60%;
  left: -30%;
  width: 40%;
  height: 220%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.55), transparent);
  transform: rotate(14deg);
  animation: sheen 3.6s ease-in-out infinite;
}
@keyframes sheen {
  0%, 62% { transform: translateX(0) rotate(14deg); opacity: 0; }
  70% { opacity: 0.9; }
  100% { transform: translateX(340px) rotate(14deg); opacity: 0; }
}
.btn-splash:active { transform: scale(0.975); box-shadow: 0 6px 18px -10px rgba(245, 166, 35, 0.7); }

.splash-foot {
  margin-top: 48px;
  font-size: 12px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: #4d5763;
}
.dotok { font-size: 12px; color: var(--ok); margin-left: 6px; font-weight: 700; }

/* ============================================================
   7 · 首页轮播广告位（Banner）
   与页面同边距的卡片式广告位，3 屏自动轮播（纯 CSS，无 JS）
   ============================================================ */

.banner {
  position: relative;
  margin: 16px 0;
  height: clamp(150px, 40vw, 208px);
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: #0e1116;
  box-shadow: var(--inset-top), var(--sh-1);
  overflow: hidden;
  isolation: isolate;
}

/* 单屏：绝对定位叠放，靠 opacity 交叉淡入 */
.banner .slide {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 18px 20px;
  opacity: 0;
  animation: bannerFade 16.5s infinite both;
}
.banner .slide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(440px 200px at 88% 6%, rgba(245, 166, 35, 0.3), transparent 66%),
    radial-gradient(360px 190px at 2% 100%, rgba(245, 166, 35, 0.11), transparent 70%),
    linear-gradient(158deg, #17120a 0%, #0f1218 52%, #0c0e12 100%);
}
/* 同心弧：右侧层次 */
.banner .slide::after {
  content: "";
  position: absolute;
  right: -74px;
  top: -104px;
  width: 268px;
  height: 268px;
  border-radius: 50%;
  border: 1px solid rgba(245, 166, 35, 0.13);
  box-shadow: inset 0 0 0 30px rgba(245, 166, 35, 0.03);
  pointer-events: none;
}
/* 第 2 屏：冷调 */
.banner .s2::before {
  background:
    radial-gradient(420px 200px at 86% 4%, rgba(90, 200, 235, 0.2), transparent 66%),
    radial-gradient(340px 180px at 4% 100%, rgba(45, 190, 127, 0.12), transparent 72%),
    linear-gradient(158deg, #0b1418 0%, #0e1319 52%, #0c0e12 100%);
}
.banner .s2::after { border-color: rgba(122, 202, 235, 0.12); }
/* 第 3 屏：暖绿 */
.banner .s3::before {
  background:
    radial-gradient(420px 200px at 88% 8%, rgba(45, 190, 127, 0.19), transparent 66%),
    radial-gradient(340px 180px at 2% 96%, rgba(245, 166, 35, 0.14), transparent 72%),
    linear-gradient(158deg, #0d140f 0%, #0f1318 52%, #0c0e12 100%);
}
.banner .s3::after { border-color: rgba(45, 190, 127, 0.13); }

.banner .badge {
  position: relative;
  align-self: flex-start;
  font-size: 12px;
  font-weight: 800;
  font-family: Montserrat, sans-serif;
  letter-spacing: 1.4px;
  line-height: 1.4;
  color: var(--gold);
  border: 1px solid var(--gold-line);
  background: rgba(245, 166, 35, 0.1);
  padding: 2px 7px;
  border-radius: 5px;
  margin-bottom: 10px;
  backdrop-filter: blur(4px);
}
.banner h1 {
  position: relative;
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 1.2px;
  line-height: 1.2;
  color: #fff7e8;
  text-shadow: 0 6px 24px rgba(245, 166, 35, 0.3);
}
.banner .en {
  position: relative;
  margin-top: 7px;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.6px;
  line-height: 1.4;
  color: rgba(245, 166, 35, 0.8);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.banner .cn {
  position: relative;
  margin-top: 5px;
  font-size: 12.5px;
  line-height: 1.4;
  letter-spacing: 1px;
  color: var(--txt-2);
}
.banner .mark {
  position: absolute;
  right: 6px;
  bottom: -30px;
  font-family: Montserrat, sans-serif;
  font-size: 104px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -7px;
  color: rgba(245, 166, 35, 0.09);
  pointer-events: none;
  user-select: none;
}

/* 轮播指示点 */
.banner .dots {
  position: absolute;
  z-index: 3;
  left: 20px;
  bottom: 12px;
  display: flex;
  gap: 5px;
}
.banner .dots i {
  width: 13px;
  height: 3px;
  border-radius: 3px;
  background: rgba(245, 247, 250, 0.22);
  transform-origin: left center;
  animation: bannerDot 16.5s infinite both;
}

/* 3 屏 × 5.5s 循环：可见 31%，淡出到 35% 与下一屏 0→2.5% 的淡入交叠，无全黑空档 */
.banner .slide:nth-child(1),
.banner .dots i:nth-child(1) { animation-delay: -0.5s; }
.banner .slide:nth-child(2),
.banner .dots i:nth-child(2) { animation-delay: -6.0s; }
.banner .slide:nth-child(3),
.banner .dots i:nth-child(3) { animation-delay: -11.5s; }

@keyframes bannerFade {
  0% { opacity: 0; }
  2.5% { opacity: 1; }
  31% { opacity: 1; }
  35% { opacity: 0; }
  100% { opacity: 0; }
}
@keyframes bannerDot {
  0% { background: rgba(245, 247, 250, 0.22); transform: none; }
  2.5% { background: var(--gold); transform: scaleX(1.32); }
  31% { background: var(--gold); transform: scaleX(1.32); }
  35% { background: rgba(245, 247, 250, 0.22); transform: none; }
  100% { background: rgba(245, 247, 250, 0.22); transform: none; }
}

/* 减弱动效：只留首屏，隐藏指示点（否则全部落到 0% 帧） */
@media (prefers-reduced-motion: reduce) {
  .banner .slide { animation: none !important; opacity: 0; }
  .banner .slide:first-child { opacity: 1 !important; }
  .banner .dots { display: none; }
}

/* 通用 hero（其他页面用） */
.hero {
  position: relative;
  border-radius: var(--radius);
  padding: 18px;
  margin: 12px 0;
  background:
    radial-gradient(320px 140px at 92% 0%, rgba(245, 166, 35, 0.16), transparent 66%),
    linear-gradient(180deg, #1a1f27, var(--card));
  border: 1px solid var(--line);
  box-shadow: var(--inset-top), var(--sh-1);
  overflow: hidden;
}

/* ============================================================
   8 · 卡片
   ============================================================ */

.card {
  position: relative;
  background: linear-gradient(180deg, #181d25 0%, var(--card) 58%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 15px;
  margin-bottom: 12px;
  box-shadow: var(--inset-top), var(--sh-1);
}

.card-title {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-left: 12px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.2px;
  margin-bottom: 13px;
  color: var(--txt);
}
.card-title .more { font-size: 12.5px; color: var(--txt-2); font-weight: 400; }

/* 标题前的小金条（绝对定位，不参与 flex 布局） */
.card-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 3px;
  height: 12px;
  margin-top: -6px;
  border-radius: 3px;
  background: var(--gold-grad);
  box-shadow: 0 0 8px rgba(245, 166, 35, 0.5);
}

/* 价格卡（首页） */
.price-card {
  padding: 16px 16px 17px;
  overflow: hidden;
  background:
    radial-gradient(280px 130px at 96% 6%, rgba(245, 166, 35, 0.16), transparent 68%),
    linear-gradient(180deg, #1b2129 0%, var(--card) 62%);
}
.price-card::after {
  content: "";
  position: absolute;
  right: -30px;
  top: -30px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  border: 1px solid rgba(245, 166, 35, 0.16);
  pointer-events: none;
}
.price-card .k {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12.5px;
  line-height: 1.2;
  color: var(--txt-2);
  letter-spacing: 0.6px;
  margin-bottom: 9px;
  text-transform: uppercase;
}

/* 实时标识 */
.price-card .live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.4px;
  color: var(--ok);
  padding: 2px 8px 2px 7px;
  border-radius: var(--radius-pill);
  background: var(--ok-soft);
  border: 1px solid var(--ok-line);
}
.price-card .live i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--ok);
  box-shadow: 0 0 0 2px rgba(45, 190, 127, 0.18);
  animation: pulse 2.4s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.45; transform: scale(0.85); }
}
.price-card .price {
  font-family: Montserrat, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: 0.6px;
  line-height: 1;
  color: var(--txt);
}
.price-line {
  display: flex;
  align-items: baseline;
  gap: 9px;
}
.price-unit {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.2px;
  color: var(--gold);
  padding: 3px 7px;
  border-radius: 5px;
  border: 1px solid var(--gold-line);
  background: var(--gold-soft);
  transform: translateY(-3px);
}

/* ============================================================
   9 · 区块标题
   ============================================================ */

.sec-head { margin: 24px 2px 13px; }
.sec-head h2 {
  position: relative;
  margin: 0;
  padding-left: 12px;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: 0.3px;
  color: var(--txt);
}
.sec-head h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 3px;
  border-radius: 3px;
  background: var(--gold-grad);
  box-shadow: 0 0 10px rgba(245, 166, 35, 0.55);
}
.sec-head p {
  margin: 8px 0 0;
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--txt-2);
}

/* ============================================================
   10 · 报单档位
   ============================================================ */

.pkg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.pkg {
  position: relative;
  background: linear-gradient(180deg, #1a1f28 0%, var(--card) 64%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 13px;
  cursor: pointer;
  box-shadow: var(--inset-top), var(--sh-1);
  transition: border-color 0.18s, transform 0.14s, box-shadow 0.2s;
  overflow: hidden;
}
.pkg:active { transform: scale(0.985); }

/* 选中：金色描边 + 内发光 + 顶部渐变 */
.pkg.sel {
  border-color: rgba(245, 166, 35, 0.75);
  background-image:
    var(--gold-grad-soft),
    linear-gradient(180deg, #20262f 0%, var(--card) 66%);
  box-shadow:
    0 0 0 1px rgba(245, 166, 35, 0.25),
    0 14px 32px -18px rgba(245, 166, 35, 0.85),
    var(--inset-top);
}
.pkg.sel::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--gold-grad);
  box-shadow: 0 0 12px rgba(245, 166, 35, 0.75);
}

.pkg .chip {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: linear-gradient(160deg, #262e39, var(--sub));
  border: 1px solid var(--hair);
  display: grid;
  place-items: center;
  margin-bottom: 10px;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: var(--gold);
  transition: background 0.18s, border-color 0.18s;
}
.pkg.sel .chip {
  background: linear-gradient(160deg, rgba(245, 166, 35, 0.26), rgba(245, 166, 35, 0.08));
  border-color: var(--gold-line);
  box-shadow: 0 0 14px -4px rgba(245, 166, 35, 0.7);
}

.pkg .name {
  font-size: 14px;
  font-weight: 700;
  color: var(--txt);
  margin-bottom: 7px;
  letter-spacing: 0.1px;
}
.pkg .amount {
  font-family: Montserrat, sans-serif;
  font-size: 21px;
  font-weight: 800;
  line-height: 1.05;
  margin-bottom: 9px;
  white-space: nowrap;
  color: var(--gold);
}
.pkg .amount span {
  font-size: 12px;
  font-weight: 700;
  color: var(--txt-2);
  margin-left: 5px;
  letter-spacing: 0.6px;
}
/* 档位说明行：允许换行（英文文案更长），超 2 行才省略 */
.pkg .line {
  font-size: 12px;
  color: var(--txt-2);
  line-height: 1.45;
  min-height: 17px;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.pkg .line:first-of-type { color: var(--txt-3); }

.btn-buy {
  position: relative;
  width: 100%;
  margin-top: 13px;
  padding: 10px 0;
  border: 1px solid transparent;
  border-radius: var(--radius-xs);
  background-color: var(--gold);
  background-image: var(--gold-grad);
  color: var(--gold-ink);
  font-size: 12.5px;
  font-weight: 800;
  font-family: inherit;
  letter-spacing: 0.6px;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
  transition: transform 0.12s, opacity 0.12s, box-shadow 0.2s, background-color 0.2s, color 0.2s;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn-buy:active { transform: scale(0.97); }
.btn-buy:disabled { opacity: 0.4; box-shadow: none; }
/* 未选中的档位按钮降为描边，选中后才是实心金（尺寸保持一致） */
.pkg:not(.sel) .btn-buy {
  background-image: none;
  background-color: rgba(245, 166, 35, 0.1);
  border-color: var(--gold-line);
  color: var(--gold);
  box-shadow: none;
}

/* ============================================================
   11 · 社区奖励池
   ============================================================ */

.pool-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.pool {
  position: relative;
  background: linear-gradient(180deg, #191e26 0%, var(--card) 60%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 13px;
  box-shadow: var(--inset-top), var(--sh-1);
  overflow: hidden;
}
.pool::before {
  content: "";
  position: absolute;
  top: -30px;
  right: -30px;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 166, 35, 0.16), transparent 70%);
  pointer-events: none;
}
.pool .name {
  position: relative;
  font-family: Montserrat, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.4px;
  color: var(--txt-2);
  margin-bottom: 13px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.pool .name .tag {
  font-style: normal;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.2px;
  color: var(--txt-3);
  background: var(--sub);
  border: 1px solid var(--hair);
  border-radius: 4px;
  padding: 2px 5px;
}
.pool.idle {
  border-style: dashed;
  border-color: #303845;
}
.pool.idle::before { opacity: 0.35; }
.pool-note {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-size: 12px;
  line-height: 1.5;
  color: var(--txt-3);
}
.pool .row { padding: 0; }
.pool .row .k {
  display: block;
  font-size: 12px;
  color: var(--txt-3);
  margin-bottom: 5px;
  letter-spacing: 0.3px;
}
.pool .row .v {
  display: block;
  font-family: Montserrat, sans-serif;
  font-size: 15px;
  font-weight: 800;
  color: var(--txt);
  margin-bottom: 12px;
  letter-spacing: 0.2px;
}
.pool .row:last-child .v { margin-bottom: 0; }
.pool .row .v.gold { color: var(--gold); }

/* ============================================================
   12 · 资产条
   ============================================================ */

.assets { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
.asset {
  background: linear-gradient(180deg, #191e26, var(--card));
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 13px;
  box-shadow: var(--inset-top), var(--sh-1);
}
.asset .lbl { font-size: 12px; color: var(--txt-2); margin-bottom: 6px; }
.asset .val { font-family: Montserrat, sans-serif; font-size: 18px; font-weight: 800; }
.asset .val.usdt { color: var(--gold); }
.asset .val.goat { color: var(--txt); }

/* ============================================================
   13 · 按钮
   ============================================================ */

.btn {
  position: relative;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #232a34, var(--sub));
  color: var(--txt);
  padding: 11px 16px;
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
  box-shadow: var(--inset-top);
  transition: transform 0.12s, opacity 0.12s, border-color 0.16s, background 0.16s;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn:active { transform: scale(0.975); }
.btn:hover:not(:disabled) { border-color: #39424f; }
.btn:disabled { opacity: 0.38; cursor: not-allowed; box-shadow: none; }

.btn-primary {
  background-color: var(--gold);
  background-image: var(--gold-grad);
  border: none;
  color: var(--gold-ink);
  font-weight: 800;
  letter-spacing: 0.4px;
  box-shadow:
    0 12px 28px -14px rgba(245, 166, 35, 0.7),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.btn-primary:hover:not(:disabled) { border-color: transparent; }
.btn-primary:active {
  box-shadow: 0 6px 16px -12px rgba(245, 166, 35, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.btn-ghost {
  background: transparent;
  border-color: var(--line);
  color: var(--txt-2);
  box-shadow: none;
}
.btn-ghost:hover:not(:disabled) { color: var(--txt); border-color: #3a434f; }

.btn-sm { padding: 8px 13px; font-size: 13px; border-radius: var(--radius-xs); }
.btn-full { width: 100%; padding: 13px; font-size: 14.5px; border-radius: 13px; }

/* 半宽左对齐（NFT 申购按钮） */
.btn-half {
  padding: 10px 30px;
  font-size: 13px;
  border-radius: var(--radius-xs);
  min-width: 52%;
}

/* ============================================================
   14 · 标签 / Pill
   ============================================================ */

.pill {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--line);
  color: var(--txt-2);
  background: var(--sub);
  white-space: nowrap;
  letter-spacing: 0.2px;
}
.pill-on {
  background: var(--ok-soft);
  border-color: var(--ok-line);
  color: var(--ok);
  font-weight: 800;
}
.pill-off {
  background: var(--err-soft);
  border-color: var(--err-line);
  color: var(--err);
  font-weight: 800;
}
.pill-gold {
  background: var(--gold-soft);
  border-color: var(--gold-line);
  color: var(--gold);
  font-weight: 800;
}

/* ============================================================
   15 · 键值行 / 数值块
   ============================================================ */

.kv {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
}
.kv:last-child { border-bottom: none; }
.kv .k { color: var(--txt-2); white-space: nowrap; letter-spacing: 0.2px; }
.kv .v { font-weight: 700; text-align: right; word-break: break-all; }

.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.duo .d { min-width: 0; }
.duo .d.right { text-align: right; }
.duo .d .k {
  font-size: 12px;
  color: var(--txt-3);
  margin-bottom: 6px;
  letter-spacing: 0.3px;
}
.duo .d .v {
  font-family: Montserrat, sans-serif;
  font-size: 18px;
  font-weight: 800;
  color: var(--txt);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.2px;
}
.duo .d .v.gold { color: var(--gold); }
.duo .d .v.ok { color: var(--ok); }
.duo.big .d .v { font-size: 22px; }

/* ============================================================
   16 · 列表项
   ============================================================ */

.list-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
  transition: opacity 0.15s;
}
.list-item:last-child { border-bottom: none; }
.list-item:active { opacity: 0.75; }
.list-item .icon {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: linear-gradient(160deg, #262e39, var(--sub));
  border: 1px solid var(--hair);
  color: var(--gold);
  font-weight: 800;
  flex-shrink: 0;
  letter-spacing: 0.3px;
}
.list-item .body { flex: 1; min-width: 0; }
.list-item .body .t { font-size: 14px; font-weight: 700; }
.list-item .body .s { font-size: 12.5px; color: var(--txt-3); margin-top: 2px; }
.list-item .right { text-align: right; font-size: 14px; font-weight: 700; }

/* ============================================================
   17 · 入口卡（天鹅牧场 / 官方商城）
   ============================================================ */

.entry-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 12px; }

.entry {
  position: relative;
  background: linear-gradient(180deg, #1a1f28 0%, var(--card) 64%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px 14px;
  cursor: pointer;
  box-shadow: var(--inset-top), var(--sh-1);
  overflow: hidden;
  transition: border-color 0.18s, transform 0.14s, box-shadow 0.2s;
}
.entry::after {
  content: "";
  position: absolute;
  right: -24px;
  bottom: -24px;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 166, 35, 0.14), transparent 70%);
  pointer-events: none;
}
.entry:active { transform: scale(0.98); }
.entry:hover { border-color: var(--gold-line); }
.entry .ic {
  font-size: 22px;
  line-height: 1;
  margin-bottom: 12px;
  filter: drop-shadow(0 6px 14px rgba(245, 166, 35, 0.28));
}
.entry .t { font-size: 14.5px; font-weight: 800; color: var(--txt); letter-spacing: 0.2px; }
.entry .s { font-size: 12px; color: var(--txt-3); margin-top: 3px; letter-spacing: 0.4px; }
.entry .go { margin-top: 13px; font-size: 12.5px; color: var(--gold); font-weight: 800; }

/* ============================================================
   18 · 我的页头
   ============================================================ */

.me-head {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 22px 2px 18px;
  padding-left: 44px;
}
.me-head .avatar {
  position: relative;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  font-size: 21px;
  font-weight: 800;
  color: var(--gold-ink);
  background-image: linear-gradient(135deg, #ffc85a, #f5a623 46%, #a96a08);
  box-shadow:
    0 0 0 2px rgba(11, 13, 16, 0.9),
    0 0 0 3px rgba(245, 166, 35, 0.42),
    0 12px 28px -12px rgba(245, 166, 35, 0.7);
}
.me-head .name { font-size: 17px; font-weight: 800; letter-spacing: 0.2px; }
.me-head .addr {
  font-size: 12.5px;
  color: var(--txt-2);
  margin-top: 4px;
  word-break: break-all;
}

/* ============================================================
   19 · 3 倍进度
   ============================================================ */

.m3-top { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 11px; }
.m3-top .num { font-size: 26px; font-weight: 800; color: var(--gold); line-height: 1; letter-spacing: 0.4px; }

/* ============================================================
   20 · 弹窗（底部抽屉 / 全屏）
   ============================================================ */

.sheet-mask {
  position: fixed;
  inset: 0;
  background: rgba(4, 6, 9, 0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 60;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  animation: fade 0.18s ease;
}
/* 全屏弹层：从顶部开始，整层可滚动（否则内容超高时顶部被截掉） */
.sheet-mask.full {
  align-items: flex-start;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  backdrop-filter: none;
  background: var(--bg);
}

.sheet {
  position: relative;
  width: 100%;
  max-width: 560px;
  background: linear-gradient(180deg, #14181f 0%, var(--bg) 40%);
  border-radius: 22px 22px 0 0;
  border-top: 1px solid var(--line);
  padding: 22px 18px calc(18px + var(--safe-bottom));
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 -20px 50px -20px rgba(0, 0, 0, 0.9);
  animation: up 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);
}
/* 抽屉顶部拖拽条 */
.sheet::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 50%;
  width: 38px;
  height: 4px;
  margin-left: -19px;
  border-radius: 99px;
  background: #333b46;
}
@keyframes up {
  from { transform: translateY(100%); }
  to { transform: none; }
}

.sheet h3 { margin: 2px 0 6px; font-size: 18px; font-weight: 800; text-align: center; letter-spacing: 0.3px; }
.sheet .sheet-sub {
  font-size: 12.5px;
  color: var(--txt-3);
  text-align: center;
  margin-bottom: 20px;
  line-height: 1.7;
}

.sheet .close,
.sheet-full .close {
  position: absolute;
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  padding: 0;
  font-size: 17px;
  line-height: 1;
  color: var(--txt-2);
  background: var(--sub);
  border: 1px solid var(--hair);
  border-radius: 50%;
  cursor: pointer;
  z-index: 6;
  transition: color 0.15s, background 0.15s;
}
.sheet .close:hover,
.sheet-full .close:hover { color: var(--txt); background: var(--sub-2); }
.sheet .close { right: 15px; top: 15px; }

/* 全屏弹层（报单确认 / NFT 申购） */
.sheet-full {
  position: relative;
  width: 100%;
  max-width: 560px;
  min-height: 100vh;
  background:
    radial-gradient(620px 300px at 50% -140px, rgba(245, 166, 35, 0.09), transparent 72%),
    var(--bg);
  padding: 0 var(--gutter) calc(26px + var(--safe-bottom));
  animation: fade 0.2s ease;
}

/* 吸顶头部：返回 / 标题 / 关闭 */
.sf-bar {
  position: sticky;
  top: 0;
  z-index: 7;
  display: flex;
  align-items: center;
  gap: 10px;
  height: 56px;
  margin: 0 calc(-1 * var(--gutter)) 14px;
  padding: 0 var(--gutter);
  background: rgba(11, 13, 16, 0.86);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border-bottom: 1px solid var(--line);
}
.sf-bar h3 {
  flex: 1;
  margin: 0;
  padding: 0;
  text-align: center;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--txt);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sf-bar .sheet-back,
.sf-bar .close {
  position: static;
  flex: none;
  margin: 0;
}
.sheet-full > h3 { margin: 8px 0 6px; padding: 0 44px; text-align: center; }
.sheet-full .sheet-sub { margin-bottom: 22px; padding: 0 44px; text-align: center; }

/* 全屏弹层左上角返回按钮（报单 / NFT 申购） */
.sheet-back {
  position: absolute;
  left: var(--gutter);
  top: 17px;
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  padding: 0 0 3px;
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  color: var(--txt);
  background: linear-gradient(180deg, #212832, var(--sub));
  border: 1px solid var(--line);
  border-radius: 10px;
  cursor: pointer;
  z-index: 6;
  box-shadow: var(--inset-top);
  transition: background 0.16s, color 0.16s, transform 0.12s;
}
.sheet-back:active { transform: scale(0.93); }
.sheet-back:hover { color: var(--gold); border-color: var(--gold-line); }

/* 弹窗金额块 */
.amount-box {
  position: relative;
  background:
    radial-gradient(240px 120px at 100% 0%, rgba(245, 166, 35, 0.16), transparent 68%),
    linear-gradient(180deg, #1b212a 0%, var(--card) 70%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 16px 16px 18px;
  margin-bottom: 6px;
  box-shadow: var(--inset-top), var(--sh-1);
  overflow: hidden;
}
.amount-box .k {
  display: block;
  font-size: 12.5px;
  color: var(--txt-2);
  margin-bottom: 10px;
  letter-spacing: 0.4px;
}
.amount-box .v {
  display: block;
  font-family: Montserrat, sans-serif;
  font-size: 30px;
  font-weight: 800;
  color: var(--txt);
  line-height: 1.05;
  letter-spacing: 0.4px;
}
.amount-box .v i {
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
  color: var(--gold);
  margin-right: 9px;
  letter-spacing: 1px;
  vertical-align: 2px;
}

/* 权益条目 */
.benefit {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.benefit:last-of-type { border-bottom: none; }
.benefit .ico {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: var(--gold-soft);
  border: 1px solid rgba(245, 166, 35, 0.22);
  color: var(--gold);
  font-size: 13px;
}
.benefit .t { font-size: 13.5px; font-weight: 700; color: var(--txt); }
.benefit .s { font-size: 12.5px; color: var(--txt-2); margin-top: 3px; line-height: 1.6; }

/* ============================================================
   21 · 表单
   ============================================================ */

.field { margin-bottom: 14px; }
.field label {
  display: block;
  font-size: 12.5px;
  color: var(--txt-2);
  margin-bottom: 8px;
  letter-spacing: 0.3px;
}

input, select, textarea {
  width: 100%;
  height: 50px;
  background: var(--sub);
  border: 1px solid var(--hair);
  color: var(--txt);
  padding: 0 13px;
  border-radius: var(--radius-sm);
  font-size: 14px;
  outline: none;
  font-family: inherit;
  -webkit-appearance: none;
  transition: border-color 0.16s, background 0.16s, box-shadow 0.16s;
}
textarea { height: auto; min-height: 78px; padding: 13px; resize: none; line-height: 1.6; }
input::placeholder, textarea::placeholder { color: var(--txt-3); }
input:focus, select:focus, textarea:focus {
  border-color: rgba(245, 166, 35, 0.65);
  background: var(--sub-2);
  box-shadow: var(--ring-gold);
}

.input-group {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--sub);
  border: 1px solid var(--hair);
  border-radius: var(--radius-sm);
  padding: 0 13px;
  height: 50px;
  transition: border-color 0.16s, box-shadow 0.16s, background 0.16s;
}
.input-group:focus-within {
  border-color: rgba(245, 166, 35, 0.65);
  background: var(--sub-2);
  box-shadow: var(--ring-gold);
}
.input-group .pre {
  font-size: 14px;
  color: var(--txt-2);
  flex-shrink: 0;
  padding-right: 11px;
  border-right: 1px solid var(--line);
  letter-spacing: 0.3px;
}
.input-group input { background: transparent; border: none; padding: 0; height: 48px; border-radius: 0; }
.input-group input:focus { background: transparent; box-shadow: none; }

.select-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: var(--sub);
  border: 1px solid var(--hair);
  border-radius: var(--radius-sm);
  padding: 0 13px;
  height: 50px;
  font-size: 14px;
  color: var(--txt-3);
  cursor: pointer;
  transition: border-color 0.16s, color 0.16s, background 0.16s;
}
.select-box.filled { color: var(--txt); }
.select-box:active { background: var(--sub-2); }
.select-box .caret { font-size: 11px; color: var(--txt-3); transform: scaleY(0.8); }

/* ============================================================
   22 · 省 / 市 / 区 三级联动
   ============================================================ */

.sheet-mask.layer {
  z-index: 70;
  background: rgba(4, 6, 9, 0.7);
}
.layer-sheet {
  max-height: 74vh;
  border-radius: 22px 22px 0 0;
}
.region-cols {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  height: 300px;
  margin-top: 6px;
}
.region-col {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.region-item {
  padding: 12px 10px;
  font-size: 13px;
  color: var(--txt-2);
  cursor: pointer;
  border-bottom: 1px solid var(--line);
  line-height: 1.35;
  word-break: break-all;
  transition: background 0.14s, color 0.14s;
}
.region-item:last-child { border-bottom: none; }
.region-item.on {
  position: relative;
  color: var(--gold);
  font-weight: 700;
  background: var(--sub);
}
.region-item.on::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 2px;
  border-radius: 2px;
  background: var(--gold);
}
.region-picked {
  margin-top: 13px;
  padding: 12px 13px;
  background: var(--gold-soft);
  border: 1px solid var(--gold-line);
  border-radius: var(--radius-sm);
  font-size: 14px;
  color: var(--gold);
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.3px;
}

.block-label {
  font-size: 14px;
  font-weight: 800;
  color: var(--txt);
  margin: 22px 0 10px;
  letter-spacing: 0.3px;
}
.block-label::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 11px;
  margin-right: 8px;
  vertical-align: -1px;
  border-radius: 3px;
  background: var(--gold-grad);
}

/* ============================================================
   23 · 进度条
   ============================================================ */

.progress {
  position: relative;
  height: 8px;
  background: #10141a;
  border: 1px solid var(--hair);
  border-radius: 99px;
  overflow: hidden;
}
.progress > i {
  display: block;
  height: 100%;
  border-radius: 99px;
  background-image: linear-gradient(90deg, #b0700a, var(--gold) 68%, var(--gold-2));
  box-shadow: 0 0 12px rgba(245, 166, 35, 0.6);
  transition: width 0.45s cubic-bezier(0.3, 0.9, 0.3, 1);
}

/* ============================================================
   24 · 空状态 / 提示
   ============================================================ */

.empty {
  position: relative;
  text-align: center;
  padding: 34px 12px;
  color: var(--txt-3);
  font-size: 12.5px;
  letter-spacing: 0.2px;
}
.empty::before {
  content: "◇";
  display: block;
  font-size: 20px;
  color: #333b46;
  margin-bottom: 10px;
}

.hint { font-size: 12.5px; color: var(--txt-3); line-height: 1.75; }

.notice {
  position: relative;
  background: linear-gradient(180deg, rgba(245, 166, 35, 0.13), rgba(245, 166, 35, 0.06));
  border: 1px solid var(--gold-line);
  color: #ffd79a;
  border-radius: var(--radius-sm);
  padding: 12px 13px 12px 14px;
  font-size: 12.5px;
  line-height: 1.75;
  margin: 16px 0;
}
.notice::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 2px;
  border-radius: 2px;
  background: var(--gold);
}

/* ============================================================
   25 · 日志
   ============================================================ */

#log {
  position: relative;
  background: #080a0d;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 11px 12px;
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 12px;
  line-height: 1.6;
  max-height: 170px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-all;
  color: var(--txt-2);
}
#log .ok { color: var(--ok); }
#log .err { color: var(--err); }
#log .info { color: var(--gold); }
#log .warn { color: var(--gold); opacity: 0.85; }

/* ============================================================
   26 · NFT 专区
   ============================================================ */

.own-row { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 8px; }
.own-item { min-width: 0; position: relative; }
.own-item + .own-item { padding-left: 10px; border-left: 1px solid var(--line); }
.own-item .k {
  font-size: 12px;
  color: var(--txt-3);
  margin-bottom: 7px;
  white-space: nowrap;
  letter-spacing: 0.2px;
}
.own-item .v {
  font-family: Montserrat, sans-serif;
  font-size: 20px;
  font-weight: 800;
  color: var(--txt);
  line-height: 1;
  letter-spacing: 0.2px;
}
.own-item .v.gold { color: var(--gold); }

.own-sub {
  display: flex;
  gap: 18px;
  margin-top: 14px;
  padding-top: 13px;
  border-top: 1px solid var(--line);
  font-size: 12px;
  color: var(--txt-3);
}
.own-sub b { color: var(--txt-2); font-weight: 800; margin-left: 5px; }

.nft-card {
  position: relative;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: linear-gradient(180deg, #181d25 0%, var(--card) 46%);
  margin-bottom: 13px;
  box-shadow: var(--inset-top), var(--sh-1);
}
/* 高级 NFT：金色描边 + 外发光，与普通款拉开层级 */
.nft-card.premium {
  border-color: rgba(245, 166, 35, 0.34);
  box-shadow:
    var(--inset-top),
    0 18px 40px -26px rgba(245, 166, 35, 0.55),
    0 0 0 1px rgba(245, 166, 35, 0.08);
}
.nft-card.premium::before {
  background: linear-gradient(90deg, transparent, rgba(245, 166, 35, 0.85), transparent);
}
/* 卡片顶部一道极细的品牌线 */
.nft-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(245, 166, 35, 0.55), transparent);
}

.nft-head {
  position: relative;
  padding: 16px 15px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  background:
    radial-gradient(260px 120px at 92% 0%, rgba(245, 166, 35, 0.16), transparent 70%),
    linear-gradient(135deg, rgba(245, 166, 35, 0.08), rgba(21, 25, 32, 0) 62%);
  border-bottom: 1px solid var(--line);
}
.nft-head.senior {
  background:
    radial-gradient(280px 130px at 92% 0%, rgba(245, 166, 35, 0.3), transparent 70%),
    linear-gradient(135deg, rgba(245, 166, 35, 0.18), rgba(21, 25, 32, 0) 66%);
}
.nft-head .tier { font-size: 17px; font-weight: 800; letter-spacing: 0.3px; }
.nft-head .tier-sub { font-size: 12px; color: var(--txt-3); margin-top: 4px; letter-spacing: 0.2px; }
.nft-body { padding: 6px 15px 15px; }

.nft-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.nft-grid .ng {
  background: linear-gradient(180deg, #212832, var(--sub));
  border: 1px solid var(--hair);
  border-radius: var(--radius-xs);
  padding: 11px 12px;
}
.nft-grid .ng .k { font-size: 12px; color: var(--txt-3); margin-bottom: 5px; letter-spacing: 0.3px; }
.nft-grid .ng .v { font-size: 13px; font-weight: 700; color: var(--txt); }
.nft-grid .ng .v.gold { color: var(--gold); }
.nft-grid .ng .v.ok { color: var(--ok); }

.privilege {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-top: 13px;
  padding: 11px 13px;
  border-radius: var(--radius-xs);
  background: linear-gradient(120deg, rgba(245, 166, 35, 0.16), rgba(245, 166, 35, 0.05));
  border: 1px solid var(--gold-line);
}
.privilege .ico {
  color: var(--gold);
  font-size: 14px;
  flex-shrink: 0;
  filter: drop-shadow(0 0 8px rgba(245, 166, 35, 0.6));
}
.privilege .t { font-size: 13px; font-weight: 800; color: var(--gold); }
.privilege .s { font-size: 12px; color: var(--txt-2); margin-top: 2px; }

.stake-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 17px;
  font-size: 12px;
}
.stake-row .lab { color: var(--txt-2); }
.stake-row .max { color: var(--txt-3); }

/* ============================================================
   27 · 云矿机
   ============================================================ */

.stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.stat-box {
  position: relative;
  background: linear-gradient(180deg, #191e26, var(--card));
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px;
  box-shadow: var(--inset-top), var(--sh-1);
  overflow: hidden;
}
.stat-box::after {
  content: "";
  position: absolute;
  top: -26px;
  right: -26px;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 166, 35, 0.12), transparent 72%);
  pointer-events: none;
}
.stat-box .k { font-size: 12px; color: var(--txt-3); margin-bottom: 7px; letter-spacing: 0.3px; }
.stat-box .v {
  font-family: Montserrat, sans-serif;
  font-size: 20px;
  font-weight: 800;
  margin-top: 3px;
  color: var(--txt);
  line-height: 1;
  letter-spacing: 0.2px;
}
.stat-box .v.gold { color: var(--gold); }
.stat-box .v.ok { color: var(--ok); }

.miner {
  position: relative;
  background: linear-gradient(180deg, #191e26 0%, var(--card) 62%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px;
  margin-bottom: 11px;
  box-shadow: var(--inset-top), var(--sh-1);
  overflow: hidden;
}
.miner::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 2px;
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(245, 166, 35, 0.75), rgba(245, 166, 35, 0));
}
.miner.out { opacity: 0.5; }
.miner.out::before { background: linear-gradient(180deg, #3a434f, transparent); }

.miner .hd { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.miner .hd .name { font-size: 15px; font-weight: 800; color: var(--txt); letter-spacing: 0.2px; }
.miner .hd .name.gold { color: var(--gold); }
.miner .hd .no {
  font-size: 12px;
  color: var(--txt-3);
  margin-top: 4px;
  letter-spacing: 0.3px;
}
.miner .stats { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 13px; }
.miner .stat {
  background: linear-gradient(180deg, #212832, var(--sub));
  border: 1px solid var(--hair);
  border-radius: var(--radius-xs);
  padding: 10px 11px;
}
.miner .stat .k { font-size: 12px; color: var(--txt-3); margin-bottom: 5px; letter-spacing: 0.3px; }
.miner .stat .v {
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 800;
  color: var(--gold);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.2px;
}
.miner .stat .v small { font-size: 12px; color: var(--txt-3); }

/* ============================================================
   28 · 团队表
   ============================================================ */

.team-row {
  display: grid;
  grid-template-columns: 1.15fr 0.75fr 1.1fr 0.85fr;
  gap: 6px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 12.5px;
  align-items: center;
}
.team-row.head {
  color: var(--txt-3);
  font-size: 12px;
  letter-spacing: 0.3px;
  padding: 8px 10px;
  margin: 0 -10px 2px;
  background: var(--sub);
  border: 1px solid var(--hair);
  border-radius: var(--radius-xs);
}
.team-row .addr { font-family: ui-monospace, Menlo, monospace; font-size: 12px; color: var(--txt); }
.team-row .r { text-align: right; }

.team-sum {
  display: flex;
  gap: 18px;
  margin-top: 13px;
  padding-top: 13px;
  border-top: 1px solid var(--line);
  font-size: 12px;
  color: var(--txt-3);
}
.team-sum b { color: var(--txt); font-weight: 800; margin-left: 4px; }

.linkbox {
  max-width: 62%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
}

/* ============================================================
   29 · 响应式
   移动端 360–430（基准 390）· 平板 · 桌面（基准 1440，自适应）
   规范：页标题 20–24 / 卡标题 15–18 / 正文 14–16 / 辅助 12–13
   ============================================================ */

/* 窄屏 360：边距收 16，栅格间距收紧 */
@media (max-width: 374px) {
  :root { --gutter: 16px; }
  .pkg-grid, .pool-grid, .entry-grid, .stat-grid { gap: 9px; }
  .pkg { padding: 12px 11px; }
  .banner { margin: 14px 0; }
  .banner .slide { padding: 15px 16px; }
  .banner h1 { font-size: 20px; letter-spacing: 0.6px; }
  .banner .mark { font-size: 92px; right: 2px; }
  .banner .dots { left: 16px; bottom: 10px; }
}

/* 大屏手机 / 小平板：居中容器 */
@media (min-width: 430px) {
  :root { --gutter: 20px; }
}

@media (min-width: 600px) {
  body {
    max-width: 560px;
    margin: 0 auto;
    border-left: 1px solid var(--line);
    border-right: 1px solid var(--line);
  }
  .tabbar {
    max-width: 540px;
    left: 50%;
    right: auto;
    width: calc(100% - 20px);
    transform: translateX(-50%);
  }
  .topbar { max-width: 560px; margin: 0 auto; }
}

/* 平板横屏 / 小笔记本：容器放宽，卡片栅格开始展开 */
@media (min-width: 900px) {
  body { max-width: 820px; }
  .tabbar { max-width: 620px; }
  .pkg-grid { grid-template-columns: repeat(4, 1fr); }
  .stat-grid { grid-template-columns: repeat(4, 1fr); }
  .entry-grid { grid-template-columns: repeat(4, 1fr); }
  .banner { margin: 18px 0; }
  .banner .slide { padding: 20px 24px; }
  .banner h1 { font-size: 24px; }
  .banner .mark { font-size: 132px; right: 14px; }
  .banner .dots { left: 24px; bottom: 14px; }

  /* 价格卡横排：左边标签、右边报价（宽屏不再拉成一条长带） */
  .price-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 20px;
  }
  .price-card .k {
    flex: 1;
    margin-bottom: 0;
    max-width: 260px;
  }
  .price-card .price-line { flex: none; }
}

/* 桌面：1440 基准，两列内容 + 四列栅格 */
@media (min-width: 1200px) {
  body {
    max-width: 1080px;
    border-left: 1px solid var(--line);
    border-right: 1px solid var(--line);
  }
  .tabbar { max-width: 660px; }
  .topbar { max-width: 1080px; }

  /* NFT 市场：持有概览通栏，两种卡并排 */
  #view-nft-market.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 14px;
    align-items: start;
  }
  #view-nft-market.active > .card { grid-column: 1 / -1; }

  /* NFT 收益：前两张并排（普通 / 高级分红），金豆收益通栏 */
  #view-nft-income.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 14px;
    align-items: start;
  }
  #view-nft-income.active > .card:last-child { grid-column: 1 / -1; }

  /* 我的：3X 进度与待提取并排，入口/频道/资产通栏或并排 */
  #page-me.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 14px;
    align-items: start;
  }
  #page-me.active > .me-head,
  #page-me.active > .back-float,
  #page-me.active > .hint { grid-column: 1 / -1; }
  #page-me.active > .entry-grid { grid-column: 1 / -1; grid-template-columns: repeat(4, 1fr); }

  /* 矿机：卡片并排 */
  #view-miner-report.active,
  #view-miner-nft.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 14px;
    align-items: start;
  }
  #view-miner-nft.active > .card { grid-column: 1 / -1; }

  .pkg-grid { gap: 14px; }
  .pool-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }
  .banner { margin: 20px 0; height: 232px; }
  .banner .slide { padding: 24px 28px; }
  .banner h1 { font-size: 24px; }
  .banner .mark { font-size: 158px; right: 20px; }
  .banner .dots { left: 28px; bottom: 16px; }
  .card { padding: 18px; }
  .price-card .price { font-size: 34px; }
}

@media (min-width: 1440px) {
  body { max-width: 1160px; }
  .tabbar { max-width: 720px; }
  .topbar { max-width: 1160px; }
}

/* 大屏：卡片轻微上浮反馈 */
@media (hover: hover) {
  .card:hover,
  .nft-card:hover,
  .pool:hover,
  .stat-box:hover,
  .miner:hover {
    border-color: #333c48;
  }
  .pkg:hover:not(.sel) { border-color: #3a434f; }
}

/* ============================================================
   30 · 无障碍：尊重减弱动效
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}

/* ============================================================
   31 · 大号金色数字渐变（放最后，确保覆盖各组件的 color）
   ============================================================ */

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .pkg .amount,
  .duo.big .d .v.gold,
  .own-item .v.gold,
  .stat-box .v.gold,
  .m3-top .num {
    background-image: linear-gradient(160deg, #ffd88a 0%, #f5a623 48%, #e08f10 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }
}

/* ============================================================
   32 · 轻提示 toast（连接/交易失败时替代 alert，不被弹层遮挡）
   ============================================================ */

#goatToastHost {
  position: fixed;
  left: 0;
  right: 0;
  top: calc(64px + env(safe-area-inset-top, 0px));
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
  pointer-events: none;
}
.goat-toast {
  max-width: 520px;
  width: 100%;
  box-sizing: border-box;
  padding: 12px 16px;
  border-radius: 12px;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--txt);
  background: linear-gradient(180deg, #232a34 0%, #1b212a 100%);
  border: 1px solid var(--line);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
  animation: goatToastIn 0.22s ease-out both;
  word-break: break-word;
}
.goat-toast.err {
  border-color: rgba(240, 82, 82, 0.55);
  background: linear-gradient(180deg, #3a2023 0%, #2a191c 100%);
  color: #ffd9d9;
}
.goat-toast.ok {
  border-color: rgba(45, 190, 127, 0.5);
  background: linear-gradient(180deg, #16302a 0%, #142620 100%);
  color: #d6f7e8;
}
.goat-toast.out {
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity 0.35s ease, transform 0.35s ease;
}
@keyframes goatToastIn {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .goat-toast { animation: none; }
  .goat-toast.out { transition: none; }
}

/* ============================================================
   33 · 启动页就地错误提示（连接失败时用户还停在启动页）
   ============================================================ */

.splash-msg {
  display: none;
  max-width: 300px;
  margin: 14px auto 0;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 12.5px;
  line-height: 1.55;
  text-align: left;
  color: #ffd9d9;
  background: rgba(240, 82, 82, 0.1);
  border: 1px solid rgba(240, 82, 82, 0.45);
  word-break: break-word;
}
.splash-msg.on { display: block; }

/* ============================================================
   34 · 余额读取失败提示 + 重试
   ============================================================ */

.kv .sep { margin: 0 5px; color: var(--txt-3); }

.retry-bar {
  display: none;
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 12.5px;
  line-height: 1.55;
  color: #ffd9d9;
  background: rgba(240, 82, 82, 0.1);
  border: 1px solid rgba(240, 82, 82, 0.42);
}
.retry-bar.on { display: block; }

.retry-btn {
  display: inline-block;
  margin-left: 6px;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--gold);
  background: rgba(245, 166, 35, 0.12);
  border: 1px solid rgba(245, 166, 35, 0.5);
  cursor: pointer;
}
.retry-btn:active { transform: scale(0.97); }

/* 多行 toast（环境诊断）保留换行 */
.goat-toast { white-space: pre-line; }

/* ============================================================
   35 · 团队列表：互绑（环）行
   ============================================================ */

.team-row.is-cycle { opacity: 0.62; }

.tag-cycle {
  font-size: 11.5px;
  font-weight: 700;
  color: var(--err);
  background: rgba(240, 82, 82, 0.12);
  border: 1px solid rgba(240, 82, 82, 0.35);
  border-radius: 999px;
  padding: 2px 9px;
  justify-self: start;
  white-space: nowrap;
}

/* ============================================================
   36 · 社区奖励池：结算倒计时 / 子行 / 规则说明
   ============================================================ */

.sec-head .sec-sub {
  font-size: 12px;
  color: var(--txt-3);
  letter-spacing: 0.2px;
  white-space: nowrap;
}
.sec-head .sec-sub b {
  font-family: Montserrat, sans-serif;
  font-size: 13px;
  font-weight: 800;
  margin-left: 4px;
}

/* 参与人数 / 奖金总额 保持大号；结算资格 / 预计每人 用小号 */
.pool .row.sub .k {
  font-size: 11.5px;
  margin-bottom: 3px;
}
.pool .row.sub .v {
  font-size: 12.5px;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--txt-2);
}
.pool .row.sub .v.gold { color: var(--gold); }

.pool-rule {
  margin-top: 12px;
  padding: 11px 13px;
  border-radius: 12px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--txt-3);
  background: var(--sub);
  border: 1px solid var(--line);
  text-align: left;
}

/* ============================================================
   37 · 矿机：3 倍出局状态
   ============================================================ */

.miner.is-capped {
  opacity: 0.72;
  border-color: var(--err-line);
  background: linear-gradient(180deg, rgba(240, 82, 82, 0.06), transparent 60%), var(--card);
}

.miner.is-capped .name { color: var(--txt-2); }

.miner-note {
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px dashed var(--line);
  font-size: 12px;
  line-height: 1.55;
  color: var(--err);
}