/* ============ 基础重置 ============ */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: 'Microsoft YaHei','PingFang SC',sans-serif; background:#0d1117; color:#e6edf3; overflow-x:hidden; }

/* === 顶栏 === */
.topbar { background:#161b22; border-bottom:1px solid #30363d; padding:10px 24px; display:flex; align-items:center; gap:16px; }
.topbar h1 { font-size:18px; color:#58a6ff; white-space:nowrap; }
.topbar h1 span { color:#f0883e; font-size:13px; margin-left:6px; }

/* 搜索区 */
.search-box { display:flex; align-items:center; gap:8px; flex:0 0 420px; }
.search-input { flex:1; background:#0d1117; border:1px solid #30363d; border-radius:6px; padding:7px 12px; color:#e6edf3; font-size:14px; outline:none; transition:border .2s; }
.search-input:focus { border-color:#58a6ff; }
.search-input::placeholder { color:#484f58; }
.search-btn { background:#238636; border:none; border-radius:6px; padding:7px 16px; color:#fff; font-size:13px; cursor:pointer; white-space:nowrap; transition:background .2s; }
.search-btn:hover { background:#2ea043; }
.search-btn:disabled { background:#484f58; cursor:not-allowed; }

/* 周期选择 */
.period-group { display:flex; gap:2px; background:#0d1117; border:1px solid #30363d; border-radius:6px; padding:2px; }
.period-btn { background:transparent; border:none; border-radius:4px; padding:5px 10px; color:#8b949e; font-size:12px; cursor:pointer; transition:all .2s; }
.period-btn:hover { color:#e6edf3; background:#1c2333; }
.period-btn.active { background:#58a6ff; color:#fff; }

/* 股票信息 */
.stock-info { display:flex; align-items:center; gap:12px; margin-left:auto; font-size:13px; color:#8b949e; white-space:nowrap; }
.stock-info b { color:#f0883e; }
.stock-info .price { font-size:16px; font-weight:700; }

/* 搜索下拉 */
.search-dropdown { position:absolute; top:42px; left:0; width:100%; background:#1c2333; border:1px solid #30363d; border-radius:6px; max-height:260px; overflow-y:auto; z-index:999; display:none; }
.search-dropdown.show { display:block; }
.search-item { padding:8px 14px; cursor:pointer; font-size:13px; display:flex; justify-content:space-between; transition:background .15s; }
.search-item:hover { background:#2d333b; }
.search-item .code { color:#58a6ff; }
.search-item .name { color:#e6edf3; }
.search-item .market { color:#484f58; font-size:11px; }

/* 加载遮罩 */
.loading-overlay { position:fixed; inset:0; background:rgba(13,17,23,0.85); z-index:9000; display:none; justify-content:center; align-items:center; flex-direction:column; gap:16px; }
.loading-overlay.show { display:flex; }
.spinner { width:48px; height:48px; border:3px solid #30363d; border-top-color:#58a6ff; border-radius:50%; animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.loading-text { color:#8b949e; font-size:14px; }

/* === 主体 === */
.main { display:flex; height:calc(100vh - 44px); }

/* 左侧面板 */
.sidebar { width:280px; background:#161b22; border-right:1px solid #30363d; overflow-y:auto; flex-shrink:0; }
.sidebar h3 { padding:12px 16px 6px; font-size:13px; color:#8b949e; text-transform:uppercase; letter-spacing:1px; }
.card { margin:6px 12px; background:#0d1117; border:1px solid #30363d; border-radius:8px; padding:12px; }
.card .label { font-size:11px; color:#8b949e; margin-bottom:2px; }
.card .value { font-size:16px; font-weight:700; }
.card .value.red { color:#ef4444; }
.card .value.green { color:#22c55e; }
.card .value.blue { color:#58a6ff; }
.card .value.orange { color:#f0883e; }

/* 笔段列表 */
.stroke-list { margin:6px 12px; }
.stroke-item { display:flex; align-items:center; padding:5px 10px; margin:2px 0; background:#0d1117; border:1px solid #30363d; border-radius:6px; font-size:12px; cursor:pointer; transition:background .2s; }
.stroke-item:hover { background:#1c2333; }
.stroke-item .tag { width:28px; height:18px; border-radius:4px; font-size:10px; font-weight:700; display:flex; align-items:center; justify-content:center; margin-right:8px; color:#fff; }
.stroke-item .tag.up { background:#ef4444; }
.stroke-item .tag.down { background:#22c55e; }
.stroke-item .detail { flex:1; color:#8b949e; }

/* 中枢列表 */
.cz-list { margin:6px 12px; }
.cz-item { padding:8px 10px; margin:4px 0; background:#0d1117; border-radius:6px; font-size:12px; border-left:3px solid #a855f7; }
.cz-item.orange { border-left-color:#f0883e; }

/* 信号 */
.signal-box { margin:6px 12px; padding:10px; background:#0d1117; border:1px solid #30363d; border-radius:8px; }
.signal-item { display:flex; align-items:center; gap:8px; padding:4px 0; font-size:12px; }
.signal-dot { width:8px; height:8px; border-radius:50%; }
.signal-dot.buy { background:#22c55e; }
.signal-dot.sell { background:#ef4444; }
.signal-dot.watch { background:#f0883e; }

/* 右侧图表 */
.chart-area { flex:1; display:flex; flex-direction:column; overflow:hidden; }
.chart-container { flex:1; min-height:400px; }
.bottom-panel { height:180px; background:#161b22; border-top:1px solid #30363d; padding:10px 16px; overflow-y:auto; }
.bottom-panel h4 { font-size:13px; color:#58a6ff; margin-bottom:6px; }
.bottom-panel table { width:100%; border-collapse:collapse; font-size:12px; }
.bottom-panel th { text-align:left; color:#8b949e; padding:3px 8px; border-bottom:1px solid #30363d; }
.bottom-panel td { padding:3px 8px; border-bottom:1px solid #1c2333; }
.bottom-panel .red { color:#ef4444; }
.bottom-panel .green { color:#22c55e; }

/* 空状态 */
.empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; color:#484f58; gap:12px; }
.empty-state .icon { font-size:64px; opacity:0.3; }
.empty-state .text { font-size:14px; }
.empty-state .hint { font-size:12px; color:#30363d; }

/* Toast通知 */
.toast-container { position:fixed; top:60px; right:20px; z-index:10000; display:flex; flex-direction:column; gap:8px; }
.toast { padding:10px 18px; border-radius:8px; font-size:13px; color:#e6edf3; animation:toastIn .3s ease; min-width:200px; max-width:400px; word-break:break-all; }
.toast.error { background:#7f1d1d; border:1px solid #ef4444; }
.toast.warn { background:#78350f; border:1px solid #f0883e; }
.toast.success { background:#14532d; border:1px solid #22c55e; }
.toast.info { background:#1e3a5f; border:1px solid #58a6ff; }
@keyframes toastIn { from { opacity:0; transform:translateX(30px); } to { opacity:1; transform:translateX(0); } }

/* ============ 自选股标签 ============ */
.watchlist-tags { display:flex; flex-wrap:wrap; gap:4px; margin:6px 12px; min-height:24px; }
.wl-tag { display:inline-flex; align-items:center; gap:4px; background:#1c2333; border:1px solid #30363d; border-radius:4px; padding:2px 8px; font-size:11px; color:#e6edf3; cursor:pointer; transition:background .15s; }
.wl-tag:hover { background:#2d333b; }
.wl-tag .remove { color:#484f58; font-size:10px; margin-left:2px; }
.wl-tag .remove:hover { color:#ef4444; }

/* ============ 导出按钮 ============ */
.export-bar { display:flex; gap:4px; margin:6px 12px; }
.export-btn { background:#1c2333; border:1px solid #30363d; border-radius:4px; padding:4px 10px; font-size:11px; color:#8b949e; cursor:pointer; transition:all .15s; }
.export-btn:hover { background:#2d333b; color:#e6edf3; }

/* ============ 响应式布局 ============ */
@media (max-width: 1024px) {
  .topbar { flex-wrap: wrap; padding: 8px 12px; gap: 8px; }
  .search-box { flex: 1 1 300px; }
  .stock-info { margin-left: 0; flex-basis: 100%; }
  .sidebar { width: 240px; }
}

@media (max-width: 768px) {
  .main { flex-direction: column; height: auto; min-height: calc(100vh - 44px); }
  .sidebar { width: 100%; border-right: none; border-bottom: 1px solid #30363d; max-height: 40vh; }
  .chart-area { min-height: 60vh; }
  .bottom-panel { height: 150px; }
  .topbar { padding: 6px 10px; }
  .topbar h1 { font-size: 15px; }
  .search-box { flex: 1 1 100%; }
  .period-group { flex-wrap: wrap; }
}

@media (max-width: 480px) {
  .sidebar { max-height: 35vh; }
  .chart-container { min-height: 300px; }
  .bottom-panel { height: 120px; padding: 6px 8px; }
  .bottom-panel th, .bottom-panel td { padding: 2px 4px; font-size: 11px; }
}

/* ============ 选股筛选面板 ============ */
.screen-panel { position:fixed; top:0; left:-420px; width:400px; height:100vh; background:#161b22; border-right:1px solid #30363d; z-index:8000; transition:left .3s ease; overflow-y:auto; padding:20px 16px 16px; }
.screen-panel.open { left:0; }
.screen-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:7999; display:none; }
.screen-overlay.show { display:block; }
.screen-panel h2 { font-size:16px; color:#58a6ff; margin-bottom:16px; display:flex; align-items:center; justify-content:space-between; }
.screen-panel .close-btn { background:none; border:none; color:#8b949e; font-size:20px; cursor:pointer; }
.screen-panel .close-btn:hover { color:#e6edf3; }

.screen-section { margin-bottom:18px; padding-bottom:14px; border-bottom:1px solid #21262d; }
.screen-section:last-of-type { border-bottom:none; }
.screen-section h4 { font-size:12px; color:#58a6ff; margin-bottom:8px; letter-spacing:0.5px; display:flex; align-items:center; gap:6px; }
.screen-section h4::before { content:''; display:inline-block; width:3px; height:12px; background:#1f6feb; border-radius:2px; }
.screen-input { width:100%; background:#0d1117; border:1px solid #30363d; border-radius:4px; padding:6px 10px; color:#e6edf3; font-size:12px; outline:none; }
.screen-input:focus { border-color:#58a6ff; }

.filter-group { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:4px; }
.filter-chip { display:inline-flex; align-items:center; padding:4px 12px; border-radius:14px; font-size:12px; border:1px solid #30363d; color:#8b949e; cursor:pointer; transition:all .15s; user-select:none; }
.filter-chip:hover { border-color:#58a6ff; color:#e6edf3; }
.filter-chip.selected { background:#1f6feb; border-color:#1f6feb; color:#fff; }

/* 预设方案 - 紧凑列表 */
.preset-list { display:flex; flex-direction:column; gap:4px; }
.preset-card { background:#0d1117; border:1px solid #30363d; border-radius:6px; padding:6px 10px; cursor:pointer; transition:border .15s; display:flex; align-items:center; gap:8px; }
.preset-card:hover { border-color:#58a6ff; }
.preset-card.selected { border-color:#1f6feb; background:#0d1a2e; }
.preset-card .name { font-size:12px; color:#e6edf3; font-weight:600; white-space:nowrap; }
.preset-card .desc { font-size:11px; color:#8b949e; flex:1; }
.preset-card .radio { width:14px; height:14px; border-radius:50%; border:2px solid #30363d; flex-shrink:0; display:flex; align-items:center; justify-content:center; transition:all .15s; }
.preset-card.selected .radio { border-color:#1f6feb; }
.preset-card.selected .radio::after { content:''; width:6px; height:6px; border-radius:50%; background:#1f6feb; }

/* 参数行 */
.param-row { display:flex; gap:8px; align-items:center; margin-top:6px; }
.param-row .param-label { font-size:11px; color:#8b949e; white-space:nowrap; min-width:40px; }
.param-row .screen-input { flex:1; }

.screen-run-btn { width:100%; background:#238636; border:none; border-radius:6px; padding:10px; color:#fff; font-size:14px; font-weight:600; cursor:pointer; margin-top:12px; transition:background .2s; }
.screen-run-btn:hover { background:#2ea043; }
.screen-run-btn:disabled { background:#484f58; cursor:not-allowed; }

/* 筛选结果覆盖层 */
.screen-results-panel { position:fixed; top:44px; right:-520px; width:500px; height:calc(100vh - 44px); background:#161b22; border-left:1px solid #30363d; z-index:7000; transition:right .3s ease; overflow-y:auto; }
.screen-results-panel.open { right:0; }
.screen-results-header { padding:12px 16px; border-bottom:1px solid #30363d; display:flex; align-items:center; justify-content:space-between; }
.screen-results-header h3 { font-size:14px; color:#58a6ff; }
.screen-results-header .close-btn { background:none; border:none; color:#8b949e; font-size:18px; cursor:pointer; }

.result-item { padding:10px 16px; border-bottom:1px solid #1c2333; cursor:pointer; transition:background .15s; }
.result-item:hover { background:#1c2333; }
.result-item .top { display:flex; justify-content:space-between; align-items:center; }
.result-item .code { font-size:13px; color:#58a6ff; font-weight:600; }
.result-item .name { font-size:12px; color:#8b949e; margin-left:6px; }
.result-item .score { font-size:16px; font-weight:700; }
.result-item .score.high { color:#22c55e; }
.result-item .score.mid { color:#f0883e; }
.result-item .score.low { color:#8b949e; }
.result-item .price-row { display:flex; gap:12px; margin-top:4px; font-size:12px; color:#8b949e; }
.result-item .tags { display:flex; flex-wrap:wrap; gap:3px; margin-top:4px; }
.result-item .tag { background:#1c2333; border-radius:3px; padding:1px 6px; font-size:10px; color:#58a6ff; }
.result-item .tag.chan { color:#a855f7; }
.result-item .tag.vp { color:#22c55e; }
.result-item .tag.trend { color:#f0883e; }
.result-item .tag.pattern { color:#ef4444; }

.screen-progress { padding:8px 16px; font-size:12px; color:#8b949e; background:#0d1117; border-bottom:1px solid #30363d; display:flex; align-items:center; gap:8px; }
.screen-progress .bar { flex:1; height:4px; background:#30363d; border-radius:2px; overflow:hidden; }
.screen-progress .bar-fill { height:100%; background:#58a6ff; transition:width .3s; }

.screen-trigger-btn { background:#1c2333; border:1px solid #30363d; border-radius:6px; padding:5px 12px; color:#58a6ff; font-size:12px; cursor:pointer; transition:all .15s; white-space:nowrap; }
.screen-trigger-btn:hover { background:#2d333b; border-color:#58a6ff; }
.back-results-btn { background:#1c2333; border:1px solid #d29922; border-radius:6px; padding:5px 12px; color:#d29922; font-size:12px; cursor:pointer; transition:all .15s; white-space:nowrap; }
.back-results-btn:hover { background:#2d333b; border-color:#e3b341; color:#e3b341; }

/* 解牛庖丁导航按钮 */
.ding-trigger-link { background:#1e1b4b; border:1px solid #7c3aed; border-radius:6px; padding:5px 12px; color:#a78bfa; font-size:12px; text-decoration:none; transition:all .15s; white-space:nowrap; }
.ding-trigger-link:hover { background:#7c3aed; color:#fff; }

/* 用户区域 */
.user-area { display:flex; align-items:center; gap:6px; margin-left:8px; }
.user-btn { background:#1c2333; border:1px solid #30363d; border-radius:6px; padding:5px 12px; font-size:12px; cursor:pointer; transition:all .15s; white-space:nowrap; }
.login-btn { color:#3fb950; border-color:#238636; }
.login-btn:hover { background:#238636; color:#fff; }
.user-name-btn { color:#58a6ff; border-color:#30363d; }
.user-name-btn:hover { background:#2d333b; }
.logout-link { color:#484f58; font-size:11px; cursor:pointer; text-decoration:none; padding:2px 6px; border-radius:3px; transition:all .15s; }
.logout-link:hover { color:#ef4444; background:rgba(239,68,68,0.1); }

/* 登录注册弹窗 */
.auth-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:10000; display:none; align-items:center; justify-content:center; }
.auth-overlay.show { display:flex; }
.auth-modal { background:#161b22; border:1px solid #30363d; border-radius:8px; width:340px; box-shadow:0 8px 32px rgba(0,0,0,0.5); }
.auth-header { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid #21262d; }
.auth-header h3 { margin:0; font-size:15px; color:#e6edf3; }
.auth-body { padding:16px; }
.auth-field { margin-bottom:12px; }
.auth-field label { display:block; font-size:12px; color:#8b949e; margin-bottom:4px; }
.auth-field input { width:100%; box-sizing:border-box; padding:8px 10px; background:#0d1117; border:1px solid #30363d; border-radius:4px; color:#e6edf3; font-size:13px; outline:none; }
.auth-field input:focus { border-color:#58a6ff; }
.auth-submit-btn { width:100%; padding:8px; background:#238636; border:none; border-radius:4px; color:#fff; font-size:13px; cursor:pointer; transition:background .15s; margin-top:4px; }
.auth-submit-btn:hover { background:#2ea043; }
.auth-submit-btn:disabled { background:#21262d; color:#484f58; cursor:not-allowed; }
.auth-switch { text-align:center; margin-top:12px; font-size:12px; color:#8b949e; }
.auth-switch a { color:#58a6ff; text-decoration:none; }
.auth-switch a:hover { text-decoration:underline; }

/* 股票池来源切换 */
.pool-source-tabs { display:flex; gap:2px; background:#0d1117; border:1px solid #30363d; border-radius:4px; padding:2px; margin-bottom:6px; }
.pool-tab { flex:1; text-align:center; padding:5px 4px; font-size:11px; color:#8b949e; border-radius:3px; cursor:pointer; transition:all .15s; user-select:none; }
.pool-tab:hover { color:#e6edf3; background:#1c2333; }
.pool-tab.active { background:#1f6feb; color:#fff; }
.pool-info { margin-top:4px; font-size:11px; color:#58a6ff; }
.price-range-row { display:flex; align-items:center; gap:6px; }
.price-range-sep { color:#484f58; font-size:14px; flex-shrink:0; }