/* IGNIX 异动雷达 — 样式
 * 苹果官网式设计系统：大量留白、克制的颜色、毛玻璃导航、柔和卡片、胶囊按钮、Apple 缓动。
 * 外观三态：跟随系统（prefers-color-scheme）/ 夜间（html[data-theme="dark"]）/ 日间（html[data-theme="light"]）。
 * 所有颜色都走下面的变量；深色变量写两份（系统深色 + 强制夜间），改一处要同步另一处。
 * 尊重 prefers-reduced-motion。只用系统字体，不依赖任何外部资源。
 */

/* ================================================================
   设计变量（日间）
   ================================================================ */
:root {
  color-scheme: light dark;
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI Variable Display", "Segoe UI", "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, "Cascadia Mono", Consolas, "Liberation Mono", monospace;

  --bg: #f5f5f7;
  --card: #ffffff;
  --card-glass: rgba(255, 255, 255, .82);
  --elev: #ffffff;
  --text: #1d1d1f;
  --text-2: #6e6e73;
  --text-3: #86868b;
  --hair: rgba(0, 0, 0, .09);
  --hair-2: rgba(0, 0, 0, .055);
  --fill: rgba(0, 0, 0, .028);
  --fill-2: rgba(0, 0, 0, .05);
  --fill-3: rgba(0, 0, 0, .085);
  --btn-2: #e8e8ed;
  --btn-2-hover: #dedee3;
  --seg-bg: rgba(118, 118, 128, .12);
  --seg-ind: #ffffff;
  --seg-ind-shadow: 0 3px 8px rgba(0, 0, 0, .12), 0 3px 1px rgba(0, 0, 0, .04), 0 0 0 .5px rgba(0, 0, 0, .04);

  --blue: #0071e3;
  --blue-hover: #0077ed;
  --link: #0066cc;
  --blue-tint: rgba(0, 113, 227, .1);
  --blue-line: rgba(0, 113, 227, .22);
  --green: #34c759;
  --green-text: #248a3d;
  --green-tint: rgba(52, 199, 89, .14);
  --red: #ff3b30;
  --red-text: #d70015;
  --red-tint: rgba(255, 59, 48, .1);
  --orange: #ff9500;
  --orange-text: #c93400;
  --orange-tint: rgba(255, 149, 0, .13);
  --purple: #af52de;
  --purple-text: #8944ab;
  --purple-tint: rgba(175, 82, 222, .12);
  --yellow: #ffcc00;
  --yellow-text: #8a5d00;
  --yellow-tint: rgba(255, 204, 0, .2);

  --grad-brand: linear-gradient(90deg, #ff9f0a 0%, #ff375f 52%, #bf5af2 100%);
  --grad-brand-d: linear-gradient(135deg, #ff9f0a 0%, #ff375f 52%, #bf5af2 100%);
  --grad-orange: linear-gradient(135deg, #ffb340 0%, #ff8500 100%);
  --grad-pink: linear-gradient(135deg, #ff6b81 0%, #ff2d55 100%);
  --grad-purple: linear-gradient(135deg, #d27dff 0%, #8e5cff 100%);
  --grad-grad: linear-gradient(135deg, #34c759 0%, #00c7be 100%);   /* 毕业提醒（13.3） */
  --grad-grey: linear-gradient(135deg, #aeaeb2 0%, #8e8e93 100%);   /* 跌破报警价的卡片（13.4） */
  --mult-shadow: .22;

  --nav-bg: rgba(255, 255, 255, .72);
  --card-border: rgba(0, 0, 0, .04);
  --shadow: 0 1px 1px rgba(0, 0, 0, .02), 0 4px 18px rgba(0, 0, 0, .045);
  --shadow-hover: 0 2px 4px rgba(0, 0, 0, .03), 0 18px 44px rgba(0, 0, 0, .09);
  --shadow-lg: 0 30px 80px rgba(0, 0, 0, .18), 0 2px 8px rgba(0, 0, 0, .06);
  --shadow-menu: 0 12px 40px rgba(0, 0, 0, .14), 0 0 0 .5px rgba(0, 0, 0, .1);
  --shadow-login: 0 1px 2px rgba(0, 0, 0, .03), 0 22px 60px rgba(0, 0, 0, .08);
  --overlay: rgba(232, 232, 237, .6);
  --tip-bg: rgba(29, 29, 31, .92);
  --toast-bg: rgba(29, 29, 31, .9);

  /* 头像首字母圆、首屏光晕、Prime 卡、开关、表格左右滚动阴影 */
  --av-s1: 72%;
  --av-l1: 93%;
  --av-s2: 52%;
  --av-l2: 38%;
  --av-ring: rgba(0, 0, 0, .06);
  --glow-a: rgba(255, 159, 10, .2);
  --glow-b: rgba(255, 55, 95, .15);
  --glow-c: rgba(191, 90, 242, .16);
  --prime-shadow: 0 1px 1px rgba(0, 0, 0, .04), 0 10px 34px rgba(0, 0, 0, .14);
  --sw-off: rgba(120, 120, 128, .2);
  --chk-line: rgba(0, 0, 0, .2);
  --scroll-shadow: rgba(0, 0, 0, .13);

  /* 给 app.js 的数字高亮用（Web Animations 读取） */
  --flash-up: rgba(52, 199, 89, .24);
  --flash-down: rgba(255, 59, 48, .18);
  --flash-neu: rgba(0, 113, 227, .12);

  --ease: cubic-bezier(.28, .11, .32, 1);
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --spring: cubic-bezier(.34, 1.56, .64, 1);
  --nav-h: 52px;
  --r-xl: 28px;
  --r-lg: 22px;
  --r: 18px;
  --pill: 980px;
  --gutter: clamp(22px, 3.2vw, 44px);
  --maxw: 1280px;
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }

/* ================================================================
   设计变量（夜间）：纯黑背景、#1c1c1e 卡片、发丝线
   ① 跟随系统且系统是深色 ② 手动选了夜间 —— 两份内容必须一致
   ================================================================ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #000000;
    --card: #1c1c1e;
    --card-glass: rgba(28, 28, 30, .82);
    --elev: #2c2c2e;
    --text: #f5f5f7;
    --text-2: #a1a1a6;
    --text-3: #7c7c80;
    --hair: rgba(255, 255, 255, .12);
    --hair-2: rgba(255, 255, 255, .075);
    --fill: rgba(255, 255, 255, .04);
    --fill-2: rgba(255, 255, 255, .075);
    --fill-3: rgba(255, 255, 255, .13);
    --btn-2: #2c2c2e;
    --btn-2-hover: #3a3a3c;
    --seg-bg: rgba(118, 118, 128, .24);
    --seg-ind: #636366;
    --seg-ind-shadow: 0 3px 8px rgba(0, 0, 0, .28), 0 3px 1px rgba(0, 0, 0, .1);

    --blue: #2997ff;
    --blue-hover: #47a6ff;
    --link: #2997ff;
    --blue-tint: rgba(41, 151, 255, .16);
    --blue-line: rgba(41, 151, 255, .34);
    --green: #30d158;
    --green-text: #30d158;
    --green-tint: rgba(48, 209, 88, .16);
    --red: #ff453a;
    --red-text: #ff6961;
    --red-tint: rgba(255, 69, 58, .16);
    --orange: #ff9f0a;
    --orange-text: #ffb340;
    --orange-tint: rgba(255, 159, 10, .16);
    --purple: #bf5af2;
    --purple-text: #da8fff;
    --purple-tint: rgba(191, 90, 242, .18);
    --yellow: #ffd60a;
    --yellow-text: #ffd60a;
    --yellow-tint: rgba(255, 214, 10, .15);
    --mult-shadow: .38;

    --nav-bg: rgba(22, 22, 23, .72);
    --card-border: rgba(255, 255, 255, .07);
    --shadow: none;
    --shadow-hover: 0 18px 44px rgba(0, 0, 0, .55);
    --shadow-lg: 0 30px 80px rgba(0, 0, 0, .6);
    --shadow-menu: 0 18px 50px rgba(0, 0, 0, .55), 0 0 0 .5px rgba(255, 255, 255, .12);
    --shadow-login: 0 0 0 1px rgba(255, 255, 255, .07), 0 30px 80px rgba(0, 0, 0, .7);
    --overlay: rgba(0, 0, 0, .55);
    --tip-bg: rgba(58, 58, 60, .95);
    --toast-bg: rgba(44, 44, 46, .94);

    --av-s1: 32%;
    --av-l1: 22%;
    --av-s2: 75%;
    --av-l2: 76%;
    --av-ring: rgba(255, 255, 255, .08);
    --glow-a: rgba(255, 159, 10, .13);
    --glow-b: rgba(255, 55, 95, .15);
    --glow-c: rgba(191, 90, 242, .2);
    --prime-shadow: 0 0 0 1px rgba(255, 255, 255, .08);
    --sw-off: rgba(120, 120, 128, .32);
    --chk-line: rgba(255, 255, 255, .26);
    --scroll-shadow: rgba(0, 0, 0, .6);

    --flash-up: rgba(48, 209, 88, .3);
    --flash-down: rgba(255, 69, 58, .28);
    --flash-neu: rgba(41, 151, 255, .24);
  }
}
:root[data-theme="dark"] {
  --bg: #000000;
  --card: #1c1c1e;
  --card-glass: rgba(28, 28, 30, .82);
  --elev: #2c2c2e;
  --text: #f5f5f7;
  --text-2: #a1a1a6;
  --text-3: #7c7c80;
  --hair: rgba(255, 255, 255, .12);
  --hair-2: rgba(255, 255, 255, .075);
  --fill: rgba(255, 255, 255, .04);
  --fill-2: rgba(255, 255, 255, .075);
  --fill-3: rgba(255, 255, 255, .13);
  --btn-2: #2c2c2e;
  --btn-2-hover: #3a3a3c;
  --seg-bg: rgba(118, 118, 128, .24);
  --seg-ind: #636366;
  --seg-ind-shadow: 0 3px 8px rgba(0, 0, 0, .28), 0 3px 1px rgba(0, 0, 0, .1);

  --blue: #2997ff;
  --blue-hover: #47a6ff;
  --link: #2997ff;
  --blue-tint: rgba(41, 151, 255, .16);
  --blue-line: rgba(41, 151, 255, .34);
  --green: #30d158;
  --green-text: #30d158;
  --green-tint: rgba(48, 209, 88, .16);
  --red: #ff453a;
  --red-text: #ff6961;
  --red-tint: rgba(255, 69, 58, .16);
  --orange: #ff9f0a;
  --orange-text: #ffb340;
  --orange-tint: rgba(255, 159, 10, .16);
  --purple: #bf5af2;
  --purple-text: #da8fff;
  --purple-tint: rgba(191, 90, 242, .18);
  --yellow: #ffd60a;
  --yellow-text: #ffd60a;
  --yellow-tint: rgba(255, 214, 10, .15);
  --mult-shadow: .38;

  --nav-bg: rgba(22, 22, 23, .72);
  --card-border: rgba(255, 255, 255, .07);
  --shadow: none;
  --shadow-hover: 0 18px 44px rgba(0, 0, 0, .55);
  --shadow-lg: 0 30px 80px rgba(0, 0, 0, .6);
  --shadow-menu: 0 18px 50px rgba(0, 0, 0, .55), 0 0 0 .5px rgba(255, 255, 255, .12);
  --shadow-login: 0 0 0 1px rgba(255, 255, 255, .07), 0 30px 80px rgba(0, 0, 0, .7);
  --overlay: rgba(0, 0, 0, .55);
  --tip-bg: rgba(58, 58, 60, .95);
  --toast-bg: rgba(44, 44, 46, .94);

  --av-s1: 32%;
  --av-l1: 22%;
  --av-s2: 75%;
  --av-l2: 76%;
  --av-ring: rgba(255, 255, 255, .08);
  --glow-a: rgba(255, 159, 10, .13);
  --glow-b: rgba(255, 55, 95, .15);
  --glow-c: rgba(191, 90, 242, .2);
  --prime-shadow: 0 0 0 1px rgba(255, 255, 255, .08);
  --sw-off: rgba(120, 120, 128, .32);
  --chk-line: rgba(255, 255, 255, .26);
  --scroll-shadow: rgba(0, 0, 0, .6);

  --flash-up: rgba(48, 209, 88, .3);
  --flash-down: rgba(255, 69, 58, .28);
  --flash-neu: rgba(41, 151, 255, .24);
}

/* 切换外观时颜色柔和过渡（只在点按钮后的半秒内生效） */
html.theme-anim, html.theme-anim *, html.theme-anim *::before, html.theme-anim *::after {
  transition: background-color .45s var(--ease), color .45s var(--ease), border-color .45s var(--ease), fill .45s var(--ease), stroke .45s var(--ease), box-shadow .45s var(--ease) !important;
}

/* ================================================================
   基础
   ================================================================ */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html {
  overflow-anchor: none; /* app.js 自己做滚动锚定 */
  -webkit-text-size-adjust: 100%;
  background: var(--bg);
}
body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.47;
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
::selection { background: rgba(0, 113, 227, .2); }
a { color: var(--link); text-decoration: none; }
button { font: inherit; color: inherit; }
b, strong { font-weight: 600; }
.hero-sub, .sec-sub, .empty-text, .unlock-note, .es-text, .dlg-text, .fg-sub, .prime-desc { text-wrap: balance; }
:focus { outline: none; }
:focus-visible { outline: none; box-shadow: 0 0 0 4px var(--blue-line); }

/* 图标库：不能 display:none，否则里面的渐变定义不渲染 */
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }

.ic { width: 18px; height: 18px; flex: none; display: inline-block; vertical-align: middle; overflow: visible; }
.sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.wrap {
  max-width: calc(var(--maxw) + var(--gutter) * 2);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.card {
  background: var(--card);
  border-radius: var(--r-lg);
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow);
}

.grad-brand {
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

/* ================================================================
   按钮
   ================================================================ */
.btn {
  appearance: none;
  -webkit-appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 36px;
  padding: 0 18px;
  border: 0;
  border-radius: var(--pill);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -.01em;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  user-select: none;
  transition: background-color .25s var(--ease), color .25s var(--ease), box-shadow .25s var(--ease), transform .2s var(--ease), opacity .2s;
}
.btn .ic { width: 16px; height: 16px; }
.btn:active:not(:disabled) { transform: scale(.97); }
.btn:disabled { opacity: .42; cursor: default; }
.btn-primary { background: var(--blue); color: #fff; }
.btn-primary:hover:not(:disabled) { background: var(--blue-hover); }
.btn-secondary { background: var(--btn-2); color: var(--text); }
.btn-secondary:hover:not(:disabled) { background: var(--btn-2-hover); }
.btn-danger { background: var(--red); color: #fff; }
.btn-danger:hover:not(:disabled) { filter: brightness(1.06); }
.btn-plain-danger { background: transparent; color: var(--red-text); padding: 0 14px; }
.btn-plain-danger:hover:not(:disabled) { background: var(--red-tint); }
.btn-sm { height: 32px; padding: 0 14px; font-size: 13px; }
.btn-sm .ic { width: 14px; height: 14px; }
.btn-lg { height: 48px; padding: 0 30px; font-size: 17px; font-weight: 500; }

.linkbtn {
  appearance: none;
  border: 0;
  background: none;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 14px;
  color: var(--link);
  cursor: pointer;
}
.linkbtn:hover { text-decoration: underline; text-underline-offset: 3px; }

.icon-btn {
  appearance: none;
  border: 0;
  padding: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: transparent;
  color: var(--text-2);
  cursor: pointer;
  transition: background-color .2s var(--ease), color .2s var(--ease), opacity .25s var(--ease), transform .2s var(--ease);
}
.icon-btn:hover { background: var(--fill-2); color: var(--text); }
.icon-btn:active { transform: scale(.9); }
.icon-btn .ic { width: 18px; height: 18px; }
.icon-btn-xs { width: 22px; height: 22px; }
.icon-btn-xs .ic { width: 13px; height: 13px; }

/* 复制按钮：成功后换成对勾 */
.copy .i-ok, .copy-text .i-ok { display: none; }
.copy.copied .i-copy, .copy-text.copied .i-copy { display: none; }
.copy.copied .i-ok, .copy-text.copied .i-ok { display: inline-block; }
.copy.copied { color: var(--green); opacity: 1; }
.copy-text.copied, .copy-text.copied:hover { background: var(--green-tint); color: var(--green-text); }

/* ================================================================
   顶部导航
   ================================================================ */
.nav {
  position: sticky;
  top: 0;
  z-index: 800;
  height: var(--nav-h);
  background: var(--nav-bg);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid transparent;
  transition: border-color .4s var(--ease);
}
.nav.scrolled { border-bottom-color: var(--hair); }
.nav-in {
  height: 100%;
  max-width: calc(var(--maxw) + var(--gutter) * 2);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 20px;
}
.brand {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: var(--text);
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: -.02em;
  white-space: nowrap;
}
.brand:hover { color: var(--text); }
.brand-mark {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--grad-brand-d);
  box-shadow: 0 2px 8px rgba(255, 55, 95, .28), inset 0 0 0 .5px rgba(255, 255, 255, .25);
}
.brand-mark .ic { width: 18px; height: 18px; }
.brand-name { overflow: hidden; text-overflow: ellipsis; }

.nav-right {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

/* ---------------- 分段控件（滑动指示块） ---------------- */
.seg {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 2px;
  border-radius: var(--pill);
  background: var(--seg-bg);
  isolation: isolate;
  flex: none;
}
.seg-ind {
  position: absolute;
  top: 2px;
  bottom: 2px;
  left: 0;
  width: 0;
  z-index: -1;
  border-radius: var(--pill);
  background: var(--seg-ind);
  box-shadow: var(--seg-ind-shadow);
  opacity: 0;
  pointer-events: none;
}
/* 只在初次定位完成后才启用过渡，避免加载时从左边滑进来 */
.seg.ready .seg-ind {
  transition: transform .5s var(--ease), width .5s var(--ease), opacity .3s var(--ease);
}
.seg-btn {
  position: relative;
  appearance: none;
  border: 0;
  background: transparent;
  height: 30px;
  padding: 0 18px;
  border-radius: var(--pill);
  color: var(--text-2);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -.005em;
  white-space: nowrap;
  cursor: pointer;
  transition: color .3s var(--ease);
}
.seg-btn:hover, .seg-btn.is-on { color: var(--text); }
.nav .seg-btn { padding: 0 22px; }
.seg-dot {
  display: none;
  position: absolute;
  top: 5px;
  right: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 0 2px var(--nav-bg);
}
.seg-btn.has-dot .seg-dot { display: block; animation: dotPulse 1.8s var(--ease) infinite; }
.seg-sm .seg-btn { height: 28px; padding: 0 13px; font-size: 12.5px; }
#tok-sort .seg-btn.is-on::after {
  content: "↓";
  display: inline-block;
  margin-left: 3px;
  font-size: 11px;
  opacity: .5;
}
#tok-sort .seg-btn.is-on.asc::after { content: "↑"; }

/* ---------------- 声音 / 状态胶囊 ---------------- */
.pill-sound, .pill-status {
  height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 13px;
  border-radius: var(--pill);
  font-size: 12.5px;
  font-weight: 500;
  white-space: nowrap;
  flex: none;
}
.pill-sound {
  appearance: none;
  border: 0;
  cursor: pointer;
  background: var(--fill-2);
  color: var(--text);
  transition: background-color .3s var(--ease), color .3s var(--ease), transform .2s var(--ease), width .3s var(--ease);
}
.pill-sound .ic { width: 16px; height: 16px; }
.pill-sound:hover { background: var(--fill-3); }
.pill-sound:active { transform: scale(.95); }
.pill-sound.is-locked { background: var(--blue); color: #fff; animation: callout 2.6s var(--ease) infinite; }
.pill-sound.is-locked:hover { background: var(--blue-hover); }
.pill-sound.is-on { width: 32px; padding: 0; justify-content: center; }
.pill-sound.is-on .ps-text { display: none; }
.pill-sound.is-off { color: var(--text-2); }

.pill-status {
  background: var(--fill-2);
  color: var(--text);
  cursor: default;
  min-width: 0;
  transition: background-color .3s var(--ease), color .3s var(--ease);
}
.pill-status .dot {
  position: relative;
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--text-3);
  transition: background-color .3s var(--ease);
}
.pill-status .dot::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: inherit;
  opacity: 0;
}
.pill-status.is-ok .dot { background: var(--green); }
.pill-status.is-ok .dot::after { animation: breathe 2.4s var(--ease-out) infinite; }
.pill-status.is-busy .dot { background: var(--blue); }
.pill-status.is-busy .dot::after { animation: breathe 1.2s var(--ease-out) infinite; }
.pill-status.is-warn { background: var(--orange-tint); color: var(--orange-text); }
.pill-status.is-warn .dot { background: var(--orange); }
.pill-status.is-api { background: var(--yellow-tint); color: var(--yellow-text); }
.pill-status.is-api .dot { background: var(--yellow); }
.pill-status.is-api .dot::after { animation: breathe 3.2s var(--ease-out) infinite; }
.pill-status.is-off { color: var(--text-2); }
.pill-status.is-off .dot { animation: blink 1.4s ease-in-out infinite; }
.st-text { overflow: hidden; text-overflow: ellipsis; }
.st-s { display: none; }
.ps-s { display: none; }

/* ---------------- 外观切换（跟随系统 → 夜间 → 日间） ---------------- */
.theme-btn {
  appearance: none;
  flex: none;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: var(--fill-2);
  color: var(--text);
  cursor: pointer;
  transition: background-color .3s var(--ease), color .3s var(--ease), transform .2s var(--ease);
}
.theme-btn:hover { background: var(--fill-3); }
.theme-btn:active { transform: scale(.92); }
.theme-btn .ic { width: 17px; height: 17px; }
.theme-btn[data-mode="dark"] { color: #ffd60a; }
.theme-btn[data-mode="light"] { color: #ff9500; }

/* ---------------- 当前账号胶囊 + 菜单 ---------------- */
.user { position: relative; flex: none; }
.user-chip {
  appearance: none;
  height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px 0 3px;
  border: 0;
  border-radius: var(--pill);
  background: var(--fill-2);
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -.01em;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .3s var(--ease), transform .2s var(--ease);
}
.user-chip:hover, .user-chip[aria-expanded="true"] { background: var(--fill-3); }
.user-chip:active { transform: scale(.96); }
.user-av {
  --ua: linear-gradient(135deg, #64d2ff 0%, #0a84ff 100%);
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: var(--ua);
  color: #fff;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  box-shadow: inset 0 0 0 .5px rgba(255, 255, 255, .3), 0 1px 3px rgba(0, 0, 0, .12);
}
.user-av[data-u="b"] { --ua: linear-gradient(135deg, #ffb340 0%, #ff375f 100%); }
.user-av[data-u="x"] { --ua: linear-gradient(135deg, hsl(var(--uh, 280) 80% 68%) 0%, hsl(var(--uh, 280) 75% 50%) 100%); }
.user-av-lg { width: 40px; height: 40px; font-size: 17px; }
.user-chev { width: 12px; height: 12px; color: var(--text-2); transition: transform .35s var(--ease); }
.user-chip[aria-expanded="true"] .user-chev { transform: rotate(180deg); }
.user-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 10;
  width: 256px;
  padding: 6px;
  border-radius: 16px;
  background: var(--elev);
  -webkit-backdrop-filter: saturate(180%) blur(24px);
  backdrop-filter: saturate(180%) blur(24px);
  box-shadow: var(--shadow-menu);
  transform-origin: top right;
  opacity: 0;
  transform: translateY(-6px) scale(.97);
  transition: opacity .22s var(--ease), transform .35s var(--ease);
}
.user-menu.show { opacity: 1; transform: none; }
.um-head { display: flex; align-items: center; gap: 11px; padding: 10px 10px 12px; }
.um-id { min-width: 0; }
.um-name { font-size: 15px; font-weight: 600; letter-spacing: -.015em; }
.um-sub { margin-top: 1px; font-size: 12px; line-height: 1.4; color: var(--text-2); }
.um-item {
  appearance: none;
  width: 100%;
  height: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  border: 0;
  border-top: 1px solid var(--hair-2);
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background-color .2s var(--ease);
}
.um-item .ic { width: 17px; height: 17px; }
.um-item:hover, .um-item:focus-visible { background: var(--fill-2); border-top-color: transparent; }
.um-danger { color: var(--red-text); }
.um-danger:hover, .um-danger:focus-visible { background: var(--red-tint); }

/* ================================================================
   强提醒横幅
   ================================================================ */
.banner {
  position: fixed;
  top: calc(var(--nav-h) + 12px);
  left: 50%;
  z-index: 1005; /* 在“开始监控”遮罩之上，未解锁时也能看到并点“开启声音” */
  width: min(1120px, calc(100% - 32px));
  transform: translate(-50%, -18px) scale(.97);
  opacity: 0;
  pointer-events: none;
  transition: opacity .45s var(--ease), transform .6s var(--ease);
}
.banner.show { opacity: 1; transform: translate(-50%, 0) scale(1); pointer-events: auto; }
.banner-in {
  --b1: rgba(255, 59, 48, .93);
  --b2: rgba(255, 90, 60, .92);
  --b3: rgba(255, 149, 0, .92);
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 18px 18px 18px 20px;
  border-radius: var(--r-lg);
  color: #fff;
  background: linear-gradient(115deg, var(--b1) 0%, var(--b2) 48%, var(--b3) 100%);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  box-shadow: 0 22px 60px rgba(255, 59, 48, .32), 0 2px 6px rgba(0, 0, 0, .08), inset 0 0 0 1px rgba(255, 255, 255, .18);
}
.banner[data-type="primeLive"] .banner-in { --b1: rgba(191, 90, 242, .94); --b2: rgba(255, 55, 95, .92); --b3: rgba(255, 159, 10, .92); box-shadow: 0 22px 60px rgba(191, 90, 242, .34), inset 0 0 0 1px rgba(255, 255, 255, .18); }
.banner[data-type="newTemplate"] .banner-in { --b1: rgba(10, 132, 255, .94); --b2: rgba(94, 92, 230, .93); --b3: rgba(191, 90, 242, .92); box-shadow: 0 22px 60px rgba(10, 132, 255, .3), inset 0 0 0 1px rgba(255, 255, 255, .18); }
.banner-in::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .22) 45%, transparent 60%);
  transform: translateX(-100%);
  animation: sheen 3.6s var(--ease) infinite;
  pointer-events: none;
}
.banner-icon {
  position: relative;
  flex: none;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, .22);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
}
.banner-icon .ic { width: 26px; height: 26px; position: relative; z-index: 1; }
.bi-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .7);
  opacity: 0;
  animation: ring 2.4s var(--ease-out) infinite;
}
.bi-ring.r2 { animation-delay: 1.2s; }
.banner-body { flex: 1; min-width: 0; }
.banner-title {
  font-family: var(--font-display);
  font-size: 22px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -.02em;
}
.banner-detail {
  margin-top: 3px;
  font-size: 15px;
  line-height: 1.4;
  color: rgba(255, 255, 255, .92);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.banner-time { margin-left: 10px; font-size: 13px; font-weight: 500; color: rgba(255, 255, 255, .86); }
.banner-actions { flex: none; display: flex; align-items: center; gap: 10px; }
.banner-stop, .banner-ok {
  appearance: none;
  border: 0;
  height: 38px;
  padding: 0 18px;
  border-radius: var(--pill);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .25s var(--ease), transform .2s var(--ease), opacity .25s;
}
.banner-stop { background: rgba(255, 255, 255, .22); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22); }
.banner-stop:hover:not(:disabled) { background: rgba(255, 255, 255, .32); }
.banner-stop:disabled { opacity: .7; cursor: default; }
.banner-stop:active:not(:disabled), .banner-ok:active { transform: scale(.96); }
.banner-ok { background: #fff; color: #d70015; box-shadow: 0 4px 14px rgba(0, 0, 0, .12); }
.banner-ok:hover { background: rgba(255, 255, 255, .9); }
.banner[data-type="primeLive"] .banner-ok { color: #8944ab; }
.banner[data-type="newTemplate"] .banner-ok { color: #0060df; }
.bs-count { font-size: 12.5px; opacity: .8; font-weight: 500; }
.bs-count:empty { display: none; }
.eq { display: none; align-items: flex-end; gap: 2px; height: 14px; }
.eq i { display: block; width: 3px; height: 100%; border-radius: 2px; background: currentColor; transform-origin: bottom; transform: scaleY(.3); }
.banner.playing .eq { display: inline-flex; }
.banner.playing .eq i { animation: eq .9s ease-in-out infinite; }
.banner.playing .eq i:nth-child(2) { animation-delay: -.3s; }
.banner.playing .eq i:nth-child(3) { animation-delay: -.6s; }
.banner.playing .eq i:nth-child(4) { animation-delay: -.15s; }

/* ================================================================
   首屏
   ================================================================ */
.hero {
  position: relative;
  padding: 92px 0 8px;
  text-align: center;
}
.hero-glow {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(var(--nav-h) * -1);
  height: 760px;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
  -webkit-mask-image: linear-gradient(to bottom, #000 45%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 45%, transparent 100%);
}
.hero-glow::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 40px;
  width: 1180px;
  height: 560px;
  margin-left: -590px;
  background:
    radial-gradient(36% 46% at 28% 52%, var(--glow-a), transparent 72%),
    radial-gradient(34% 46% at 52% 38%, var(--glow-b), transparent 72%),
    radial-gradient(36% 50% at 74% 56%, var(--glow-c), transparent 72%);
  filter: blur(34px);
  animation: drift 22s ease-in-out infinite alternate;
}
.hero .wrap { position: relative; z-index: 1; }
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  height: 32px;
  padding: 0 15px 0 13px;
  border-radius: var(--pill);
  background: var(--card-glass);
  box-shadow: 0 0 0 1px var(--hair-2), 0 2px 10px rgba(0, 0, 0, .04);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-2);
}
.live-dot {
  position: relative;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
}
.live-dot::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: var(--green);
  animation: breathe 2.4s var(--ease-out) infinite;
}
.hero-title {
  margin: 22px auto 0;
  max-width: 900px;
  font-family: var(--font-display);
  font-size: clamp(48px, 4.9vw, 68px);
  line-height: 1.06;
  font-weight: 700;
  letter-spacing: -.028em;
}
.hero-sub {
  margin: 18px auto 0;
  max-width: 640px;
  font-size: 21px;
  line-height: 1.43;
  letter-spacing: -.012em;
  color: var(--text-2);
}

/* ---------------- 统计卡 ---------------- */
.stats {
  margin: 60px 0 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  text-align: left;
}
.stat {
  position: relative;
  min-width: 0;
  padding: 22px 22px 20px;
  background: var(--card);
  border-radius: 20px;
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow);
  transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.stat:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); }
.stat-label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-2);
  white-space: nowrap;
}
.stat-label .ic { width: 17px; height: 17px; }
.stat-value {
  width: fit-content;
  max-width: calc(100% + 8px);
  margin: 10px 0 0 -8px;
  padding: 0 8px;
  border-radius: 12px;
  font-family: var(--font-display);
  font-size: 40px;
  line-height: 1.12;
  font-weight: 600;
  letter-spacing: -.028em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 1120–1300px 五列时卡片较窄：“Coming soon”随卡片宽度缩小，不被截断成“Coming s…” */
.stat-prime { container-type: inline-size; }
.stat-prime .stat-value { font-size: 28px; font-size: min(28px, 16cqi); line-height: 44.8px; letter-spacing: -.02em; }
.stat-prime.is-live .prime-word {
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.stat-sub {
  margin-top: 5px;
  font-size: 13px;
  color: var(--text-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stat.has-new::after {
  content: "NEW";
  position: absolute;
  top: 20px;
  right: 18px;
  height: 18px;
  padding: 0 7px;
  display: inline-flex;
  align-items: center;
  border-radius: var(--pill);
  background: var(--grad-brand-d);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .05em;
}

/* ================================================================
   分区
   ================================================================ */
.section { padding-top: 112px; }
.section-settings { padding-bottom: 112px; }
.sec-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}
.sec-head > div:first-child { min-width: 0; }
.sec-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 40px;
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -.025em;
}
.sec-sub {
  margin: 10px 0 0;
  max-width: 760px;
  font-size: 19px;
  line-height: 1.42;
  letter-spacing: -.012em;
  color: var(--text-2);
}
.sec-actions { flex: none; display: flex; gap: 10px; padding-bottom: 4px; }
.sub-title {
  margin: 0 0 16px;
  font-family: var(--font-display);
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -.02em;
}

/* ================================================================
   头像（图片加载失败时显示首字母圆形）
   ================================================================ */
.av {
  --h: 210;
  --s: 36px;
  position: relative;
  flex: none;
  width: var(--s);
  height: var(--s);
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  background: hsl(var(--h) var(--av-s1) var(--av-l1));
  color: hsl(var(--h) var(--av-s2) var(--av-l2));
  font-size: calc(var(--s) * .42);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
}
.av::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px var(--av-ring);
  pointer-events: none;
}
.av-m { user-select: none; }
.av-i {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  background: var(--card);
  opacity: 0;
  transition: opacity .5s var(--ease);
}
.av-i.ok { opacity: 1; }
.av-xs { --s: 18px; font-size: 9px; }
.av-md { --s: 44px; }
.av-lg { --s: 44px; }

/* ================================================================
   实时异动卡片
   ================================================================ */
.alert-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr));
  gap: 20px;
}
.acard {
  --tint: rgba(255, 149, 0, .16);
  --tier: var(--grad-orange);
  --glow: rgba(255, 149, 0, .5);
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 24px 24px 22px;
  background: var(--card);
  border-radius: var(--r-lg);
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow);
  overflow: hidden;
  isolation: isolate;
  transition: box-shadow .5s var(--ease), translate .5s var(--ease);
}
.acard:hover { translate: 0 -3px; box-shadow: var(--shadow-hover); }
.acard::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -150px;
  right: -130px;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(closest-side, var(--tint), transparent);
  pointer-events: none;
}
.acard.t-pink { --tint: rgba(255, 45, 85, .14); --tier: var(--grad-pink); --glow: rgba(255, 45, 85, .45); }
.acard.t-purple { --tint: rgba(175, 82, 222, .17); --tier: var(--grad-purple); --glow: rgba(175, 82, 222, .5); }
.acard.glow { animation: cardGlow 3.2s var(--ease) 1; }
.ac-head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ac-id { flex: 1; min-width: 0; }
.ac-name {
  display: block;
  color: var(--text);
  font-size: 17px;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: -.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ac-name:hover { color: var(--link); }
.ac-sym {
  margin-top: 1px;
  font-size: 13px;
  color: var(--text-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ac-when {
  flex: none;
  align-self: flex-start;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  margin-top: 2px;
}
.ac-time { font-size: 13px; line-height: 1.3; color: var(--text-3); white-space: nowrap; }
.ac-lat {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 20px;
  padding: 0 8px 0 6px;
  border-radius: var(--pill);
  background: var(--green-tint);
  color: var(--green-text);
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
  cursor: default;
}
.ac-lat .ic { width: 12px; height: 12px; }
.ac-mrow {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px 12px;
  flex-wrap: wrap;
  min-width: 0;
}
.ac-mult {
  padding-bottom: 2px;
  font-family: var(--font-display);
  font-size: 56px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -.04em;
  white-space: nowrap;
  background: var(--tier);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.ac-tags { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; padding-bottom: 8px; }
.ac-path {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 2px 8px;
  padding: 11px 14px;
  border-radius: 14px;
  background: var(--fill-2);
  font-size: 14px;
  line-height: 1.4;
}
.ac-path .lbl { color: var(--text-2); }
.ac-path b { font-weight: 600; }
.ac-path .arrow { color: var(--text-3); }
.ac-path .p-now { color: var(--green-text); }
.ac-path .pg { display: inline-flex; align-items: baseline; gap: 0 8px; white-space: nowrap; }
.ac-path .mul { margin-left: -6px; color: var(--text-2); font-weight: 500; }
/* 配对与底池（12.5）：路径框下面一行小字，和框里的文字左对齐 */
.ac-pool {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 2px 7px;
  margin: -10px 14px 0;
  font-size: 12.5px;
  line-height: 1.4;
  color: var(--text-2);
}
.ac-pool .pg { display: inline-flex; align-items: baseline; gap: 0 5px; white-space: nowrap; }
.ac-pool b { font-weight: 600; color: var(--text); letter-spacing: -.01em; }
.ac-pool .sep { color: var(--text-3); }
.ac-pool [data-tip] { cursor: default; }
.ac-stats {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.ac-stats > div { min-width: 0; }
.ac-stats dt { font-size: 12px; color: var(--text-2); }
.ac-stats dd {
  margin: 2px 0 0;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.015em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ac-actions { display: flex; gap: 10px; margin-top: auto; }
.ac-actions .btn { flex: 1; min-width: 0; }
/* “复制合约”按钮直接显示缩写地址 */
.copy-text .cp-t { font-family: var(--mono); font-size: 12.5px; font-weight: 500; letter-spacing: -.02em; }
.copy-text.copied .cp-t { font-family: var(--font); letter-spacing: -.01em; }

.tag {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 9px;
  border-radius: var(--pill);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  white-space: nowrap;
}
.tag-test { background: var(--fill-3); color: var(--text-2); }
.tag-repeat { background: var(--purple-tint); color: var(--purple-text); }
.tag-startup { background: var(--blue-tint); color: var(--link); }
.tag-grad { background: var(--green-tint); color: var(--green-text); }
.tag-launch { background: var(--orange-tint); color: var(--orange-text); }

.more-row { display: flex; justify-content: center; padding-top: 28px; }
.more-row.in-card { padding: 16px; border-top: 1px solid var(--hair-2); }

/* ---------------- 空状态 ---------------- */
div.empty { text-align: center; padding: 64px 24px 68px; }
.section .wrap > div.empty, .empty-card {
  background: var(--card);
  border-radius: var(--r-lg);
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow);
}
div.empty-in { padding: 60px 24px 64px; }
.empty-title {
  margin-top: 22px;
  font-family: var(--font-display);
  font-size: 24px;
  line-height: 1.25;
  font-weight: 600;
  letter-spacing: -.02em;
}
.empty-text { margin: 8px auto 0; max-width: 480px; font-size: 15px; line-height: 1.55; color: var(--text-2); }
.empty-text:empty { display: none; }
div.empty .btn { margin-top: 20px; }
.empty-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--fill-2);
  color: var(--text-2);
}
.empty-icon .ic { width: 26px; height: 26px; }
.empty-icon + .empty-title { margin-top: 18px; }

/* 雷达扫描 */
.radar {
  position: relative;
  width: 136px;
  height: 136px;
  margin: 0 auto;
  border-radius: 50%;
  background: radial-gradient(circle, var(--blue-tint), transparent 70%);
}
.rd-c {
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  border: 1px solid var(--blue-line);
  transform: translate(-50%, -50%);
}
.rd-c.c1 { width: 136px; height: 136px; }
.rd-c.c2 { width: 90px; height: 90px; }
.rd-c.c3 { width: 44px; height: 44px; }
.rd-sweep {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(from 0deg, transparent 0deg 280deg, var(--blue-line) 350deg, rgba(0, 113, 227, .45) 360deg);
  animation: spin 3.6s linear infinite;
}
.rd-blip {
  position: absolute;
  width: 8px;
  height: 8px;
  margin: -4px 0 0 -4px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 4px var(--green-tint);
  opacity: 0;
  animation: blip 3.6s var(--ease) infinite;
}
.rd-blip.b1 { left: 70%; top: 30%; animation-delay: .35s; }
.rd-blip.b2 { left: 28%; top: 66%; animation-delay: 2.1s; }

/* ================================================================
   表格卡片（历史 / 新币）
   ================================================================ */
.table-card { overflow: clip; }
.toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 14px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--hair-2);
}
.tb-spacer { flex: 1 1 0; min-width: 0; }
.tb-count { font-size: 13px; color: var(--text-3); white-space: nowrap; }
.tb-label { font-size: 13px; color: var(--text-2); white-space: nowrap; }
.tb-sort { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.btn-refresh .ic { transition: transform .6s var(--ease); }
.btn-refresh:hover:not(:disabled) .ic { transform: rotate(90deg); }
.btn-refresh.spinning .ic { animation: spin .9s linear infinite; }

/* 精确刷新进度环 */
.dr { display: inline-flex; align-items: center; gap: 9px; min-width: 0; font-size: 13px; color: var(--text-2); }
.ring { width: 26px; height: 26px; flex: none; overflow: visible; }
.ring-bg { fill: none; stroke: var(--fill-3); stroke-width: 3.2; transition: stroke .4s var(--ease); }
.ring-fg {
  fill: none;
  stroke: var(--blue);
  stroke-width: 3.2;
  stroke-linecap: round;
  stroke-dasharray: 94.25;
  stroke-dashoffset: 94.25;
  transform: rotate(-90deg);
  transform-origin: center;
  transform-box: fill-box;
  transition: stroke-dashoffset .6s var(--ease), stroke .4s var(--ease), opacity .3s var(--ease);
}
.ring-check {
  color: var(--green);
  opacity: 0;
  transform: scale(.4);
  transform-origin: center;
  transform-box: fill-box;
  transition: opacity .3s var(--ease), transform .5s var(--spring);
}
.dr[data-state="idle"] .ring-fg { opacity: 0; }
.dr[data-state="running"] .dr-text { color: var(--text); font-weight: 500; }
.dr[data-state="done"] .ring-bg { stroke: var(--green-tint); }
.dr[data-state="done"] .ring-fg { stroke: var(--green); opacity: 0; }
.dr[data-state="done"] .ring-check { opacity: 1; transform: scale(.9); }
.dr-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dr-next { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-3); white-space: nowrap; }
.dr-next .ic { width: 14px; height: 14px; }

/* 搜索框 */
.search {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 1 300px;
  width: 300px;
  min-width: 200px;
  height: 36px;
  padding: 0 8px 0 12px;
  border-radius: var(--pill);
  background: var(--fill-2);
  cursor: text;
  transition: background-color .3s var(--ease), box-shadow .3s var(--ease);
}
.search:hover { background: var(--fill-3); }
.search:focus-within { background: var(--card); box-shadow: 0 0 0 1px var(--blue), 0 0 0 4px var(--blue-tint); }
.search > .ic { width: 16px; height: 16px; color: var(--text-2); }
.search input {
  flex: 1;
  min-width: 0;
  height: 100%;
  padding: 0 8px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  letter-spacing: -.01em;
}
.search input:focus-visible { box-shadow: none; }
.search input::placeholder { color: var(--text-3); }
.search input::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }
.search-x {
  appearance: none;
  flex: none;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--text-3);
  color: var(--card);
  cursor: pointer;
  transition: background-color .2s;
}
.search-x:hover { background: var(--text-2); }
.search-x .ic { width: 12px; height: 12px; }

/* ---------------- 表格 ---------------- */
.table-scroll {
  position: relative; /* 表头里 .sr 之类的绝对定位元素以它为包含块，不会撑出页面 */
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
}
.tbl {
  width: 100%;
  min-width: 1120px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-size: 14px;
}
.tbl.is-empty { display: none; }
.tbl th {
  position: sticky;
  top: var(--nav-h);
  z-index: 2;
  height: 44px;
  padding: 0 10px;
  text-align: left;
  vertical-align: middle;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  color: var(--text-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: var(--card-glass);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--hair);
  user-select: none;
}
.tbl th[data-sort] { cursor: pointer; transition: color .2s var(--ease); }
.tbl th[data-sort]:hover, .tbl th.sorted { color: var(--text); }
.th-in { position: relative; display: inline-block; max-width: 100%; vertical-align: middle; }
.sort-ic {
  --su: .28;
  --sd: .28;
  position: absolute;
  top: 50%;
  left: 100%;
  width: 10px;
  height: 10px;
  margin: -5px 0 0 3px;
  opacity: 0;
  transition: opacity .2s var(--ease);
}
/* 右对齐的列把箭头放在文字左边，表头文字和数字右边缘对齐 */
.tbl th.r .sort-ic { left: auto; right: 100%; margin: -5px 3px 0 0; }
.tbl th[data-sort]:hover .sort-ic, .tbl th[data-sort]:focus-visible .sort-ic { opacity: .75; }
.tbl th.sorted .sort-ic { opacity: 1; --su: .22; --sd: 1; }
.tbl th.sorted.asc .sort-ic { --su: 1; --sd: .22; }
.tbl th:first-child, .tbl td:first-child { padding-left: 24px; }
.tbl th:last-child, .tbl td:last-child { padding-right: 20px; }
.tbl td {
  height: 66px;
  padding: 10px 10px;
  vertical-align: middle;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-bottom: 1px solid var(--hair-2);
  transition: background-color .25s var(--ease);
}
.tbl tbody tr:last-child td { border-bottom: 0; }
.tbl tbody tr:hover td { background: var(--fill); }
.tbl .r { text-align: right; }
.tbl .c { text-align: center; }
.tbl tr.is-alerted td:first-child { box-shadow: inset 3px 0 0 var(--orange); }

/* 列宽（table-layout: fixed；第一列吃掉剩余宽度） */
.tbl-history col:nth-child(2) { width: 8.5%; }
.tbl-history col:nth-child(3) { width: 9.5%; }
.tbl-history col:nth-child(4) { width: 10.5%; }
.tbl-history col:nth-child(5) { width: 9.5%; }
.tbl-history col:nth-child(6) { width: 8%; }
.tbl-history col:nth-child(7) { width: 9.5%; }
.tbl-history col:nth-child(8) { width: 8%; }
.tbl-history col:nth-child(9) { width: 7.5%; }
.tbl-history col:nth-child(10) { width: 60px; }
.tbl-tokens col:nth-child(2) { width: 7.5%; }
.tbl-tokens col:nth-child(3) { width: 9.5%; }
.tbl-tokens col:nth-child(4) { width: 7.5%; }
.tbl-tokens col:nth-child(5) { width: 7.5%; }
.tbl-tokens col:nth-child(6) { width: 7.5%; }
.tbl-tokens col:nth-child(7) { width: 136px; }
.tbl-tokens col:nth-child(8) { width: 7%; }
.tbl-tokens col:nth-child(9) { width: 8.5%; }
.tbl-tokens col:nth-child(10) { width: 12%; }

@media (min-width: 1180px) {
  /* 够宽时不需要横向滚动，表头吸顶 */
  .table-scroll { overflow: visible; }
  .tbl { min-width: 0; }
}
@media (max-width: 1179.98px) {
  /* 窄屏：表格在卡片里横向滚动。滚动容器里 sticky 会被错位，改回普通表头；两侧用阴影提示还能滚 */
  .tbl th { position: relative; top: auto; background: var(--card); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .table-scroll {
    background:
      linear-gradient(to right, var(--card) 30%, transparent) left center / 48px 100% no-repeat local,
      linear-gradient(to left, var(--card) 30%, transparent) right center / 48px 100% no-repeat local,
      radial-gradient(farthest-side at 0 50%, var(--scroll-shadow), transparent) left center / 14px 100% no-repeat scroll,
      radial-gradient(farthest-side at 100% 50%, var(--scroll-shadow), transparent) right center / 14px 100% no-repeat scroll;
  }
}

/* 数值单元（高亮用圆角底色；滚动换字时两层叠放） */
.v {
  display: inline-block;
  max-width: 100%;
  padding: 1px 6px;
  margin: -1px -6px;
  border-radius: 7px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.rolling { display: inline-grid; overflow: hidden; text-overflow: clip; }
.rolling > .ro, .rolling > .rn { grid-area: 1 / 1; white-space: nowrap; }
.tbl td .v { font-weight: 500; max-width: none; }
.sm, .tbl .v.sm { display: block; font-size: 12px; font-weight: 400; color: var(--text-2); }
.stack { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; min-width: 0; }
.stack > * { max-width: 100%; }
.stack .sm { overflow: hidden; text-overflow: ellipsis; }
.c-first .rel-v { font-size: 14px; font-weight: 500; }
.c-first .sm { margin-top: 3px; }
.c-created .rel-v { color: var(--text-2); }
.cnt { color: var(--text-2); }

/* 币单元 */
.tok { display: flex; align-items: center; gap: 12px; min-width: 0; }
.tok-meta { flex: 1; min-width: 0; }
.tok-row { display: flex; align-items: center; gap: 5px; min-width: 0; }
.tok-name {
  min-width: 0;
  color: var(--text);
  font-size: 15px;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: -.015em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tok-name:hover { color: var(--link); }
.flame { width: 15px; height: 15px; }
.tok-sub { display: flex; align-items: center; gap: 6px; min-width: 0; margin-top: 2px; height: 22px; }
.tok-sym {
  min-width: 0;
  font-size: 12.5px;
  color: var(--text-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mini-tag {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 7px;
  border-radius: var(--pill);
  background: var(--green-tint);
  color: var(--green-text);
  font-size: 11px;
  font-weight: 600;
}
.mini-tag.mt-launch { background: var(--orange-tint); color: var(--orange-text); }
.tok-row .mini-tag { margin-left: 2px; }

/* 合约地址缩写（0xf154…feeee）：等宽、次要色，点一下复制完整地址 */
.addr {
  appearance: none;
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 20px;
  margin: 0 -4px 0 -1px;
  padding: 0 4px 0 5px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -.02em;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
.addr .ic { width: 11px; height: 11px; opacity: 0; transition: opacity .2s var(--ease); }
.addr .i-ok { display: none; }
.addr:hover, .addr:focus-visible { background: var(--fill-2); color: var(--text); }
.addr:hover .i-copy, .addr:focus-visible .i-copy { opacity: .75; }
.addr.copied, .addr.copied:hover { background: var(--green-tint); color: var(--green-text); }
.addr.copied .i-copy { display: none; }
.addr.copied .i-ok { display: inline-block; opacity: 1; }
@media (hover: none) { .addr .i-copy { opacity: .6; } }

/* 倍数：徽章与文字 */
.mb, .mx { display: inline-flex; align-items: center; max-width: 100%; white-space: nowrap; letter-spacing: -.01em; }
.mb {
  height: 24px;
  padding: 0 10px;
  border-radius: var(--pill);
  background: var(--fill-2);
  color: var(--text-2);
  font-size: 13px;
  font-weight: 700;
}
.mx { font-size: 14px; font-weight: 600; }
.mb .v, .mx .v, .tbl td .mb .v, .tbl td .mx .v {
  /* 徽章里不能用负外边距：inline-flex 的 max-width:100% 会把文字挤成省略号 */
  margin: 0;
  padding: 0 1px;
  max-width: none;
  overflow: visible;
  font-weight: inherit;
  border-radius: 5px;
}
.mx.mx-up { color: var(--green-text); }
.mx.mx-down { color: var(--red-text); }
.mx.mx-flat { color: var(--text-2); }
.mx.mx-none { color: var(--text-3); font-weight: 500; }
.mb.t-orange, .mb.t-pink, .mb.t-purple,
.mx.t-orange, .mx.t-pink, .mx.t-purple {
  height: 24px;
  padding: 0 10px;
  border-radius: var(--pill);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}
.mb.t-orange, .mx.t-orange { background: var(--grad-orange); box-shadow: 0 2px 8px rgba(255, 133, 0, var(--mult-shadow)); }
.mb.t-pink, .mx.t-pink { background: var(--grad-pink); box-shadow: 0 2px 8px rgba(255, 45, 85, var(--mult-shadow)); }
.mb.t-purple, .mx.t-purple { background: var(--grad-purple); box-shadow: 0 2px 8px rgba(142, 92, 255, calc(var(--mult-shadow) + .03)); }

/* 迷你走势图 */
.c-spark { padding-top: 0; padding-bottom: 0; }
.spark { display: block; width: 112px; height: 32px; margin: 0 auto; overflow: visible; }
.spark .ln { fill: none; stroke: var(--text-3); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.spark .ar { fill: none; stroke: none; }
.spark .dt { fill: var(--text-3); }
.spark.up .ln { stroke: var(--green); }
.spark.up .ar { fill: url(#g-spark-up); }
.spark.up .dt { fill: var(--green); }
.spark.down .ln { stroke: var(--red); }
.spark.down .ar { fill: url(#g-spark-down); }
.spark.down .dt { fill: var(--red); }
.spark.flat .ln { stroke: var(--text-3); }
.spark.flat .dt { fill: var(--text-3); }
.spark.empty .ln { stroke: var(--hair); stroke-dasharray: 2 4; }

/* 进度 */
.prog { display: flex; align-items: center; gap: 9px; min-width: 0; }
.prog-bar {
  position: relative;
  flex: 1 1 auto;
  max-width: 64px;
  min-width: 28px;
  height: 5px;
  border-radius: 3px;
  background: var(--fill-3);
  overflow: hidden;
}
.prog-bar i {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #0a84ff, #64d2ff);
  transition: width .7s var(--ease);
}
.prog-v { flex: none; font-size: 12.5px; color: var(--text-2); }
.grad-pill {
  display: none;
  align-items: center;
  gap: 4px;
  height: 22px;
  padding: 0 9px 0 7px;
  border-radius: var(--pill);
  background: var(--green-tint);
  color: var(--green-text);
  font-size: 12px;
  font-weight: 600;
}
.grad-pill .ic { width: 12px; height: 12px; }
.c-prog.is-grad .prog { display: none; }
.c-prog.is-grad .grad-pill { display: inline-flex; }

/* 计价资产胶囊 */
.qt {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  height: 26px;
  padding: 0 10px 0 4px;
  border-radius: var(--pill);
  background: var(--fill-2);
  font-size: 12.5px;
  font-weight: 500;
  vertical-align: middle;
}
.qt-s { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 删除按钮 */
.tbl td.c-act { overflow: visible; text-overflow: clip; padding-left: 0; padding-right: 14px; }
.del { color: var(--text-3); opacity: .7; }
.tbl tr:hover .del { opacity: 1; }
.del:hover { color: var(--red); background: var(--red-tint); }

/* ================================================================
   Prime 状态卡
   ================================================================ */
.prime {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 28px 56px;
  margin-bottom: 20px;
  padding: 44px 48px;
  border-radius: var(--r-lg);
  color: #f5f5f7;
  background: #0a0a0c;
  box-shadow: var(--prime-shadow);
}
.prime-glow {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(55% 95% at 90% -10%, rgba(191, 90, 242, .42), transparent 62%),
    radial-gradient(45% 80% at 68% 120%, rgba(255, 55, 95, .26), transparent 62%),
    radial-gradient(30% 60% at 8% 110%, rgba(255, 159, 10, .14), transparent 60%),
    linear-gradient(135deg, #1d1d1f 0%, #050505 100%);
}
.prime-main { min-width: 0; }
.prime-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .01em;
  color: #f7c95c;
}
.prime-eyebrow .ic { width: 18px; height: 18px; }
.prime-state {
  margin-top: 10px;
  font-family: var(--font-display);
  font-size: 56px;
  line-height: 1.06;
  font-weight: 700;
  letter-spacing: -.035em;
  color: #fff;
}
.prime[data-state="unknown"] .prime-state { color: rgba(255, 255, 255, .5); }
.prime[data-state="live"] .prime-state {
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.prime[data-state="live"] { box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 26px 70px rgba(191, 90, 242, .35); }
.prime[data-state="live"] .prime-glow { animation: primeGlow 4s ease-in-out infinite alternate; }
.prime-desc { margin: 14px 0 0; max-width: 560px; font-size: 17px; line-height: 1.5; color: rgba(255, 255, 255, .64); }
.prime-meta {
  margin: 0;
  display: grid;
  gap: 14px;
  min-width: 200px;
  padding-left: 32px;
  border-left: 1px solid rgba(255, 255, 255, .14);
}
.prime-meta dt { font-size: 12px; color: rgba(255, 255, 255, .5); }
.prime-meta dd { margin: 2px 0 0; font-size: 15px; font-weight: 600; color: #fff; white-space: nowrap; }

/* ================================================================
   发币资产
   ================================================================ */
.asset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(232px, 100%), 1fr));
  gap: 16px;
}
.asset {
  position: relative;
  min-width: 0;
  padding: 20px 20px 18px;
  background: var(--card);
  border-radius: 20px;
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow);
  transition: box-shadow .5s var(--ease), translate .5s var(--ease), opacity .4s var(--ease);
}
.asset:hover { translate: 0 -2px; box-shadow: var(--shadow-hover); }
.asset.is-new {
  border: 1.5px solid transparent;
  background: linear-gradient(var(--card), var(--card)) padding-box, var(--grad-brand-d) border-box;
  box-shadow: 0 10px 30px rgba(255, 55, 95, .14);
}
.asset.off { opacity: .55; }
.asset.off .av { filter: grayscale(1); }
.new-badge {
  position: absolute;
  top: 18px;
  right: 16px;
  height: 20px;
  padding: 0 8px;
  display: inline-flex;
  align-items: center;
  border-radius: var(--pill);
  background: var(--grad-brand-d);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .05em;
  box-shadow: 0 3px 10px rgba(255, 55, 95, .3);
}
.asset-top { display: flex; align-items: center; gap: 12px; min-width: 0; }
.asset.is-new .asset-top { padding-right: 52px; }
.asset-id { min-width: 0; }
.asset-sym {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.asset-key {
  font-size: 12.5px;
  color: var(--text-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.asset-key.is-off { color: var(--red-text); font-weight: 500; }
.asset-stats {
  margin: 16px 0 0;
  padding-top: 13px;
  border-top: 1px solid var(--hair-2);
  display: grid;
  gap: 7px;
}
.asset-stats > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; min-width: 0; }
.asset-stats dt { flex: none; font-size: 13px; color: var(--text-2); }
.asset-stats dd {
  margin: 0;
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.asset-stats dd.v { margin: -1px -6px; }

/* 特别提醒记录 */
.events { margin-top: 56px; }
.events-card { padding: 6px 0; }
.events-list { list-style: none; margin: 0; padding: 0; }
.ev { position: relative; display: flex; align-items: center; gap: 14px; padding: 14px 22px; }
.ev + .ev::before {
  content: "";
  position: absolute;
  top: 0;
  left: 72px;
  right: 22px;
  height: 1px;
  background: var(--hair-2);
}
.ev-ic {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, #ff9f0a, #ff375f);
  box-shadow: 0 3px 10px rgba(255, 55, 95, .2);
}
.ev[data-type="primeLive"] .ev-ic { background: var(--grad-purple); box-shadow: 0 3px 10px rgba(142, 92, 255, .25); }
.ev[data-type="newTemplate"] .ev-ic { background: linear-gradient(135deg, #64d2ff, #0a84ff); box-shadow: 0 3px 10px rgba(10, 132, 255, .22); }
.ev-ic .ic { width: 18px; height: 18px; }
.ev-body { flex: 1; min-width: 0; }
.ev-t { font-size: 15px; font-weight: 600; letter-spacing: -.015em; }
.ev-d { font-size: 13px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev-side { flex: none; display: flex; align-items: center; gap: 10px; }
.ev-time { font-size: 13px; color: var(--text-3); white-space: nowrap; }

/* ================================================================
   设置
   ================================================================ */
.settings {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.set-card { padding: 4px 24px; }
.set-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 76px;
  padding: 16px 0;
  border-top: 1px solid var(--hair-2);
}
.set-row:first-child { border-top: 0; }
.set-info { min-width: 0; }
.set-t { font-size: 16px; font-weight: 600; letter-spacing: -.015em; }
.set-d { margin-top: 2px; font-size: 13px; line-height: 1.45; color: var(--text-2); }
.set-row .btn { flex: none; }

/* iOS 开关 */
.switch { position: relative; flex: none; display: inline-flex; cursor: pointer; }
.switch input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.sw-track {
  position: relative;
  width: 51px;
  height: 31px;
  border-radius: 16px;
  background: var(--sw-off);
  transition: background-color .3s var(--ease), box-shadow .25s var(--ease);
}
.sw-knob {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 3px 8px rgba(0, 0, 0, .15), 0 3px 1px rgba(0, 0, 0, .06);
  transition: transform .4s var(--ease);
}
.switch input:checked + .sw-track { background: var(--green); }
.switch input:checked + .sw-track .sw-knob { transform: translateX(20px); }
.switch input:focus-visible { box-shadow: none; }
.switch input:focus-visible + .sw-track { box-shadow: 0 0 0 4px var(--blue-line); }
.switch input:disabled { cursor: default; }
.switch input:disabled + .sw-track { opacity: .45; }

.about { padding: 6px 24px; }
.about-list { margin: 0; }
.about-list > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-top: 1px solid var(--hair-2);
}
.about-list > div:first-child { border-top: 0; }
.about-list dt { flex: none; font-size: 14px; color: var(--text-2); }
.about-list dd { margin: 0; min-width: 0; font-size: 14px; font-weight: 500; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------------- Bark 推送（12.6）：左栏第二张卡片，右边的“关于”跨两行 ---------------- */
.settings > .about { grid-column: 2; grid-row: 1 / span 2; }
.settings > .bark { grid-column: 1; }
.bark-head { justify-content: flex-start; gap: 14px; }
.bark-head .set-info { flex: 1; }
.bark-head .switch { margin-left: 6px; }
.bark-app {
  flex: none;
  align-self: flex-start;
  width: 38px;
  height: 38px;
  margin-top: 1px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(180deg, #ff6a61 0%, #ff3b30 100%);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08), 0 1px 2px rgba(255, 59, 48, .22);
}
.bark-app .ic { width: 21px; height: 21px; }
.bark-sec { padding: 16px 0; border-top: 1px solid var(--hair-2); }

/* 粘贴网址 */
.bf-row { display: flex; gap: 10px; min-width: 0; }
.bark-input {
  flex: 1;
  min-width: 0;
  height: 44px;
  padding: 0 14px;
  border: 0;
  border-radius: 12px;
  outline: 0;
  appearance: none;
  background: var(--fill-2);
  color: var(--text);
  font: inherit;
  font-size: 15px;
  letter-spacing: -.01em;
  transition: background-color .25s var(--ease), box-shadow .25s var(--ease);
}
.bark-input::placeholder { color: var(--text-3); }
.bark-input:hover { background: var(--fill-3); }
.bark-input:focus { background: var(--card); box-shadow: 0 0 0 1px var(--blue), 0 0 0 4px var(--blue-tint); }
.bark-input[aria-invalid="true"] { box-shadow: 0 0 0 1px var(--red), 0 0 0 4px var(--red-tint); }
.bark-input:read-only { color: var(--text-2); }
.bf-row .btn { flex: none; height: 44px; padding: 0 20px; font-size: 15px; }
.bf-hint { margin: 9px 2px 0; font-size: 12.5px; line-height: 1.5; color: var(--text-3); }
.bf-msg {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 9px 2px 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--red-text);
  animation: msgIn .4s var(--ease) 1;
}
.bf-msg .ic { flex: none; width: 16px; height: 16px; margin-top: 1px; }

/* 已绑定 ••••3456 */
.bark-bound { display: flex; align-items: center; gap: 12px; min-width: 0; }
.bb-ok {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--green-tint);
  color: var(--green-text);
}
.bb-ok .ic { width: 16px; height: 16px; }
.bb-info { flex: 1; min-width: 0; }
.bb-t { font-size: 15px; font-weight: 600; letter-spacing: -.015em; white-space: nowrap; }
.bb-key { margin-left: 2px; font-family: var(--mono); font-size: 14px; font-weight: 500; letter-spacing: .02em; }
.bb-d { margin-top: 1px; font-size: 12.5px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bb-actions { flex: none; display: flex; align-items: center; margin-right: -12px; }
.bb-actions .linkbtn { padding: 8px 12px; font-size: 14px; }
.linkbtn.is-danger { color: var(--red-text); }

/* 推送哪些（勾选框） */
.bark-opts { display: flex; flex-direction: column; gap: 4px; padding: 12px 0; transition: opacity .3s var(--ease); }
.bark-opts.is-off { opacity: .45; }
.chk { position: relative; display: flex; align-items: flex-start; gap: 12px; padding: 6px 0; cursor: pointer; }
.chk input { position: absolute; top: 6px; left: 0; z-index: 1; width: 22px; height: 22px; margin: 0; opacity: 0; cursor: pointer; }
.chk-box {
  flex: none;
  width: 22px;
  height: 22px;
  margin-top: 0;
  border-radius: 7px;
  display: grid;
  place-items: center;
  background: var(--card);
  box-shadow: inset 0 0 0 1.5px var(--chk-line);
  color: #fff;
  transition: background-color .25s var(--ease), box-shadow .25s var(--ease);
}
.chk-box .ic { width: 15px; height: 15px; opacity: 0; transform: scale(.4); transition: opacity .18s var(--ease), transform .4s var(--spring); }
.chk input:checked + .chk-box { background: var(--blue); box-shadow: none; }
.chk input:checked + .chk-box .ic { opacity: 1; transform: none; }
.chk:hover input:not(:checked):not(:disabled) + .chk-box { box-shadow: inset 0 0 0 1.5px var(--text-3); }
.chk input:focus-visible { box-shadow: none; }
.chk input:focus-visible + .chk-box { box-shadow: inset 0 0 0 1.5px var(--chk-line), 0 0 0 4px var(--blue-line); }
.chk input:checked:focus-visible + .chk-box { box-shadow: 0 0 0 4px var(--blue-line); }
.chk input:disabled, .bark-opts.is-off .chk { cursor: default; }
.chk-l { min-width: 0; display: flex; flex-direction: column; padding-top: 1px; }
.chk-t { font-size: 15px; font-weight: 500; line-height: 1.35; letter-spacing: -.015em; }
.chk-nw { display: inline-block; }
.chk-d { margin-top: 2px; font-size: 13px; line-height: 1.45; color: var(--text-2); }

/* 试推 + 状态行 */
.bark-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 16px; padding: 14px 0 18px; }
.bark-status {
  flex: 1 1 220px;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-2);
}
.bs-dot { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--text-3); opacity: .7; }
.bark-status .bs-err { display: none; width: 16px; height: 16px; }
.bark-status[data-kind="ok"] .bs-dot { background: var(--green); opacity: 1; box-shadow: 0 0 0 3px var(--green-tint); }
.bark-status[data-kind="err"] { align-items: flex-start; color: var(--red-text); }
.bark-status[data-kind="err"] .bs-dot { display: none; }
.bark-status[data-kind="err"] .bs-err { display: inline-block; margin-top: 1px; }
.bs-t { min-width: 0; }
.bs-when { color: var(--text-3); white-space: nowrap; cursor: default; }
.bark-tests { flex: none; display: flex; gap: 8px; margin-left: auto; }
.bark-tests .btn { min-width: 0; }

/* 按钮里的转圈（试推 / 保存进行中） */
.btn .spin { display: none; flex: none; width: 14px; height: 14px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; opacity: .7; animation: spin .75s linear infinite; }
.btn.is-busy { pointer-events: none; }
.btn.is-busy .spin { display: inline-block; }
.btn.is-busy > .ic { display: none; }
.bf-save .spin { width: 15px; height: 15px; }
/* 刚绑定好：轻轻提示“试推一条” */
.btn.nudge { animation: callout 1.8s var(--ease) 3; }

/* 页脚 */
.foot { border-top: 1px solid var(--hair); }
.foot-in {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 24px;
  padding-top: 22px;
  padding-bottom: 36px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-3);
}

/* ================================================================
   浮层：开启声音 / 确认 / 已在别处打开
   ================================================================ */
.unlock, .dialog, .elsewhere {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 24px;
  overflow: auto;
  background: var(--overlay);
  -webkit-backdrop-filter: saturate(180%) blur(22px);
  backdrop-filter: saturate(180%) blur(22px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .45s var(--ease);
}
.unlock.show, .dialog.show, .elsewhere.show { opacity: 1; pointer-events: auto; }
.dialog { z-index: 1010; }
.elsewhere { z-index: 1020; }
.unlock-card, .dialog-card, .elsewhere-card {
  position: relative;
  background: var(--card);
  border-radius: var(--r-xl);
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow-lg);
  text-align: center;
  transform: translateY(16px) scale(.96);
  transition: transform .6s var(--ease);
}
.show > .unlock-card, .show > .dialog-card, .show > .elsewhere-card { transform: none; }

.unlock-card, .elsewhere-card { width: min(440px, 100%); padding: 44px 40px 30px; }
.unlock-art { position: relative; width: 120px; height: 120px; margin: 0 auto 22px; display: grid; place-items: center; }
.ua-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1.5px solid var(--blue);
  opacity: 0;
  animation: ring 3s var(--ease-out) infinite;
}
.ua-ring.r2 { animation-delay: 1s; }
.ua-ring.r3 { animation-delay: 2s; }
.ua-core {
  position: relative;
  z-index: 1;
  width: 78px;
  height: 78px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(145deg, #36a0ff 0%, #0066dd 100%);
  box-shadow: 0 14px 32px rgba(0, 113, 227, .34), inset 0 1px 0 rgba(255, 255, 255, .28);
}
.ua-core .ic { width: 34px; height: 34px; }
.unlock-title, .es-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 34px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -.028em;
}
.unlock-sub { margin: 6px 0 0; font-size: 19px; line-height: 1.4; color: var(--text); letter-spacing: -.012em; }
.unlock-note, .es-text { margin: 14px auto 0; max-width: 340px; font-size: 14px; line-height: 1.6; color: var(--text-2); }
#unlock-go, #elsewhere-go { width: 100%; max-width: 300px; margin-top: 28px; }
.unlock-card .linkbtn { display: block; margin: 10px auto 0; }
.elsewhere-card { padding-bottom: 40px; }
.es-art { position: relative; width: 120px; height: 96px; margin: 0 auto 24px; }
.es-win {
  position: absolute;
  width: 84px;
  height: 62px;
  border-radius: 14px;
  background: var(--fill-3);
  box-shadow: inset 0 0 0 1px var(--hair);
}
.es-win.w1 { left: 4px; top: 4px; }
.es-win.w2 {
  right: 4px;
  bottom: 4px;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--grad-brand-d);
  box-shadow: 0 12px 28px rgba(255, 55, 95, .28);
}
.es-win.w2 .ic { width: 32px; height: 32px; }

.dialog-card { width: min(380px, 100%); padding: 30px 24px 20px; }
.dlg-title { font-size: 19px; line-height: 1.3; font-weight: 600; letter-spacing: -.02em; }
.dlg-text { margin-top: 8px; font-size: 14px; line-height: 1.55; color: var(--text-2); }
.dlg-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 24px; }
.dlg-actions .btn { width: 100%; height: 42px; font-size: 15px; }

/* 直接打开 index.html 时的整页提示 */
.fileguard {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  padding: 40px 24px;
  overflow: auto;
  text-align: center;
  background: var(--bg);
}
.fileguard::before {
  content: "";
  position: fixed;
  left: 50%;
  top: -10%;
  width: 1000px;
  height: 620px;
  margin-left: -500px;
  pointer-events: none;
  background:
    radial-gradient(36% 46% at 30% 50%, var(--glow-a), transparent 72%),
    radial-gradient(34% 46% at 52% 40%, var(--glow-b), transparent 72%),
    radial-gradient(36% 50% at 72% 56%, var(--glow-c), transparent 72%);
  filter: blur(34px);
}
.fg-in { position: relative; max-width: 680px; }
.fg-icon {
  width: 104px;
  height: 104px;
  margin: 0 auto 32px;
  border-radius: 24px;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--grad-brand-d);
  box-shadow: 0 20px 44px rgba(255, 55, 95, .28), inset 0 0 0 1px rgba(255, 255, 255, .2);
}
.fg-icon .ic { width: 60px; height: 60px; }
.fg-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(36px, 4.4vw, 56px);
  line-height: 1.12;
  font-weight: 700;
  letter-spacing: -.028em;
}
.fg-file {
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.fg-sub { margin: 20px auto 0; max-width: 540px; font-size: 19px; line-height: 1.5; color: var(--text-2); letter-spacing: -.012em; }
.fg-hint {
  display: inline-block;
  margin: 28px 0 0;
  padding: 10px 18px;
  border-radius: var(--pill);
  background: var(--card);
  box-shadow: 0 0 0 1px var(--hair-2), var(--shadow);
  font-size: 14px;
  color: var(--text-2);
}
.fg-hint b { color: var(--text); font-weight: 600; }
body.is-file > :not(.fileguard):not(.sprite) { display: none !important; }

/* ================================================================
   登录（服务器版）
   ================================================================ */
/* 确认登录状态前先不显示主界面（只有背景色），未登录时不会闪一下主界面 */
.auth-pending body > :not(.sprite):not(.login):not(.toast):not(.tip) { visibility: hidden; animation: authFailsafe 0s linear 9s forwards; }
/* 保险：脚本没加载成功时 9 秒后照常显示，不会一直空白 */
@keyframes authFailsafe { to { visibility: visible; } }
body.is-login > :not(.login):not(.sprite):not(.toast):not(.tip):not(.elsewhere) { display: none !important; }

.login {
  position: fixed;
  inset: 0;
  z-index: 990;
  display: flex;
  flex-direction: column;
  padding: 76px 20px 44px;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--bg);
  opacity: 0;
  transition: opacity .5s var(--ease);
}
.login.show { opacity: 1; }
.login-bg { position: fixed; inset: 0; overflow: hidden; pointer-events: none; }
.login-bg::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -12%;
  width: 1100px;
  height: 700px;
  margin-left: -550px;
  background:
    radial-gradient(36% 46% at 30% 50%, var(--glow-a), transparent 72%),
    radial-gradient(34% 46% at 52% 40%, var(--glow-b), transparent 72%),
    radial-gradient(36% 50% at 72% 56%, var(--glow-c), transparent 72%);
  filter: blur(40px);
  -webkit-mask-image: radial-gradient(50% 50% at 50% 50%, #000 45%, transparent 100%);
  mask-image: radial-gradient(50% 50% at 50% 50%, #000 45%, transparent 100%);
  animation: drift 22s ease-in-out infinite alternate;
}
.login-theme { position: fixed; top: 14px; right: 16px; z-index: 2; }
.login-in {
  position: relative;
  width: min(400px, 100%);
  margin: auto;
  text-align: center;
  transform: translateY(16px) scale(.985);
  transition: transform .8s var(--ease);
}
.login.show .login-in { transform: none; }
.login-mark { position: relative; width: 88px; height: 88px; margin: 0 auto 24px; display: grid; place-items: center; }
.lm-core {
  position: relative;
  z-index: 1;
  width: 76px;
  height: 76px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--grad-brand-d);
  box-shadow: 0 18px 40px rgba(255, 55, 95, .3), inset 0 0 0 1px rgba(255, 255, 255, .22);
}
.lm-core .ic { width: 44px; height: 44px; }
.lm-ring {
  position: absolute;
  inset: 4px;
  border-radius: 26px;
  border: 1.5px solid rgba(255, 55, 95, .55);
  opacity: 0;
  animation: ring 3.4s var(--ease-out) infinite;
}
.lm-ring.r2 { animation-delay: 1.7s; }
.login-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 40px;
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -.03em;
}
.login-sub { margin: 10px auto 0; max-width: 360px; font-size: 17px; line-height: 1.47; color: var(--text-2); letter-spacing: -.012em; text-wrap: balance; }
.login-sub .nw { display: inline-block; }
.login-card {
  margin-top: 32px;
  padding: 26px 24px 24px;
  text-align: left;
  background: var(--card);
  border-radius: var(--r-xl);
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow-login);
}
.login-card.shake { animation: shake .45s var(--ease) 1; }
.lf-field + .lf-field { margin-top: 18px; }
.lf-label { display: block; margin: 0 0 8px 4px; font-size: 13px; font-weight: 600; color: var(--text-2); letter-spacing: 0; }
.lf-users .seg { display: flex; width: 100%; padding: 3px; }
.lf-users .seg-ind { top: 3px; bottom: 3px; }
.lf-users .seg-btn {
  flex: 1 1 0;
  min-width: 0;
  height: 42px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
}
.lf-users .seg-btn .user-av { width: 24px; height: 24px; font-size: 11.5px; opacity: .55; transition: opacity .3s var(--ease); }
.lf-users .seg-btn.is-on .user-av { opacity: 1; }
.lf-uname { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.lf-select { padding-right: 40px; cursor: pointer; background-image: linear-gradient(45deg, transparent 50%, var(--text-2) 50%), linear-gradient(135deg, var(--text-2) 50%, transparent 50%); background-position: calc(100% - 22px) 50%, calc(100% - 17px) 50%; background-size: 5px 5px; background-repeat: no-repeat; }
.lf-input, .lf-pass input {
  width: 100%;
  height: 50px;
  padding: 0 16px;
  border: 0;
  border-radius: 14px;
  outline: 0;
  appearance: none;
  background: var(--fill-2);
  color: var(--text);
  font: inherit;
  font-size: 17px;
  letter-spacing: -.01em;
  transition: background-color .25s var(--ease), box-shadow .25s var(--ease);
}
.lf-input::placeholder, .lf-pass input::placeholder { color: var(--text-3); }
.lf-input:hover, .lf-pass input:hover { background: var(--fill-3); }
.lf-input:focus, .lf-pass input:focus { background: var(--card); box-shadow: 0 0 0 1px var(--blue), 0 0 0 4px var(--blue-tint); }
.lf-pass { position: relative; }
.lf-pass input { padding-right: 54px; }
.lf-pass input::-ms-reveal { display: none; }
.lf-eye {
  appearance: none;
  position: absolute;
  top: 7px;
  right: 7px;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: transparent;
  color: var(--text-2);
  cursor: pointer;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
.lf-eye:hover { background: var(--fill-2); color: var(--text); }
.lf-eye .ic { width: 19px; height: 19px; }
.lf-msg {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin: 14px 4px 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--red-text);
  animation: msgIn .4s var(--ease) 1;
}
.lf-msg .ic { flex: none; width: 17px; height: 17px; margin-top: 1px; }
.lf-msg.is-info { color: var(--text-2); }
.lf-go { position: relative; width: 100%; margin-top: 22px; gap: 9px; }
.lf-go .ic { width: 18px; height: 18px; }
.lf-spin { display: none; width: 17px; height: 17px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .35); border-top-color: #fff; animation: spin .75s linear infinite; }
.lf-ok { display: none; }
.lf-go.is-busy { pointer-events: none; }
.lf-go.is-busy .lf-spin { display: inline-block; }
.lf-go.is-ok, .lf-go.is-ok:hover { background: var(--green); pointer-events: none; }
.lf-go.is-ok .lf-ok { display: inline-block; }
.login-foot { margin: 22px auto 0; max-width: 340px; font-size: 12.5px; line-height: 1.6; color: var(--text-3); }

/* ---------------- 轻提示 / 气泡 ---------------- */
.toast {
  position: fixed;
  left: 50%;
  bottom: 34px;
  z-index: 1100;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: calc(100% - 32px);
  padding: 11px 20px 11px 14px;
  border-radius: var(--pill);
  background: var(--toast-bg);
  color: #f5f5f7;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -.01em;
  white-space: nowrap;
  box-shadow: 0 14px 40px rgba(0, 0, 0, .2), inset 0 0 0 1px rgba(255, 255, 255, .06);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 16px) scale(.96);
  transition: opacity .35s var(--ease), transform .55s var(--ease);
}
.toast.show { opacity: 1; transform: translate(-50%, 0) scale(1); }
.toast .ic { width: 18px; height: 18px; color: #30d158; }
.toast.warn .ic { color: #ff9f0a; }
#toast-text { overflow: hidden; text-overflow: ellipsis; }

.tip {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1200;
  max-width: 300px;
  padding: 7px 11px;
  border-radius: 10px;
  background: var(--tip-bg);
  color: #f5f5f7;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 500;
  letter-spacing: 0;
  white-space: pre-line;
  overflow-wrap: anywhere;
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  transition: opacity .2s var(--ease), transform .3s var(--ease);
}
.tip.below { transform: translateY(-4px); }
.tip.show { opacity: 1; transform: none; }
.tip.measure { visibility: hidden; opacity: 0; transition: none; }

/* ================================================================
   分区出现动画
   ================================================================ */
.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 1s var(--ease), transform 1s var(--ease);
}
.reveal.in { opacity: 1; transform: none; }

/* ================================================================
   动画
   ================================================================ */
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes breathe {
  0% { transform: scale(1); opacity: .55; }
  80%, 100% { transform: scale(2.8); opacity: 0; }
}
@keyframes blink { 50% { opacity: .35; } }
@keyframes dotPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.25); }
}
@keyframes callout {
  0% { box-shadow: 0 0 0 0 rgba(0, 113, 227, .45); }
  70%, 100% { box-shadow: 0 0 0 9px rgba(0, 113, 227, 0); }
}
@keyframes ring {
  0% { transform: scale(.66); opacity: .6; }
  100% { transform: scale(1.4); opacity: 0; }
}
@keyframes sheen {
  0% { transform: translateX(-100%); }
  55%, 100% { transform: translateX(100%); }
}
@keyframes eq {
  0%, 100% { transform: scaleY(.3); }
  50% { transform: scaleY(1); }
}
@keyframes drift {
  0% { transform: translate3d(-30px, 0, 0) scale(1); }
  100% { transform: translate3d(30px, 18px, 0) scale(1.06); }
}
@keyframes blip {
  0%, 8% { opacity: 0; transform: scale(.4); }
  14% { opacity: 1; transform: scale(1.15); }
  24% { transform: scale(1); }
  70% { opacity: .9; }
  100% { opacity: 0; transform: scale(1); }
}
@keyframes cardGlow {
  0% { box-shadow: 0 0 0 0 var(--glow), 0 0 0 0 transparent; }
  16% { box-shadow: 0 0 0 5px transparent, 0 14px 48px -6px var(--glow); }
  100% { box-shadow: 0 0 0 12px transparent, 0 4px 18px transparent; }
}
@keyframes shake {
  0%, 100% { transform: none; }
  20% { transform: translateX(-9px); }
  40% { transform: translateX(7px); }
  60% { transform: translateX(-4px); }
  80% { transform: translateX(2px); }
}
@keyframes msgIn {
  0% { opacity: 0; transform: translateY(-4px); }
  100% { opacity: 1; transform: none; }
}
@keyframes primeGlow {
  0% { filter: saturate(1) brightness(1); }
  100% { filter: saturate(1.3) brightness(1.15); }
}
@keyframes tlNew {
  0% { background-color: var(--flash-neu); }
  100% { background-color: transparent; }
}

/* ================================================================
   13 节：报警卡片（一个币一张 + 时间线、发射倍数、报警后走势、盘面、静音、毕业）
   ================================================================ */
/* 毕业提醒：绿 → 青 */
.acard.t-grad { --tint: rgba(48, 209, 88, .17); --tier: var(--grad-grad); --glow: rgba(48, 209, 88, .45); border-color: rgba(48, 209, 88, .22); }

/* 大字倍数 + 醒目的“发射 8.9×” */
.ac-big { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 8px 12px; min-width: 0; }
.ac-lx {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  height: 32px;
  margin-bottom: 6px;
  padding: 0 12px;
  border-radius: var(--pill);
  background: var(--fill-2);
  box-shadow: inset 0 0 0 1px var(--hair-2);
  white-space: nowrap;
  cursor: default;
  line-height: 32px;
}
.ac-lx .lx-l { font-size: 13px; font-weight: 500; color: var(--text-2); }
.ac-lx b {
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -.02em;
  background: var(--tier);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.tag .ic { width: 12px; height: 12px; margin: 0 3px 0 -2px; }
.tag-gradx { gap: 1px; background: var(--grad-grad); color: #fff; box-shadow: 0 2px 8px rgba(0, 199, 190, .28); }
.tag-gradx .ic { width: 14px; height: 14px; }
.tag-oneshot { background: var(--red-tint); color: var(--red-text); }
.tag-repeat.is-silent { background: var(--fill-2); color: var(--text-2); }
.tag-repeat.is-silent .ic { opacity: .85; }

/* 盘面信息的小标签：开发者已卖 / 同名×3 */
.ac-pool .chips { display: inline-flex; flex-wrap: wrap; gap: 5px; margin-left: 3px; }
.chip {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 8px;
  border-radius: var(--pill);
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: default;
}
.chip-risk { background: var(--red-tint); color: var(--red-text); }
.chip-warn { background: var(--orange-tint); color: var(--orange-text); }
.ac-pool b.is-hot { color: var(--orange-text); }

/* 报警后的走势：现价 · 报警后 +34%（最高 +48%）· 最近成交 20 秒前 */
.ac-live {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 8px;
  margin-top: -6px;
  padding: 9px 14px;
  border-radius: 14px;
  box-shadow: inset 0 0 0 1px var(--hair);
  font-size: 13.5px;
  line-height: 1.35;
}
.ac-live .pg { display: inline-flex; align-items: center; gap: 0 6px; white-space: nowrap; }
.ac-live .lbl { color: var(--text-2); }
.ac-live .sep { color: var(--text-3); }
.ac-live [data-tip] { cursor: default; }
.lv-now { font-weight: 600; letter-spacing: -.01em; }
.lv-chg {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 7px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.lv-chg.rolling { display: inline-grid; }
.lv-chg.is-up { background: var(--green-tint); color: var(--green-text); }
.lv-chg.is-down { background: var(--red-tint); color: var(--red-text); }
.lv-chg.is-flat { background: var(--fill-2); color: var(--text-2); }
/* 最高 +48% · 最近成交 20 秒前：窄卡片单独一行（和“现价”对齐），宽卡片放在同一行最右边 */
.lv-sub {
  flex: 1 0 100%;
  display: flex;
  align-items: baseline;
  gap: 0 6px;
  padding-left: 15px;
  font-size: 12.5px;
  color: var(--text-3);
  white-space: nowrap;
}
.lv-max { color: var(--text-2); font-weight: 500; }
.lv-trade { white-space: nowrap; }
.acard { container-type: inline-size; }
@container (min-width: 430px) {
  .lv-sub { flex: 0 0 auto; margin-left: auto; padding-left: 0; }
}
.lv-dot {
  position: relative;
  flex: none;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--text-3);
  opacity: .7;
}
.lv-dot.is-fresh { background: var(--green); opacity: 1; }
.lv-dot.is-fresh::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: inherit;
  animation: breathe 2.4s var(--ease-out) infinite;
}

/* 跌破报警价：卡片整体变灰，百分比变红 */
.acard.is-below { --tier: var(--grad-grey); --tint: rgba(142, 142, 147, .12); --glow: rgba(142, 142, 147, .4); border-color: var(--card-border); }
.acard.is-below .ac-head .av { filter: grayscale(1); opacity: .75; }
.acard.is-below .ac-name { color: var(--text-2); }
.acard.is-below .ac-path .p-now { color: var(--text-2); }
.acard.is-below .ac-tags .tag:not(.tag-test) { background: var(--fill-2); color: var(--text-2); box-shadow: none; }
.acard.is-below .ac-lat { background: var(--fill-2); color: var(--text-2); }
.acard.is-below .ac-live { box-shadow: inset 0 0 0 1px var(--red-tint); }

/* 有卡片展开了时间线：各卡片按自己的高度排，同一行不被撑出大块空白 */
.alert-grid.has-open { align-items: start; }

/* 三项小数据（用时 / 进度 / 创建于） */
.ac-stats.is-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ac-stats > div[data-tip] { cursor: default; }

/* 共 N 次 · 首报 01:12（点开时间线）+ 静音这个币 */
.ac-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  margin: -4px 0 -6px;
}
.ac-cnt {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 30px;
  margin-left: -9px;
  padding: 0 10px 0 9px;
  border: 0;
  border-radius: var(--pill);
  background: transparent;
  color: var(--text-2);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
.ac-cnt .ic { width: 15px; height: 15px; }
.ac-cnt .cnt-t { overflow: hidden; text-overflow: ellipsis; }
.ac-cnt .cnt-chev { width: 14px; height: 14px; transition: transform .4s var(--ease); }
.ac-cnt:hover:not(:disabled) { background: var(--fill-2); color: var(--text); }
.ac-cnt.is-open { color: var(--text); }
.ac-cnt.is-open .cnt-chev { transform: rotate(180deg); }
.ac-cnt:disabled { cursor: default; color: var(--text-2); opacity: 1; }
.ac-cnt.is-single .cnt-chev { display: none; }
.ac-mute {
  appearance: none;
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 30px;
  padding: 0 12px 0 10px;
  border: 0;
  border-radius: var(--pill);
  background: var(--fill-2);
  color: var(--text-2);
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease), opacity .2s;
}
.ac-mute .ic { width: 15px; height: 15px; }
.ac-mute:hover:not(:disabled) { background: var(--fill-3); color: var(--text); }
.ac-mute:active:not(:disabled) { transform: scale(.96); }
.ac-mute:disabled { opacity: .55; cursor: default; }
.ac-mute.is-on { background: var(--orange-tint); color: var(--orange-text); }
.ac-mute.is-on:hover:not(:disabled) { background: var(--orange-tint); color: var(--orange-text); filter: brightness(1.04); }

/* 这个币每次报警的小时间线 */
.ac-tl {
  list-style: none;
  margin: -6px 0 0;
  padding: 6px 14px;
  border-radius: 14px;
  background: var(--fill);
  box-shadow: inset 0 0 0 1px var(--hair-2);
}
.tl-i {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 7px 0 7px 22px;
  font-size: 13px;
  line-height: 1.4;
  border-radius: 8px;
}
.tl-l { min-width: 0; }
.tl-1 { display: flex; align-items: center; gap: 7px; min-width: 0; white-space: nowrap; }
.tl-2 { margin-top: 1px; font-size: 12px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tl-seq { font-weight: 600; }
.tl-r { flex: none; text-align: right; cursor: default; }
.tl-mc { font-weight: 600; letter-spacing: -.01em; white-space: nowrap; }
.tl-i::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 0;
  bottom: 0;
  width: 1.5px;
  border-radius: 1px;
  background: var(--hair);
}
.ac-tl > .tl-i:first-child::before { top: 17px; }
.ac-tl > .tl-i:last-child::before { bottom: auto; height: 17px; }
.ac-tl > .tl-i:only-child::before { display: none; }
.tl-dot {
  position: absolute;
  left: 1px;
  top: 12px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--card);
  box-shadow: inset 0 0 0 2px var(--text-3);
}
.tl-i.is-latest .tl-dot { background: var(--tier); box-shadow: 0 0 0 3px var(--card), 0 1px 5px var(--glow); }
.tl-i.is-grad .tl-dot { background: var(--grad-grad); box-shadow: 0 0 0 3px var(--card); }
.tl-i.is-new { animation: tlNew 2.4s ease-out 1; }
.tl-t { flex: none; font-weight: 600; color: var(--text); }
.tl-silent { display: inline-flex; align-self: center; color: var(--text-3); cursor: default; }
.tl-silent .ic { width: 13px; height: 13px; }
.tl-latest {
  align-self: center;
  height: 18px;
  padding: 0 7px;
  border-radius: var(--pill);
  background: var(--fill-3);
  color: var(--text-2);
  font-size: 11px;
  font-weight: 600;
  line-height: 18px;
}
.tl-more { padding: 6px 0 4px 22px; font-size: 12px; color: var(--text-3); }

/* ================================================================
   13.8 节：新资产动态（板块最上面）/ 已收起的新资产（板块最底下）
   ================================================================ */
.nfeed { margin-bottom: 36px; }
.nf-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px 18px; margin-bottom: 16px; }
.nf-title { display: inline-flex; align-items: center; gap: 10px; margin: 0; }
.nf-mark {
  flex: none;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--grad-brand-d);
  box-shadow: 0 2px 8px rgba(255, 55, 95, .25), inset 0 0 0 .5px rgba(255, 255, 255, .25);
}
.nf-mark .ic { width: 16px; height: 16px; }
.nf-sub { margin: 0; font-size: 14px; line-height: 1.45; color: var(--text-2); }
.nf-empty {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  border-radius: 20px;
  background: var(--card);
  border: 1px dashed var(--hair);
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--text-2);
}
.nf-empty-ic { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--fill-2); color: var(--text-2); }
.nf-empty-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nf-empty-t b { font-size: 15px; color: var(--text); }

.na-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(420px, 100%), 1fr));
  gap: 16px;
  align-items: start;
}
.na {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 20px 20px 16px;
  background: var(--card);
  border-radius: 20px;
  border: 1px solid var(--card-border);
  box-shadow: var(--shadow);
  transition: box-shadow .5s var(--ease);
}
.na:hover { box-shadow: var(--shadow-hover); }
.na.is-recent {
  border: 1.5px solid transparent;
  background: linear-gradient(var(--card), var(--card)) padding-box, var(--grad-brand-d) border-box;
  box-shadow: 0 10px 30px rgba(255, 55, 95, .1);
}
.na-head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.na-id { flex: 1; min-width: 0; }
.na-t1 { display: flex; align-items: center; gap: 8px; min-width: 0; }
.na-asym {
  min-width: 0;
  font-size: 19px;
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: -.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.new-badge.na-new { position: static; flex: none; height: 18px; padding: 0 7px; font-size: 10px; }
.na-when { margin-top: 1px; font-size: 13px; line-height: 1.4; color: var(--text-2); }
.na-src {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 22px;
  margin-left: auto;
  padding: 0 9px;
  border-radius: var(--pill);
  background: var(--blue-tint);
  color: var(--link);
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
  cursor: default;
}
.na-src[data-by="launch"] { background: var(--orange-tint); color: var(--orange-text); }
.na-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--hair-2); }
.na-r { display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 58px; padding: 9px 0; border-bottom: 1px solid var(--hair-2); }
.na-r:last-child { border-bottom: 0; }
.na-rk {
  flex: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--fill-2);
  color: var(--text-2);
  font-size: 11px;
  font-weight: 700;
}
.na-r:first-child:not(.is-empty) .na-rk { background: var(--grad-orange); color: #fff; box-shadow: 0 2px 6px rgba(255, 133, 0, .3); }
.av-sm { --s: 32px; }
.na-b { flex: 1; min-width: 0; }
.na-l1 { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.na-name {
  min-width: 0;
  flex: 0 1 auto;
  color: var(--text);
  font-size: 15px;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: -.015em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.na-name:hover { color: var(--link); }
.na-sym { flex: 0 10 auto; min-width: 0; font-size: 12.5px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.na-l1 .mini-tag { align-self: center; }
.na-l2 { display: flex; align-items: center; flex-wrap: wrap; gap: 0 8px; min-width: 0; margin-top: 1px; }
.na-ct { font-size: 12px; color: var(--text-2); white-space: nowrap; cursor: default; }
.na-l2 .addr { margin: 0 0 0 -4px; }
.na-nums { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.na-mc { font-size: 15px; font-weight: 600; letter-spacing: -.015em; white-space: nowrap; }
.na-mc.is-none { font-size: 12.5px; font-weight: 500; color: var(--text-3); }
.na-nums .mx { font-size: 12.5px; }
.na-nums .mx.t-orange, .na-nums .mx.t-pink, .na-nums .mx.t-purple { height: 20px; padding: 0 8px; font-size: 12px; }
.na-r.is-empty { min-height: 46px; }
.na-ph { font-size: 13px; color: var(--text-3); }
.na-latest {
  padding: 10px 12px 10px 10px;
  border-radius: 14px;
  background: var(--fill-2);
  font-size: 13px;
  line-height: 1.45;
}
.nl-lbl {
  flex: none;
  height: 20px;
  padding: 0 8px;
  border-radius: var(--pill);
  background: var(--blue);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: .02em;
}
.nl-b { min-width: 0; }
.nl-1, .nl-2 { display: flex; align-items: center; justify-content: space-between; gap: 2px 10px; min-width: 0; }
.nl-2 { flex-wrap: wrap; margin-top: 2px; padding-left: 48px; color: var(--text-2); }
.nl-id { flex: 1 1 auto; display: flex; align-items: center; gap: 6px; min-width: 0; }
.nl-id .mini-tag { flex: none; }
.nl-lbl { margin-right: 4px; }
.nl-name { min-width: 0; flex: 0 1 auto; color: var(--text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nl-name:hover { color: var(--link); }
.nl-sym { flex: 0 10 auto; min-width: 0; font-size: 12px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nl-now { flex: none; display: inline-flex; align-items: baseline; gap: 0 5px; white-space: nowrap; }
.nl-now .lbl { color: var(--text-2); }
.nl-when { white-space: nowrap; cursor: default; }
.nl-mc { font-weight: 600; color: var(--text); }
.nl-none { color: var(--text-3); }
.nl-cnt { flex: none; margin-left: auto; color: var(--text-2); font-weight: 500; white-space: nowrap; }

.nfold { margin-top: 56px; }
.nfold-btn {
  appearance: none;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  border: 1px solid var(--card-border);
  border-radius: 20px;
  background: var(--card);
  box-shadow: var(--shadow);
  color: var(--text);
  text-align: left;
  cursor: pointer;
  transition: box-shadow .4s var(--ease), transform .2s var(--ease);
}
.nfold-btn:hover:not(:disabled) { box-shadow: var(--shadow-hover); }
.nfold-btn:active:not(:disabled) { transform: scale(.995); }
.nfold-btn:disabled { cursor: default; opacity: .7; }
.nfold-ic { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--fill-2); color: var(--text-2); }
.nfold-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.nfold-title { font-size: 16px; font-weight: 600; letter-spacing: -.015em; }
.nfold-n { color: var(--text-2); font-weight: 500; }
.nfold-sub { font-size: 13px; color: var(--text-2); }
.nfold-act { flex: none; font-size: 14px; color: var(--link); }
.nfold-btn:disabled .nfold-act { color: var(--text-3); }
.nfold-chev { flex: none; width: 18px; height: 18px; color: var(--text-3); transition: transform .45s var(--ease); }
.nfold.is-open .nfold-chev { transform: rotate(180deg); }
.nfold-body { margin-top: 16px; }

@media (max-width: 760px) {
  .nfeed { margin-bottom: 28px; }
  .nf-head { flex-direction: column; align-items: flex-start; }
  .nfold { margin-top: 40px; }
}
@media (max-width: 480px) {
  .ac-big { gap: 6px 10px; }
  .ac-lx { height: 30px; line-height: 30px; margin-bottom: 4px; padding: 0 11px; }
  .ac-lx b { font-size: 17px; }
  .ac-live { padding: 9px 12px; gap: 4px 7px; font-size: 13px; }
  .ac-tl { padding: 4px 12px; }
  .na { padding: 16px 16px 14px; }
  .na-grid { gap: 12px; }
  .na-asym { font-size: 18px; }
  .na-latest { padding: 10px 11px 10px 9px; }
  .nl-2 { padding-left: 2px; }
  .nfold-btn { padding: 14px 16px; gap: 12px; }
  .nfold-act { display: none; }
  .nf-empty { padding: 14px 16px; }
}

/* ================================================================
   响应式（360–1920）
   ================================================================ */
@media (max-width: 1100px) {
  /* 账号胶囊收成圆形头像，给状态胶囊留地方 */
  .user-chip { padding: 3px; gap: 0; }
  .user-name, .user-chev { display: none; }
}
@media (max-width: 1120px) {
  .stats { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .stat { grid-column: span 2; }
  .stat:nth-child(4), .stat:nth-child(5) { grid-column: span 3; }
  .prime { padding: 36px 36px; gap: 24px 36px; }
  .prime-state { font-size: 48px; }
}
@media (max-width: 1000px) {
  .brand-name { display: none; }
  .nav .seg-btn { padding: 0 18px; }
  .section { padding-top: 96px; }
  .sec-title { font-size: 36px; }
  .sec-sub { font-size: 17px; }
  .hero { padding-top: 76px; }
  .hero-sub { font-size: 19px; }
  .banner-title { font-size: 19px; }
  .banner-detail { font-size: 14px; }
  .search { flex-basis: 210px; width: 210px; }
  .st-l { display: none; }
  .st-s { display: inline; }
}
@media (max-width: 760px) {
  .nav-in { grid-template-columns: auto minmax(0, 1fr); }
  .nav .seg { display: none; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat, .stat:nth-child(4), .stat:nth-child(5) { grid-column: auto; }
  .settings { grid-template-columns: 1fr; }
  .settings > .about, .settings > .bark { grid-column: auto; grid-row: auto; }
  .prime { grid-template-columns: 1fr; }
  .prime-meta { padding-left: 0; border-left: 0; }
  .banner-in { flex-wrap: wrap; }
  /* 手机：再紧凑一点 */
  .hero { padding-top: 56px; }
  .stats { margin-top: 40px; gap: 12px; }
  .stat:nth-child(5) { grid-column: 1 / -1; }
  .section { padding-top: 76px; }
  .section-settings { padding-bottom: 80px; }
  .sec-title { font-size: 32px; }
  .sec-head { margin-bottom: 22px; }
  .alert-grid { gap: 14px; }
  .prime { padding: 30px 26px; }
  .prime-state { font-size: 40px; }
  .events { margin-top: 40px; }
  .tb-sort { width: 100%; min-width: 0; margin-left: 0; overflow-x: auto; scrollbar-width: none; }
  .tb-sort::-webkit-scrollbar { display: none; }
  .tb-label { display: none; }
  .sec-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .sec-actions { padding-bottom: 0; }
  .hero-title .grad-brand { display: inline-block; }
}
@media (max-width: 480px) {
  :root { --gutter: 16px; }
  .nav-in { gap: 10px; }
  .nav-right { gap: 6px; }
  .ps-l { display: none; }
  .ps-s { display: inline; }
  .pill-sound, .pill-status { padding: 0 11px; }
  .hero-title { font-size: 40px; }
  .hero-sub { font-size: 17px; }
  .eyebrow { font-size: 12px; }
  .stat { padding: 18px 16px 16px; }
  .stat-value { font-size: 32px; }
  .stat-label { font-size: 13px; }
  .sec-sub { font-size: 16px; }
  .acard { padding: 20px 18px 18px; gap: 16px; }
  .ac-mult { font-size: 48px; }
  .ac-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; }
  .ac-actions { gap: 8px; }
  .toolbar { padding: 14px 16px; }
  .search { flex: 1 1 100%; width: auto; min-width: 0; }
  .tbl th:first-child, .tbl td:first-child { padding-left: 16px; }
  .set-card, .about { padding-left: 18px; padding-right: 18px; }
  .set-row { flex-wrap: wrap; gap: 12px 20px; }
  .set-info { flex: 1 1 200px; }
  .set-row .btn { margin-left: auto; }
  .set-row.bark-head { flex-wrap: nowrap; gap: 12px; }
  .bark-head .set-info { flex: 1 1 0; }
  .bark-head .switch { margin-left: 2px; }
  .bark-app { width: 34px; height: 34px; border-radius: 9px; }
  .bark-app .ic { width: 19px; height: 19px; }
  .bf-row { flex-wrap: wrap; }
  .bark-input { flex: 1 1 100%; }
  .bf-row .btn { flex: 1 1 0; }
  .bb-brand { display: none; }
  .bb-actions { margin-right: -8px; }
  .bb-actions .linkbtn { padding: 8px 8px; }
  .ac-pool { margin-top: -8px; }
  .bark-tests { width: 100%; order: -1; }
  .bark-tests .btn { flex: 1 1 0; padding: 0 10px; }
  .banner { width: calc(100% - 24px); }
  .banner-in { gap: 12px 14px; padding: 16px; }
  .banner-actions { width: 100%; }
  .banner-actions > * { flex: 1; justify-content: center; }
  .unlock-card, .elsewhere-card { padding: 36px 24px 24px; }
  .login { padding: 64px 16px 32px; }
  .login-title { font-size: 34px; }
  .login-sub { font-size: 16px; }
  .login-card { margin-top: 26px; padding: 22px 18px 20px; }
}

/* ================================================================
   减少动态效果
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }
  .reveal { opacity: 1; transform: none; }
  .hero-glow::before, .rd-sweep, .banner-in::after, .login-bg::before, .lm-ring { animation: none !important; }
}
