/* ===== A股监控看板 共享样式 (common.css) =====
   由 site/index.html(云端) 与 dashboard.html(本地) 共用，消除两份内联 <style> 副本 */
:root{
  --up:#d92e2e; --dn:#0a8f4e; --flat:#666;
  --bg:#f5f6f8; --card:#ffffff; --ink:#1c2330; --sub:#6b7486;
  --line:#e4e7ec; --warn:#b7791f; --danger:#c0392b; --ok:#1e7e4d;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Microsoft YaHei",-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);padding:16px 18px 40px}
header{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:14px}
h1{font-size:20px}
h1 .tag{font-size:11px;color:#fff;background:#2b5aed;border-radius:4px;padding:2px 7px;vertical-align:3px;margin-left:8px}
#updated{font-size:12px;color:var(--sub)}
.phase{font-size:12px;padding:2px 10px;border-radius:10px;background:#eef1f6;color:var(--sub)}
.phase.trading{background:#fdeaea;color:var(--up)}
.top{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px;margin-bottom:12px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;box-shadow:0 1px 3px rgba(20,30,50,.04)}
.panel h3{font-size:13px;color:var(--sub);font-weight:600;margin-bottom:8px}
.market-card{cursor:pointer;transition:box-shadow .15s,border-color .15s}
.market-card:hover{box-shadow:0 2px 10px rgba(20,30,50,.10);border-color:#2b5aed}
.market-mini{min-height:110px;margin-top:6px}
.market-mini-wrap{display:flex;gap:10px;height:100%}
.idx-mini{flex:1;min-width:0;display:flex;flex-direction:column;background:#f7f8fa;border-radius:10px;padding:8px 10px}
.idx-mini .im-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.idx-mini .im-name{font-size:12px;font-weight:700;color:var(--ink)}
.idx-mini .im-pct{font-size:14px;font-weight:800}
.idx-mini .im-chart{flex:1;min-height:0}
.market-legend{font-size:11px;color:var(--sub);display:flex;gap:12px;margin-top:4px;flex-wrap:wrap}
.market-legend span{display:flex;align-items:center;gap:4px}
.dot-line{width:16px;height:3px;border-radius:2px}
.gate-big{font-size:26px;font-weight:700}
.gate-sub{font-size:12px;color:var(--sub);margin-top:4px;line-height:1.7}
.amt-num{font-size:26px;font-weight:700}
.amt-bar{height:8px;border-radius:4px;background:#eef1f6;margin:8px 0 4px;position:relative;overflow:hidden}
.amt-fill{height:100%;border-radius:4px}
.amt-ticks{display:flex;justify-content:space-between;font-size:11px;color:var(--sub)}
.idx-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.idx{font-size:12px;background:#f4f6fa;border-radius:6px;padding:4px 9px}
.idx b{margin-left:5px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.stock{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;position:relative}
.stock.alert-triggered{border:2px solid var(--danger);animation:pulse 1.2s infinite}
.stock.alert-near{border:2px solid var(--warn)}
.stock.deny{opacity:.82}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(192,57,43,.35)}50%{box-shadow:0 0 0 7px rgba(192,57,43,0)}}
.s-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.s-name{font-size:16px;font-weight:700}
.s-code{font-size:11px;color:var(--sub);margin-left:6px}
.stance{font-size:11px;border-radius:8px;padding:2px 8px;white-space:nowrap}
.stance.ok{background:#e8f4ec;color:var(--ok)}
.stance.watch{background:#fdf3e3;color:var(--warn)}
.stance.deny{background:#fdeaea;color:var(--danger)}
.s-price-row{display:flex;align-items:baseline;gap:10px;margin:8px 0 4px}
.s-price{font-size:26px;font-weight:800}
.s-chg{font-size:15px;font-weight:700}
.s-meta{font-size:11px;color:var(--sub);margin-bottom:9px}
.lines{border-top:1px dashed var(--line);padding-top:8px;display:flex;flex-direction:column;gap:5px}
.ln{display:flex;align-items:center;gap:7px;font-size:12px}
.dot{width:8px;height:8px;border-radius:50%;flex:none}
.dot.triggered{background:var(--danger)}
.dot.near{background:var(--warn)}
.dot.watch{background:#c6ccd8}
.ln .lbl{color:var(--ink);font-weight:600;min-width:64px}
.ln .lp{color:var(--sub)}
.ln .dist{margin-left:auto;font-weight:700}
.ln .act{color:var(--sub);font-size:11px}
.spark{margin-top:8px;border-top:1px dashed var(--line);padding-top:7px}
.stock{cursor:pointer;transition:box-shadow .15s}
.stock:hover{box-shadow:0 2px 10px rgba(20,30,50,.10)}
.stock.sel{border-color:#2b5aed;box-shadow:0 0 0 2px rgba(43,90,237,.18)}
/* 弹层: 点击卡片放大查看详细信息 + 趋势图 */
#overlay{position:fixed;inset:0;background:rgba(20,28,44,.5);display:none;align-items:flex-start;justify-content:center;z-index:1000;padding:22px;overflow-y:auto}
#overlay.show{display:flex}
#modal{background:#fff;border-radius:14px;max-width:820px;width:100%;margin:auto;padding:16px 20px 22px;box-shadow:0 14px 44px rgba(0,0,0,.28)}
#modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
#m-title{font-size:18px;font-weight:800}
#m-close{cursor:pointer;font-size:26px;color:#98a1b3;line-height:1;padding:0 6px}
#m-close:hover{color:#333}
#m-detail{display:grid;grid-template-columns:repeat(auto-fit,minmax(116px,1fr));gap:8px 14px;background:#f7f8fa;border-radius:10px;padding:12px 14px;margin-bottom:10px}
.m-item{font-size:12px;color:#6b7486}
.m-item b{display:block;font-size:16px;color:#1c2330;font-weight:700;margin-top:2px}
#m-tabs{display:flex;gap:6px;margin-bottom:8px}
.tab{font-size:13px;padding:5px 14px;border-radius:8px;cursor:pointer;background:#eef1f6;color:#6b7486}
.tab.active{background:#2b5aed;color:#fff}
#m-chart{width:100%}
#m-lines{margin-top:10px}
#m-lines .lh{font-size:12px;color:#6b7486;margin-bottom:6px}
h2{font-size:15px;margin:22px 0 10px}
#triggers{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 16px;max-height:260px;overflow-y:auto}
#triggers div{font-size:12.5px;padding:5px 0;border-bottom:1px dashed var(--line);color:#7a2717}
#triggers div:first-child{font-weight:700}
.empty{color:var(--sub);font-size:12px;padding:4px 0}
footer{margin-top:18px;font-size:11px;color:var(--sub);line-height:1.8}
.up{color:var(--up)}.dn{color:var(--dn)}.flat{color:var(--flat)}
#conn{font-size:11px;color:var(--warn)}