/* ------------------------------------------------------------------
   PVC 客户端 · 苹果风主题（Apple-style light theme）
   用途：在不改动任何页面内容的前提下，把客户端各模块统一换成
        明亮色背景 + 白卡大圆角 + 磨砂导航 + 轻盈动效。
   用法：页面 </head> 前 <link rel="stylesheet" href="/static/apple.css">
        页面 </body> 前 <script src="/static/apple.js" defer></script>
   约定：只覆盖「颜色/圆角/阴影/间距」等观感层，绝不改动 DOM 结构与可见文案。
------------------------------------------------------------------ */
:root{
  --ap-bg:#f5f5f7;
  --ap-bg2:#eef0f4;
  --ap-card:#ffffff;
  --ap-card2:#fbfbfd;
  --ap-line:#e6e8ec;
  --ap-line2:#eef0f3;
  --ap-txt:#1d1d1f;
  --ap-mut:#3a3a3c;
  --ap-mut2:#4a4a50;
  --ap-up:#de3a2c;          /* 涨 · 红 */
  --ap-down:#16a34a;        /* 跌 · 绿 */
  --ap-warn:#d08700;
  --ap-blue:#0071e3;
  --ap-blue-bg:#eaf2ff;
  --ap-gold:#b06f00;
  --ap-r:20px;
  --ap-r-sm:12px;
  --ap-sh:0 1px 2px rgba(16,24,40,.04), 0 8px 24px rgba(16,24,40,.06);
  --ap-sh-hi:0 2px 6px rgba(16,24,40,.06), 0 18px 40px rgba(16,24,40,.10);
  --ap-ease:cubic-bezier(.22,.61,.36,1);
}

/* 所有客户端页共用的深色变量 → 一次性换成明亮色 */
:root{
  --bg:var(--ap-bg) !important;
  --card:var(--ap-card) !important;
  --line:var(--ap-line) !important;
  --txt:var(--ap-txt) !important;
  --mut:var(--ap-mut) !important;
  --up:var(--ap-up) !important;
  --down:var(--ap-down) !important;
  --warn:var(--ap-warn) !important;
  --blue:var(--ap-blue) !important;
}

html,body{background-color:var(--ap-bg) !important;background-image:none !important; color:var(--ap-txt) !important;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro SC","SF Pro Text","PingFang SC",
    "Helvetica Neue","Microsoft YaHei",sans-serif !important;
  -webkit-font-smoothing:antialiased;
  letter-spacing:.1px;
}
::selection{background:rgba(0,113,227,.16)}

/* 滚动条也一起变浅 */
*::-webkit-scrollbar{height:8px;width:8px}
*::-webkit-scrollbar-thumb{background:#d2d5db;border-radius:99px}
*::-webkit-scrollbar-track{background:transparent}

h1{font-weight:700 !important; letter-spacing:-.2px}
h1,h2,h3{color:var(--ap-txt) !important}

/* ------------------------------------------------------------------ 顶栏 */
.ap-nav{
  position:fixed; top:0; left:0; right:0; z-index:60;
  background:rgba(255,255,255,.78);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.ap-nav-in{
  max-width:1480px; margin:0 auto; padding:10px 16px;
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.ap-brand{
  display:flex; align-items:center; gap:8px; text-decoration:none;
  font-size:15px; font-weight:700; color:var(--ap-txt); white-space:nowrap;
}
.ap-logo{
  width:26px;height:26px;border-radius:8px;flex:0 0 auto;
  background:linear-gradient(145deg,#3aa0ff,#0071e3);
  box-shadow:0 2px 8px rgba(0,113,227,.35);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:13px;font-weight:700;
}
.ap-links{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
/* 右上角用户区（登录/积分/称号）：紧跟导航链接右侧，与「关于」同一行 */
.ap-nav-user{display:flex;align-items:center;flex:0 0 auto}
.ap-nav-user:empty{display:none}
.ap-link{
  text-decoration:none;color:var(--ap-txt);font-size:13.5px;font-weight:500;
  padding:6px 12px;border-radius:99px;transition:.25s var(--ap-ease);white-space:nowrap;
}
.ap-link:hover{background:rgba(0,0,0,.05);color:var(--ap-txt)}
.ap-link.on{background:var(--ap-txt);color:#fff}
.ap-env{font-size:11px;color:var(--ap-txt);padding:2px 8px;border-radius:99px;
  border:1px solid var(--ap-line);background:#fff}

/* 顶部 mortgage：把页面自身内容往下推一点 */
.ap-spacer{height:14px}

/* ------------------------------------------------------------------ 通用容器卡片 */
.wrap{max-width:1480px !important;margin-left:auto !important;margin-right:auto !important}
.card,details,.warnbox,.notebar,section,.panel,.box{
  background:var(--ap-card) !important;
  border:1px solid var(--ap-line) !important;
  border-radius:var(--ap-r) !important;
  box-shadow:var(--ap-sh);
}
.card,.box,section{margin-bottom:14px}
details{padding:14px 16px !important}
summary{color:var(--ap-txt) !important}
.warnbox{
  background:#fff8ec !important; border-color:#f5d9a4 !important; color:#7a5410 !important;
  border-radius:var(--ap-r) !important;
}
.notebar{background:var(--ap-blue-bg) !important;border-color:#cfe2ff !important;color:#0b4fa8 !important}
.notebar b{color:#084298 !important}

/* 小方块/胶囊/标签 */
.stat,.chip,.hday,.tier .chip,.sect .chip{
  background:#fff !important;
  border:1px solid var(--ap-line) !important;
  border-radius:var(--ap-r-sm) !important;
  color:var(--ap-txt) !important;
}
.stat{box-shadow:0 1px 2px rgba(16,24,40,.04)}
.stat .k{color:var(--ap-mut2) !important}
.stat .n{color:var(--ap-mut2) !important}
.sect .chip{color:var(--ap-blue) !important;border-color:#cfe2ff !important;background:var(--ap-blue-bg) !important}
.chip{box-shadow:none}
.yz{background:#fdecea !important;color:#b3261e !important;border-color:#f5c6c2 !important}

/* 按钮 */
a.btn,.btn,button.btn{
  background:var(--ap-blue) !important;border:1px solid var(--ap-blue) !important;
  color:#fff !important;border-radius:99px !important;padding:7px 15px !important;
  font-weight:600 !important;box-shadow:0 1px 3px rgba(0,113,227,.25);
  transition:transform .22s var(--ap-ease),box-shadow .22s var(--ap-ease),background .22s;
}
a.btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,113,227,.28)}
a.btn:active{transform:scale(.97)}
a.btn.gh,button.gh{
  background:#fff !important;color:var(--ap-txt) !important;border-color:var(--ap-line) !important;
  box-shadow:none;
}
button,.hday{cursor:pointer;transition:.22s var(--ap-ease)}
.hday:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(16,24,40,.08)}
.hday.on{background:var(--ap-blue) !important;border-color:var(--ap-blue) !important;color:#fff !important}

/* ------------------------------------------------------------------ 表格 */
table{border-collapse:separate !important;border-spacing:0}
th{
  color:var(--ap-mut) !important;font-weight:600 !important;
  border-bottom:1px solid var(--ap-line) !important;background:#fafafc;
}
th:first-child{border-top-left-radius:var(--ap-r-sm)}
th:last-child{border-top-right-radius:var(--ap-r-sm)}
td{border-bottom:1px solid var(--ap-line2) !important;color:var(--ap-txt) !important}
tbody tr{transition:background .18s}
tbody tr:hover{background:#f7f8fa !important}
tbody tr:nth-child(even){background:#fcfcfd}
.pbar{background:#f0f1f4 !important;border-color:var(--ap-line) !important}
.pbar i{background:linear-gradient(90deg,#f0a09a,var(--ap-up)) !important}
.bar-out{background:#f0f1f4 !important;border-color:var(--ap-line) !important}
.nm{color:var(--ap-txt) !important}
.code,.rsn,.mut{color:var(--ap-mut) !important}
.bd1{color:var(--ap-txt) !important}
.bd2{color:var(--ap-warn) !important}
.bd3{color:#e06a2b !important}
.bd4{color:var(--ap-up) !important}
.blu{color:var(--ap-blue) !important}
.red{color:var(--ap-up) !important}
.grn{color:var(--ap-down) !important}
.warn{color:var(--ap-warn) !important}

/* 横向滚动容器加一点内边距，避免卡片贴边 */
.scroll{-webkit-overflow-scrolling:touch}

/* plotly 图表外壳统一白底 */
.js-plotly-plot,.plot-container,.plotly,.svg-container{background:#fff !important;border-radius:var(--ap-r)}
.modebar{opacity:.35}
.modebar:hover{opacity:.9}

/* ------------------------------------------------------------------ 动画 */
@keyframes apRise{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@keyframes apFade{from{opacity:0}to{opacity:1}}
@keyframes apPop{0%{opacity:0;transform:scale(.96)}60%{transform:scale(1.01)}100%{opacity:1;transform:none}}
@keyframes apFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

.ap-anim{opacity:0;animation:apRise .62s var(--ap-ease) forwards;animation-play-state:paused}
.ap-anim.ap-in{animation-play-state:running}
.ap-anim-fade{opacity:0;animation:apFade .8s var(--ap-ease) forwards;animation-play-state:paused}
.ap-anim-fade.ap-in{animation-play-state:running}
.ap-anim-pop{opacity:0;animation:apPop .5s var(--ap-ease) forwards;animation-play-state:paused}
.ap-anim-pop.ap-in{animation-play-state:running}

.card,.box,section,table{will-change:transform}
tbody tr.ap-rowin{animation:apRise .45s var(--ap-ease) backwards}

/* 悬停轻微抬升（苹果卡片手感） */
.card,.box,.ap-lift{transition:transform .28s var(--ap-ease),box-shadow .28s var(--ap-ease)}
.card:hover,.box:hover,.ap-lift:hover{transform:translateY(-2px);box-shadow:var(--ap-sh-hi)}

/* 回到顶部 */
.ap-top{
  position:fixed;right:18px;bottom:22px;z-index:80;width:44px;height:44px;border-radius:50%;
  background:rgba(255,255,255,.9);border:1px solid var(--ap-line);
  box-shadow:0 6px 20px rgba(16,24,40,.14);color:var(--ap-txt);
  font-size:18px;display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:.3s var(--ap-ease);cursor:pointer;
  backdrop-filter:blur(12px);
}
.ap-top.on{opacity:1;pointer-events:auto}
.ap-top:active{transform:scale(.92)}

/* 移动端 */
@media(max-width:640px){
  .ap-nav-in{padding:9px 12px;gap:8px}
  .ap-brand{font-size:14px}
  .ap-link{font-size:12.5px;padding:5px 10px}
  .ap-r{--ap-r:16px}
  .card,.box,section,details{border-radius:16px !important}
}

/* 条形填充：深色渐变起点换成柔和色 */
.pos{background:linear-gradient(90deg,#f4b6b0,var(--ap-up)) !important}
.neg{background:linear-gradient(90deg,#bfe6cd,var(--ap-down)) !important}

/* 页面自带 sticky 工具条停在统一导航下方 */
.topbar{top:var(--ap-navh,0px) !important}

/* ------------------------------------------------------------------
   产业链页 chain.html 苹果风适配
   （该页自带一整套深色玻璃体系，这里在不动结构的前提下整体翻成明亮色）
------------------------------------------------------------------ */
:root{
  --bg1:#fbfbfd !important; --bg2:#eef1f6 !important;
  --dim:#3a3a3c !important;
}
body > header,body > .wrap{margin-top:2px}
/* 宽屏下右栏稍宽，两栏更均衡（.left-col 仅产业链页有） */
.left-col ~ .panel{flex:0 1 400px;min-width:340px}
h1 span{color:#0891b2 !important}
h1 em{color:#a16207 !important;border-color:#f0d08a !important;background:#fff8ec !important}
.stage{background:#ffffff !important;border-color:var(--ap-line) !important;box-shadow:var(--ap-sh)}
.node{background:linear-gradient(150deg,#ffffff,#fbfbfd) !important;border-color:var(--ap-line) !important;
  box-shadow:0 1px 2px rgba(16,24,40,.05)}
.node:hover{box-shadow:0 10px 26px rgba(16,24,40,.12) !important}
.n-t{color:var(--ap-txt) !important}
.n-bar,.heat-bar{background:#eef0f3 !important}
.pulse{fill:#a0a5ab !important}
.d-name{color:var(--ap-txt) !important}
.d-row{border-top-color:#eef0f3 !important}
.d-row span{color:#3a3a3c !important}
.d-desc{color:#4c4c52 !important;background:#f7f8fa !important}
.cm-theme b{color:#0e7490 !important}
.cm-ytd.up,.cm-ytd.dn{text-shadow:none !important}
.tab{background:#fff !important;border-color:var(--ap-line) !important;color:var(--ap-mut) !important}
.tab:hover{color:var(--ap-txt) !important;border-color:#9ad0f0 !important}
.tab.active{background:var(--ap-blue-bg) !important;border-color:var(--ap-blue) !important;
  color:#0b4fa8 !important;box-shadow:none !important}
.ctrl .btn,.scen .btn,.vbtns .btn,.panel .btn{
  background:#fff !important;border-color:var(--ap-line) !important;color:#3a3a3c !important;
  border-radius:99px !important;
}
.ctrl .btn:hover,.scen .btn:hover{background:#f2f3f5 !important;color:var(--ap-txt) !important}
.ctrl .btn.primary,.scen .btn.primary{background:linear-gradient(135deg,#38bdf8,#6366f1) !important;color:#fff !important}
.mini{background:#fff !important;border-color:var(--ap-line) !important;color:var(--ap-mut) !important}
.mini:hover{background:#f2f3f5 !important;color:var(--ap-txt) !important}
.vlab{color:#4c4c52 !important}
.vval{color:var(--ap-txt) !important}
.vhint,.foot,.sum em,.decay-ctl,.search::placeholder,.cm-asof{color:var(--ap-mut2) !important}
.stage-vars{background:rgba(255,255,255,.97) !important;border-color:#cfe2ff !important;
  box-shadow:0 14px 40px rgba(16,24,40,.16) !important}
.stage-vars::before{background:#fff !important;border-color:#cfe2ff !important}
.sv-head{color:var(--ap-mut) !important}
.sv-head b{color:var(--ap-txt) !important}
.sv-close{background:#fff !important;color:var(--ap-mut) !important}
.node-pop .node{background:#fff !important}
.node-pop .n-s{color:var(--ap-mut) !important}
.stage-scrim{background:rgba(245,247,250,.72) !important}
.vtoast{background:rgba(255,255,255,.97) !important;border-color:#cfe2ff !important;
  color:#3a3a3c !important;box-shadow:0 10px 34px rgba(16,24,40,.16) !important}
.brk{background:#f7f8fa !important;color:var(--ap-mut) !important}
.sum{color:#4c4c52 !important}
.sum div{border-bottom-color:#eef0f3 !important}
.sum-row:hover{background:#f2f3f5 !important}
.cscen{background:#f2f8ff !important;border-color:#bcd8f5 !important;color:#0b4fa8 !important}
.cscen:hover{color:#084298 !important}
.search,.scen input[type=text]{background:#fff !important;border-color:var(--ap-line) !important;
  color:var(--ap-txt) !important}
input[type=range]::-webkit-slider-thumb{background:#fff !important;border:1.5px solid var(--ap-blue) !important;
  box-shadow:0 1px 4px rgba(0,113,227,.35) !important}
input[type=range]::-moz-range-thumb{background:#fff !important;border:1.5px solid var(--ap-blue) !important}

/* 页面自带的顶栏（如产业链页）→ 磨砂浅色；有它就不再重复注入统一导航条 */
.ap-nav-self{
  position:sticky;top:0;z-index:60;
  justify-content:flex-end;
  background:rgba(255,255,255,.78) !important;
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(0,0,0,.06) !important;
}
.ap-nav-self span{color:var(--ap-txt) !important}
.ap-nav-self a{
  color:var(--ap-txt) !important;background:#fff !important;border-color:var(--ap-line) !important;
  border-radius:99px !important;text-decoration:none;transition:.24s var(--ap-ease);
}
.ap-nav-self a:hover{background:#f2f3f5 !important}
.ap-nav-self a[href="/chain"]{background:var(--ap-blue-bg) !important;border-color:var(--ap-blue) !important;
  color:#0b4fa8 !important}

@media (prefers-reduced-motion: reduce){
  .ap-anim,.ap-anim-fade,.ap-anim-pop,tbody tr.ap-rowin{animation:none !important;opacity:1 !important}
  .card:hover{transform:none}
}
