:root{
  --bg:#0b0e14; --bg2:#11151f; --card:#151a26; --card2:#1a2030;
  --bd:#232a3b; --tx:#d6dcea; --dim:#7d8699; --dim2:#5a6274;
  --red:#ff4d4f; --green:#0ec67c; --gold:#f5b04c; --blue:#4da3ff;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg);color:var(--tx);font:14px/1.6 "PingFang SC","Microsoft YaHei",system-ui,sans-serif}
a{color:var(--blue);text-decoration:none}
.dim{color:var(--dim)}
.mono{font-family:var(--mono)}
.up{color:var(--red)} .down{color:var(--green)} .flat{color:var(--dim)}

.topbar{display:flex;align-items:center;gap:20px;padding:10px 18px;background:var(--bg2);border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:10;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px}
.logo{width:38px;height:38px;border-radius:9px;background:linear-gradient(135deg,#ff4d4f,#f5b04c);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;color:#fff}
.brand h1{font-size:17px;font-weight:700;letter-spacing:1px}
.brand small{color:var(--dim);font-size:11px}
nav{display:flex;gap:4px;flex:1;flex-wrap:wrap}
nav a{padding:7px 14px;border-radius:8px;color:var(--dim);font-weight:500}
nav a:hover{color:var(--tx);background:var(--card)}
nav a.active{color:#fff;background:var(--card2);box-shadow:inset 0 0 0 1px var(--bd)}
.top-right{display:flex;gap:8px;align-items:center}
#stock-search{background:var(--card);border:1px solid var(--bd);border-radius:8px;color:var(--tx);padding:7px 10px;font-size:13px}
button{background:var(--card2);border:1px solid var(--bd);color:var(--tx);border-radius:8px;padding:7px 12px;cursor:pointer;font-size:13px}
button:hover{border-color:var(--dim)}
button.primary{background:var(--blue);border-color:var(--blue);color:#fff}

main{padding:16px 18px 60px;max-width:1500px;margin:0 auto}
.loading{display:flex;gap:10px;align-items:center;justify-content:center;padding:80px 0;color:var(--dim)}
.spinner{width:18px;height:18px;border:2px solid var(--bd);border-top-color:var(--blue);border-radius:50%;animation:sp 0.8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-bottom:16px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:12px 14px}
.card h3{font-size:13px;color:var(--dim);font-weight:500;margin-bottom:4px}
.card .v{font-size:22px;font-weight:700;font-family:var(--mono)}
.card .d{font-size:12px;margin-top:2px}

section{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:14px 16px;margin-bottom:16px}
section h2{font-size:15px;font-weight:600;margin-bottom:12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
section h2 .tag{font-size:11px;color:var(--dim);font-weight:400}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}

table{width:100%;border-collapse:collapse;font-size:13px}
th{color:var(--dim);font-weight:500;text-align:right;padding:6px 8px;border-bottom:1px solid var(--bd);white-space:nowrap;cursor:pointer;user-select:none}
th:nth-child(1),th:nth-child(2),td:nth-child(1),td:nth-child(2){text-align:left}
th .ar{color:var(--blue);font-size:10px}
td{padding:6px 8px;border-bottom:1px solid #1a2030;text-align:right;font-family:var(--mono);white-space:nowrap}
tr:hover td{background:var(--card2)}
.tname{font-family:inherit}
.tname b{font-weight:600}
.tname small{display:block;color:var(--dim2);font-size:11px}
.tblwrap{max-height:520px;overflow:auto}

.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.tabs button{border-radius:20px;padding:6px 16px}
.tabs button.active{background:var(--blue);border-color:var(--blue);color:#fff}

.filterrow{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.filterrow select,.filterrow input{background:var(--card2);border:1px solid var(--bd);color:var(--tx);border-radius:8px;padding:6px 8px;font-size:13px}
.chip{font-size:12px;color:var(--dim);background:var(--card2);border:1px solid var(--bd);border-radius:14px;padding:3px 10px;display:inline-flex;gap:6px;align-items:center}
.chip b{color:var(--tx);font-weight:600}

.chart{width:100%;height:420px}
.chart-sm{height:260px}
.indbar{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.indbar button{border-radius:6px;padding:4px 10px;font-size:12px}
.indbar button.on{background:var(--gold);border-color:var(--gold);color:#111}

.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.kv .k{font-size:11px;color:var(--dim)}
.kv .val{font-size:14px;font-weight:600;font-family:var(--mono)}

.bar{height:8px;border-radius:4px;background:var(--card2);overflow:hidden;display:flex}
.bar .pos{background:var(--red)}
.bar .neg{background:var(--green)}

footer{padding:14px 18px;color:var(--dim2);font-size:12px;text-align:center;border-top:1px solid var(--bd)}
.err{color:var(--red);background:#2a1518;border:1px solid #573038;border-radius:8px;padding:8px 12px;font-size:13px}
.note{font-size:12px;color:var(--dim);margin-top:8px}
ul.kb{list-style:none}
ul.kb li{padding:10px 0;border-bottom:1px solid #1a2030}
ul.kb li:last-child{border-bottom:none}
ul.kb .kk{color:var(--gold);font-weight:600;margin-right:8px}
pre.code{background:#0d1017;border:1px solid var(--bd);border-radius:8px;padding:10px;font-size:12px;overflow:auto;font-family:var(--mono);color:#9fb3d1;margin:8px 0}
.stars{color:var(--gold);font-size:12px}
.pill{display:inline-block;font-size:11px;border:1px solid var(--bd);color:var(--dim);border-radius:10px;padding:1px 8px;margin-left:6px}
.pill.ok{color:var(--green);border-color:var(--green)}
.pill.bad{color:var(--red);border-color:var(--red)}