.stock-board-trigger { cursor:pointer; }
.stock-board-link {
  appearance:none; padding:0; border:0; background:none;
  font-family:inherit; line-height:inherit; text-align:left; cursor:pointer;
}
.stock-board-link:hover { text-decoration:underline; text-underline-offset:3px; }

.stock-board-mask {
  position:fixed; inset:0; z-index:12000; display:none; padding:14px;
  background:rgba(25,39,55,.38); backdrop-filter:blur(5px);
}
.stock-board-mask.show { display:flex; align-items:center; justify-content:center; }
.stock-board-dialog {
  width:min(1380px,80vw); height:82vh; margin:0; overflow:hidden;
  border:1px solid #d7e0ea; border-radius:14px; background:#f8fafc;
  box-shadow:0 26px 70px rgba(15,35,55,.24); color:#24374c;
}
.stock-board-head {
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  min-height:58px; padding:10px 20px; border-bottom:1px solid #dde5ee; background:#fff;
}
.stock-board-title { display:flex; align-items:baseline; gap:10px; min-width:0; }
.stock-board-title strong { overflow:hidden; font-size:20px; font-weight:850; text-overflow:ellipsis; white-space:nowrap; }
.stock-board-title span { color:#738296; font-size:14px; font-variant-numeric:tabular-nums; }
.stock-board-close {
  width:38px; height:38px; border:0; border-radius:9px; background:transparent;
  color:#8491a0; font-size:28px; line-height:1; cursor:pointer;
}
.stock-board-close:hover { background:#eef3f8; color:#2f4359; }
.stock-board-body {
  display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:12px;
  height:calc(100% - 58px); padding:14px; overflow:auto;
}
.stock-board-charts { display:grid; grid-template-rows:minmax(350px,1.5fr) minmax(205px,.8fr); gap:10px; min-width:0; }
.stock-board-panel {
  position:relative; min-width:0; overflow:hidden; border:1px solid #d8e0e9;
  border-radius:11px; background:#fff; box-shadow:0 5px 16px rgba(27,50,76,.06);
}
.stock-board-panel-title {
  position:absolute; z-index:2; top:8px; left:50%; transform:translateX(-50%);
  color:#2f3d4d; font-size:17px; font-weight:850; white-space:nowrap;
}
.stock-board-partial { margin-left:8px; color:#d97706; font-size:11px; font-weight:750; }
.stock-board-kline { width:100%; height:100%; min-height:350px; }
.stock-board-intraday {
  display:flex; align-items:center; justify-content:center; height:100%; min-height:205px;
  background-color:#fff;
  background-image:linear-gradient(#e5ebf2 1px,transparent 1px),linear-gradient(90deg,#e5ebf2 1px,transparent 1px);
  background-size:12.5% 25%; background-position:70px 53px;
}
.stock-board-pending {
  padding:18px 26px; border:1px dashed #bfd0e2; border-radius:10px;
  background:rgba(248,251,255,.94); color:#75869a; text-align:center;
}
.stock-board-pending strong { display:block; margin-bottom:5px; color:#405a75; font-size:16px; }
.stock-board-pending span { font-size:13px; }
.stock-board-aside {
  align-self:start; max-height:100%; overflow-y:auto; padding:11px 12px 13px; border:1px solid #dde5ed; border-radius:11px;
  background:#fff; box-shadow:0 5px 16px rgba(27,50,76,.05);
}
.stock-board-aside h3 {
  margin:0 0 8px; padding-left:9px; border-left:4px solid #e32736;
  color:#28394c; font-size:16px; font-weight:850;
}
.stock-board-aside h4 {
  margin:9px 0 2px; padding:0 0 5px; border-bottom:1px solid #dfe7ef;
  color:#48617a; font-size:13px; font-weight:850;
}
.stock-board-metrics { display:grid; grid-template-columns:1fr 1fr; gap:0 18px; }
.stock-board-auction-metrics { gap:0 12px; }
.stock-board-metric {
  display:flex; justify-content:space-between; gap:8px; padding:6px 0;
  border-bottom:1px dashed #e2e8ef; font-size:12px;
}
.stock-board-metric span { color:#687b90; white-space:nowrap; }
.stock-board-metric b { color:#2c3e52; font-weight:780; text-align:right; font-variant-numeric:tabular-nums; }
.stock-board-metric b.up { color:#e33c49; }
.stock-board-metric b.down { color:#15966a; }
.stock-board-metric b.pending { color:#9aa7b5; font-weight:650; }
.stock-board-industry { grid-column:1/-1; }
.stock-board-footnote { margin:9px 0 0; color:#8b98a8; font-size:10px; line-height:1.45; }
.stock-board-loading,.stock-board-error {
  grid-column:1/-1; display:flex; align-items:center; justify-content:center; min-height:420px;
  color:#76869a; font-size:15px;
}
.stock-board-error { color:#b54752; }
body.stock-board-open { overflow:hidden; }

@media(max-width:980px) {
  .stock-board-mask { padding:0; }
  .stock-board-dialog { width:100%; height:100vh; border-radius:0; }
  .stock-board-body { grid-template-columns:1fr; }
  .stock-board-aside { order:-1; }
  .stock-board-charts { grid-template-rows:430px 230px; }
  .stock-board-kline { min-height:430px; }
}
@media(min-width:981px) and (max-height:760px) {
  .stock-board-dialog { height:88vh; }
  .stock-board-charts { grid-template-rows:minmax(310px,1.45fr) minmax(175px,.75fr); }
  .stock-board-kline { min-height:310px; }
  .stock-board-intraday { min-height:175px; }
}
@media(max-width:620px) {
  .stock-board-head { padding-inline:12px; }
  .stock-board-title { display:block; }
  .stock-board-title strong { display:block; font-size:17px; }
  .stock-board-title span { display:block; margin-top:3px; font-size:12px; }
  .stock-board-body { padding:8px; }
  .stock-board-metrics { grid-template-columns:1fr; }
  .stock-board-industry { grid-column:auto; }
}
