/* aether.css — 深空玻璃仪表盘动效体系（Aether 行情终端风格） */

:root{
  --aether-bg:#05070d;
  --aether-fg:#e2e8f0;
  --aether-up:#ff4d6d;   /* 涨=红（A股习惯） */
  --aether-down:#22d3a6; /* 跌=绿 */
  --aether-indigo:#818cf8;
  --aether-teal:#5eead4;
  --aether-purple:#a78bfa;
  --aether-amber:#fbbf24;
}

/* ===== 页面氛围：三层固定极光 ===== */
html,body{background-color:var(--aether-bg);}
body{
  color:var(--aether-fg);
  background-image:
    radial-gradient(1200px 600px at 12% -10%, rgba(99,102,241,.20), transparent 60%),
    radial-gradient(900px 520px at 88% 4%, rgba(45,212,191,.14), transparent 62%),
    radial-gradient(800px 700px at 60% 110%, rgba(167,139,250,.12), transparent 60%);
  background-attachment:fixed;
}

/* ===== 全屏装饰光斑层（由 aether.js 注入） ===== */
.aether-aura{position:fixed;inset:0;z-index:-10;pointer-events:none;overflow:hidden;}
.aether-aura span{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;}
.aether-aura .a1{width:520px;height:520px;left:-140px;top:-120px;background:rgba(99,102,241,.28);animation:float-slow 14s ease-in-out infinite;}
.aether-aura .a2{width:480px;height:480px;right:-120px;top:30%;background:rgba(45,212,191,.20);}
.aether-aura .a3{width:560px;height:560px;left:35%;bottom:-220px;background:rgba(167,139,250,.18);}

/* ===== 1. 玻璃卡片（核心） ===== */
.glass{
  position:relative;overflow:hidden;border-radius:24px;
  border:1px solid #ffffff12;background:#ffffff09;
  backdrop-filter:blur(14px) saturate(120%);
  -webkit-backdrop-filter:blur(14px) saturate(120%);
  box-shadow:0 1px 0 0 rgba(255,255,255,.05) inset, 0 20px 60px -20px rgba(0,0,0,.7);
  transition:transform .5s cubic-bezier(0,0,.2,1), box-shadow .5s cubic-bezier(0,0,.2,1), background-color .5s cubic-bezier(0,0,.2,1);
}
/* 顶部斜向高光（z-index:-1：backdrop-filter 父级形成堆叠上下文，伪元素位于背景之上、内容之下） */
.glass::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(160deg,#ffffff14,#ffffff05 42%,#fff0 78%);
  opacity:.9;
}
/* 鼠标光斑（--mx/--my 由 aether.js 写入百分比） */
.glass::after{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(129,140,248,.16), transparent 62%);
  opacity:0;transition:opacity .45s ease;
}
.glass:hover{
  transform:translateY(-3px);
  box-shadow:0 1px 0 0 rgba(255,255,255,.05) inset, 0 20px 60px -20px rgba(0,0,0,.7), 0 0 0 1px rgba(129,140,248,.18);
}
.glass:hover::after{opacity:1;}
/* 内容包裹层：如结构需要可显式使用 */
.glass-content{position:relative;z-index:1;}
/* 玻璃卡片内层禁嵌套：用半透明纯色块代替 */
.panel-flat{border-radius:16px;border:1px solid #ffffff0f;background:#ffffff08;}

/* ===== 3. 磁性按钮 ===== */
.magnetic{position:relative;will-change:transform;}
.magnet-glow{
  position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:radial-gradient(140px circle at var(--mx,50%) var(--my,50%), rgba(199,210,254,.28), transparent 65%);
  opacity:0;transition:opacity .3s ease;
}
.magnetic:hover .magnet-glow{opacity:1;}

/* ===== 4. 滚动进场（外层 wrapper，与 .glass 不共用元素） ===== */
.aether-reveal{
  opacity:0;transform:translateY(26px) scale(.985);
  transition:opacity .75s cubic-bezier(.22,1,.36,1), transform .75s cubic-bezier(.22,1,.36,1);
}
.aether-reveal.aether-in{opacity:1;transform:translateY(0) scale(1);}
.aether-reveal[data-delay="0"]{transition-delay:0s;}
.aether-reveal[data-delay="0.05"]{transition-delay:.05s;}
.aether-reveal[data-delay="0.10"]{transition-delay:.10s;}
.aether-reveal[data-delay="0.16"]{transition-delay:.16s;}
.aether-reveal[data-delay="0.24"]{transition-delay:.24s;}
.aether-reveal[data-delay="0.30"]{transition-delay:.30s;}
.aether-reveal[data-delay="0.36"]{transition-delay:.36s;}
.aether-reveal[data-delay="0.42"]{transition-delay:.42s;}
.aether-reveal[data-delay="0.48"]{transition-delay:.48s;}

/* ===== 5. 数据动画 ===== */
.tnum{font-variant-numeric:tabular-nums;}
.a-bar{position:relative;overflow:hidden;border-radius:999px;background:#ffffff0f;height:8px;}
.a-bar>i{
  display:block;height:100%;width:0;border-radius:inherit;
  background:linear-gradient(90deg,var(--aether-indigo),var(--aether-teal));
  transition:width 1s cubic-bezier(.22,1,.36,1);
}
[data-ring]{transition:stroke-dashoffset 1.1s cubic-bezier(.22,1,.36,1);}

/* ===== 视觉细节 ===== */
.chip{
  border-radius:9999px;border:1px solid #ffffff1a;background:#ffffff0a;
  padding:.25rem .75rem;font-size:.75rem;color:#cbd5e1;transition:.15s;cursor:pointer;user-select:none;
}
.chip:hover{border-color:#ffffff33;background:#ffffff14;color:#fff;}
.chip.active{border-color:#a5b4fc66;background:#818cf826;color:#fff;}
.label{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:#94a3b8;}
.text-gradient{
  background-image:linear-gradient(120deg,#fff,#c7d2fe 42%,#99f6e4);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-thumb{background:#94a3b82e;border-radius:999px;}
::-webkit-scrollbar-thumb:hover{background:#94a3b852;}
::selection{background:#818cf84d;}

/* ===== 语义色助手（涨红跌绿） ===== */
.a-up{color:var(--aether-up);}
.a-down{color:var(--aether-down);}

/* ===== 关键帧 ===== */
@keyframes pulse-ring{0%{opacity:.55;transform:scale(.85)} 70%,to{opacity:0;transform:scale(1.6)}}
@keyframes float-slow{0%,to{transform:translateZ(0)} 50%{transform:translate3d(0,-14px,0)}}
@keyframes spin{to{transform:rotate(360deg)}}
.animate-pulse-ring{animation:pulse-ring 2.6s ease-out infinite;}
.animate-float-slow{animation:float-slow 14s ease-in-out infinite;}
.animate-spin{animation:spin 1s linear infinite;}

/* ===== details/summary 展开样式（Safari 适配） ===== */
details{border-radius:12px;overflow:hidden;}
details>summary{list-style:none;-webkit-list-style:none;}
details>summary::-webkit-details-marker{display:none;}
details[open]>summary span:last-child::after{content:' ▴';}
details:not([open])>summary span:last-child::after{content:' ▾';}
details>summary span:last-child::after{font-size:10px;color:rgba(255,255,255,.4);}

/* ===== 全局按钮磁吸 + 光效（轻微，不影响已有 .mag-react） ===== */
button:not(.mag-react):not(:disabled):not(.no-mag) {
  position: relative;
  transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease;
}
button:not(.mag-react):not(:disabled):not(.no-mag):hover {
  transform: translateY(-1px) scale(1.015);
  box-shadow: 0 0 0 1px rgba(129,140,248,.12), 0 8px 24px -8px rgba(99,102,241,.25);
}
button:not(.mag-react):not(:disabled):not(.no-mag):active {
  transform: translateY(0) scale(.98);
}

/* ===== 减弱动态效果：直接呈现终态 ===== */
@media (prefers-reduced-motion: reduce){
  .glass,.magnetic{transition:none!important;transform:none!important;}
  .glass::after,.magnet-glow{transition:none!important;opacity:0!important;}
  button:not(.mag-react):not(:disabled):not(.no-mag){transition:none!important;transform:none!important;box-shadow:none!important;}
  .aether-reveal{opacity:1!important;transform:none!important;transition:none!important;}
  .a-bar>i,[data-ring]{transition:none!important;}
  .aether-aura span{animation:none!important;}
  .animate-pulse-ring,.animate-float-slow,.animate-spin{animation:none!important;}
}