:root{
  --bg:#0d1117; --panel:#161b22; --panel2:#1c2330; --border:#2a3038;
  --text:#e6edf3; --muted:#8b949e; --accent:#0052D9;
  --up:#f5465c; --down:#2ebd85; --flat:#8b949e;   /* 涨红跌绿(中国习惯) */
  --gold:#f0b90b;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:-apple-system,"PingFang SC","Microsoft YaHei",Segoe UI,sans-serif;font-size:14px;line-height:1.5}
a{color:inherit;text-decoration:none}
.up{color:var(--up)!important} .down{color:var(--down)!important} .flat{color:var(--flat)!important}

/* 顶栏 */
.topbar{display:flex;align-items:center;gap:20px;padding:0 20px;height:52px;background:var(--panel);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.topbar .logo{font-weight:700;font-size:17px;color:var(--gold)}
.topbar nav a{padding:6px 12px;border-radius:6px;color:var(--muted)}
.topbar nav a:hover,.topbar nav a.active{background:var(--panel2);color:var(--text)}
.topbar .spacer{flex:1}
.topbar .user{color:var(--muted);font-size:13px}
.topbar .logout{color:var(--muted);cursor:pointer;padding:4px 10px;border:1px solid var(--border);border-radius:6px}
.topbar .logout:hover{color:var(--up);border-color:var(--up)}
.search-box{position:relative}
.search-box input{background:var(--panel2);border:1px solid var(--border);color:var(--text);padding:7px 12px;border-radius:8px;width:240px;outline:none}
.search-box input:focus{border-color:var(--accent)}
.search-results{position:absolute;top:40px;left:0;right:0;background:var(--panel2);border:1px solid var(--border);border-radius:8px;max-height:360px;overflow:auto;display:none;z-index:20}
.search-results.show{display:block}
.search-results .item{padding:9px 12px;cursor:pointer;display:flex;justify-content:space-between;border-bottom:1px solid var(--border)}
.search-results .item:hover{background:var(--panel)}

.container{max-width:1280px;margin:0 auto;padding:20px}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:16px;margin-bottom:16px}
.panel h2{font-size:15px;margin-bottom:12px;color:var(--text);font-weight:600}

/* 列表 */
.tabs{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.tabs button{background:var(--panel2);border:1px solid var(--border);color:var(--muted);padding:6px 16px;border-radius:20px;cursor:pointer}
.tabs button.active{background:var(--accent);color:#fff;border-color:var(--accent)}
table{width:100%;border-collapse:collapse}
th,td{padding:10px 12px;text-align:right;border-bottom:1px solid var(--border);white-space:nowrap}
th:first-child,td:first-child,th:nth-child(2),td:nth-child(2){text-align:left}
th{color:var(--muted);font-weight:500;font-size:13px;cursor:pointer;user-select:none}
tbody tr{cursor:pointer}
tbody tr:hover{background:var(--panel2)}
.code{color:var(--muted);font-family:monospace}
.tag{display:inline-block;padding:1px 7px;border-radius:4px;font-size:11px;background:var(--panel2);color:var(--muted);border:1px solid var(--border)}
.tag.st{background:#3a1a1a;color:var(--up);border-color:var(--up)}

/* 个股详情 */
.detail-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:8px}
.detail-head .name{font-size:24px;font-weight:700}
.detail-head .code{font-size:16px}
.price-big{font-size:40px;font-weight:700;line-height:1}
.price-row{display:flex;align-items:baseline;gap:16px;margin:6px 0 16px}
.price-row .chg{font-size:20px;font-weight:600}
.grid{display:grid;gap:12px}
.grid.q4{grid-template-columns:repeat(6,1fr)}
.grid.q3{grid-template-columns:repeat(4,1fr)}
.kv{background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:10px 12px}
.kv .k{color:var(--muted);font-size:12px;margin-bottom:4px}
.kv .v{font-size:16px;font-weight:600}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:900px){.grid.q4,.grid.q3{grid-template-columns:repeat(2,1fr)}.two-col{grid-template-columns:1fr}}

/* 盘口 */
.orderbook{display:grid;grid-template-columns:1fr;gap:3px}
.ob-row{display:grid;grid-template-columns:40px 1fr 90px;align-items:center;gap:8px;padding:4px 8px;border-radius:4px;position:relative}
.ob-row .lbl{color:var(--muted);font-size:12px}
.ob-row .px{text-align:left;font-weight:600;z-index:1}
.ob-row .vol{text-align:right;color:var(--muted);z-index:1}
.ob-row .bar{position:absolute;right:0;top:0;bottom:0;border-radius:4px;opacity:.15}
.ob-row.ask .bar{background:var(--up)} .ob-row.bid .bar{background:var(--down)}

/* 形态卡片 */
.patterns{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.pcard{background:var(--panel2);border:1px solid var(--border);border-radius:10px;padding:14px;text-align:center}
.pcard.hit{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}
.pcard .light{width:14px;height:14px;border-radius:50%;background:#444;margin:0 auto 8px}
.pcard.hit .light{background:var(--gold);box-shadow:0 0 10px var(--gold)}
.pcard .pname{font-weight:600;margin-bottom:6px}
.pcard .subs{display:flex;gap:4px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.pcard .sub{width:18px;height:18px;border-radius:4px;font-size:11px;display:flex;align-items:center;justify-content:center}
.pcard .sub.ok{background:#1a3a2a;color:var(--down)} .pcard .sub.no{background:#3a1a1a;color:var(--up)}
.pcard .cross{color:var(--muted);font-size:12px;margin-top:6px}
#chart{width:100%;height:520px}

/* 登录页 */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(1200px 600px at 50% -10%,#1a2740,#0d1117)}
.login-card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:40px;width:360px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.login-card h1{font-size:22px;margin-bottom:6px;color:var(--gold)}
.login-card .sub{color:var(--muted);font-size:13px;margin-bottom:24px}
.login-card label{display:block;color:var(--muted);font-size:13px;margin:14px 0 6px}
.login-card input{width:100%;background:var(--panel2);border:1px solid var(--border);color:var(--text);padding:11px 14px;border-radius:8px;outline:none;font-size:15px}
.login-card input:focus{border-color:var(--accent)}
.login-card button{width:100%;margin-top:24px;background:var(--accent);color:#fff;border:none;padding:12px;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer}
.login-card button:hover{background:#1a6ae0}
.login-err{color:var(--up);font-size:13px;margin-top:14px;min-height:18px;text-align:center}
.dashboard-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:900px){.dashboard-cards,.patterns{grid-template-columns:repeat(2,1fr)}}
.stat{background:var(--panel2);border:1px solid var(--border);border-radius:10px;padding:18px}
.stat .num{font-size:28px;font-weight:700;color:var(--accent)}
.stat .lbl{color:var(--muted);font-size:13px;margin-top:4px}
.btn{background:var(--accent);color:#fff;border:none;padding:10px 20px;border-radius:8px;cursor:pointer;font-size:14px}
.btn:hover{background:#1a6ae0}
.muted{color:var(--muted)}
.fresh-ok{color:var(--down)} .fresh-old{color:var(--gold)}

/* 小按钮 */
.btn-sm{background:var(--panel2);color:var(--muted);border:1px solid var(--border);padding:5px 14px;border-radius:6px;cursor:pointer;font-size:13px}
.btn-sm:hover{color:var(--text);border-color:var(--accent)}
.btn-sm.active{background:var(--accent);color:#fff;border-color:var(--accent)}

/* 加号按钮 */
.add-btn{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:6px;background:var(--panel2);border:1px solid var(--border);color:var(--accent);cursor:pointer;font-size:16px;line-height:1;user-select:none}
.add-btn:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.add-btn.added{background:var(--down);color:#fff;border-color:var(--down)}
.search-results .item{align-items:center}
.search-results .item .add-btn{flex:none}

/* 自选池左右布局 */
.watch-layout{display:grid;grid-template-columns:340px 1fr;gap:16px;align-items:start}
@media(max-width:800px){.watch-layout{grid-template-columns:1fr}}
.watch-list-panel{max-height:calc(100vh - 90px);overflow:auto;position:sticky;top:68px}
.watch-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.watch-head h2{margin:0}
.watch-item{display:flex;align-items:center;gap:8px;padding:10px;border-radius:8px;border:1px solid transparent;margin-bottom:6px;background:var(--panel2)}
.watch-item:hover{border-color:var(--border)}
.watch-item.active{border-color:var(--accent);background:#12233f}
.wi-main{flex:1;cursor:pointer;min-width:0}
.wi-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wi-code{font-size:11px}
.wi-price{text-align:right;min-width:64px}
.wi-edit{display:flex;gap:4px;align-items:center}
.wi-edit .mv,.wi-edit .del{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:5px;background:var(--panel);border:1px solid var(--border);cursor:pointer;font-size:12px}
.wi-edit .mv:hover{border-color:var(--accent);color:var(--accent)}
.wi-edit .del:hover{border-color:var(--up);color:var(--up)}
.watch-detail-panel{min-height:400px}
.detail-head .spacer{flex:1}