:root {
  --bg: #07111f;
  --panel: #0d1a2b;
  --panel2: #10243a;
  --line: #20354d;
  --text: #edf6ff;
  --muted: #8297ad;
  --cyan: #2ee6c5;
  --red: #ff5578;
  --amber: #ffbe55;
  --shadow: 0 18px 50px #0005;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background:
    radial-gradient(circle at 70% -20%, #113e54 0, transparent 38%), var(--bg);
  color: var(--text);
  font-family: Inter, "Microsoft YaHei", sans-serif;
}
.shell {
  max-width: 1480px;
  margin: auto;
  padding: 28px;
}
.topbar,
.panel-head,
.live-wrap,
footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.industry-history-panel{margin-top:16px}.industry-history-head{align-items:flex-end}.industry-filters{display:flex;gap:10px;flex-wrap:wrap}.industry-filters label{display:grid;gap:5px;color:var(--muted);font-size:11px}.industry-filters select{min-width:130px;background:#091523;border:1px solid var(--line);color:var(--text);padding:9px 30px 9px 10px;border-radius:8px}.industry-data-note{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0;color:var(--muted);font-size:12px}.industry-data-note span{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#091523}.basis-badge,.industry-data-note b{display:inline-block;padding:3px 7px;border-radius:999px;font-size:11px}.basis-real{background:#123f35;color:#62e6bd}.basis-proxy{background:#293549;color:#a8bad3}.basis-forecast{background:#3a2c10;color:#ffd166}.method-note{display:block;max-width:170px;margin-top:7px;color:var(--muted);white-space:normal;line-height:1.45}.industry-history-table td{vertical-align:top;text-align:left}.industry-history-table th{text-align:left}.industry-history-wrap{max-height:760px}.industry-tags{display:grid;gap:5px;min-width:165px}.industry-tag{display:flex;justify-content:space-between;gap:10px;padding:5px 7px;border-radius:6px;font-size:12px}.industry-tag small{font-size:10px;white-space:nowrap}.industry-tag.strong{background:rgba(40,199,155,.1);color:#79e8c6}.industry-tag.weak{background:rgba(255,92,116,.1);color:#ff9aaa}.industry-empty{color:var(--muted);font-size:11px}.industry-history-table tbody tr:first-child{background:rgba(255,209,102,.035)}
.eyebrow {
  margin: 0 0 6px;
  color: var(--cyan);
  font-size: 12px;
  letter-spacing: 0.18em;
}
.version-badge {
  display: inline-block;
  margin: 0 0 8px;
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--amber);
  background: #0c1b2c;
  font-size: 11px;
  line-height: 1.2;
}
h1 {
  margin: 0;
  font-size: 30px;
  font-weight: 600;
}
h2 {
  margin: 0 0 6px;
  font-size: 17px;
}
p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}
.live-wrap {
  justify-content: flex-end;
  color: var(--muted);
  font-size: 13px;
}
.live-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--amber);
  box-shadow: 0 0 14px currentColor;
}
.live-dot.ok {
  background: var(--cyan);
}
.live-dot.error {
  background: var(--red);
}
button,
input {
  font: inherit;
}
.live-wrap button,
.tab {
  border: 1px solid var(--line);
  background: #0c1b2c;
  color: var(--text);
  border-radius: 8px;
  padding: 8px 12px;
  cursor: pointer;
}
.index-strip {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1px;
  margin: 28px 0;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.index-item {
  background: #0a1727;
  padding: 15px;
}
.index-item span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}
.index-item strong {
  display: inline-block;
  margin: 7px 8px 0 0;
  font-size: 18px;
}
.up {
  color: var(--red) !important;
}
.down {
  color: var(--cyan) !important;
}
.kpis {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.kpi,
.panel {
  background: linear-gradient(145deg, #0e1c2e, #0a1625);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
}
.kpi {
  padding: 22px;
}
.kpi span,
.kpi small {
  display: block;
  color: var(--muted);
  font-size: 12px;
}
.kpi strong {
  display: block;
  margin: 10px 0 6px;
  font-size: 30px;
}
.kpi.emphasis {
  background: linear-gradient(135deg, #123548, #0c2034);
}
.grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.panel {
  padding: 20px;
  min-width: 0;
}
.panel-head {
  margin-bottom: 20px;
}
.tabs {
  display: flex;
  gap: 6px;
}
.tab.active {
  background: var(--text);
  color: #08121f;
}
.bar-chart {
  display: flex;
  flex-direction: column;
  gap: 11px;
  min-height: 360px;
}
.bar-row {
  display: grid;
  grid-template-columns: 100px 1fr 92px;
  gap: 12px;
  align-items: center;
  font-size: 13px;
}
.bar-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bar-track {
  height: 18px;
  background: #13243a;
  border-radius: 4px;
  overflow: hidden;
}
.bar-fill {
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg, #198b85, var(--cyan));
  transition: width 0.5s;
}
.bar-fill.out {
  background: linear-gradient(90deg, #92354a, var(--red));
}
.bar-value {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.structure {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.structure-item {
  padding-bottom: 17px;
  border-bottom: 1px solid var(--line);
}
.structure-item:last-child {
  border: 0;
}
.structure-label {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  margin-bottom: 9px;
}
.meter {
  height: 8px;
  background: #14263c;
  border-radius: 5px;
  overflow: hidden;
}
.meter i {
  display: block;
  height: 100%;
  background: var(--cyan);
  border-radius: 5px;
}
.meter i.negative {
  background: var(--red);
}
.table-panel {
  padding-bottom: 12px;
}
.panel-head input {
  width: 210px;
  background: #091523;
  border: 1px solid var(--line);
  color: var(--text);
  padding: 9px 12px;
  border-radius: 8px;
  outline: none;
}
.table-wrap {
  overflow: auto;
}
table {
  border-collapse: collapse;
  width: 100%;
  font-size: 13px;
}
th,
td {
  padding: 13px 12px;
  border-bottom: 1px solid #172a40;
  text-align: right;
  white-space: nowrap;
}
th {
  color: var(--muted);
  font-weight: 500;
  cursor: pointer;
}
th:first-child,
td:first-child {
  text-align: left;
}
tbody tr:hover {
  background: #102238;
}
footer {
  color: var(--muted);
  font-size: 12px;
  padding: 18px 2px 0;
}
@media (max-width: 900px) {
  .index-strip {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid {
    grid-template-columns: 1fr;
  }
  .kpis {
    grid-template-columns: 1fr 1fr;
  }
  .kpi.emphasis {
    grid-column: 1/-1;
  }
}
@media (max-width: 560px) {
  .shell {
    padding: 16px;
  }
  .topbar,
  .panel-head,
  footer {
    align-items: flex-start;
    flex-direction: column;
  }
  .live-wrap {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .index-strip {
    grid-template-columns: repeat(2, 1fr);
  }
  .kpis {
    grid-template-columns: 1fr;
  }
  .kpi.emphasis {
    grid-column: auto;
  }
  .bar-row {
    grid-template-columns: 72px 1fr 76px;
  }
  .panel-head input {
    width: 100%;
  }
  .industry-filters{width:100%}.industry-filters label{flex:1}.industry-filters select{width:100%;min-width:0}.industry-history-wrap{max-height:640px}
}
