/* TradeCPO NIOS Trending Topics History V1.1 */
#niosTrendsPanel{
  margin:16px 28px 96px;
  border:1px solid rgba(89,118,153,.30);
  background:linear-gradient(180deg,rgba(13,29,51,.96),rgba(6,15,28,.98));
  border-radius:8px;
  overflow:hidden;
  color:#d8e7ff;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
  box-shadow:0 18px 50px rgba(0,0,0,.18);
}

.nios-trends-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:16px 18px;
  border-bottom:1px solid rgba(89,118,153,.24);
  background:rgba(9,22,39,.68);
}

.nios-trends-head h3{
  margin:0;
  color:#00ff9d;
  font:900 13px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.28em;
}

.nios-trends-ranges{
  display:flex;
  gap:7px;
}

.nios-trends-ranges button{
  border:1px solid rgba(89,118,153,.38);
  background:#101b2d;
  color:#9aa8bd;
  border-radius:6px;
  padding:7px 12px;
  font:900 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  cursor:pointer;
}

.nios-trends-ranges button.active{
  border-color:#00ff9d;
  color:#00ff9d;
  background:rgba(0,255,157,.13);
}

.nios-trends-grid{
  display:grid;
  grid-template-columns:1fr;
}

.nios-current-state{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-bottom:1px solid rgba(89,118,153,.22);
}

.nt-card{
  padding:18px 20px;
  border-right:1px solid rgba(89,118,153,.18);
  min-width:0;
}

.nt-card:last-child{
  border-right:none;
}

.nt-card span{
  display:block;
  color:#9aa8bd;
  font:900 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;
  text-transform:uppercase;
  letter-spacing:.16em;
}

.nt-card b{
  display:block;
  margin-top:8px;
  color:#00ff9d;
  font:900 21px/1.12 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.04em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.nt-card small{
  display:block;
  margin-top:7px;
  color:#d8e7ff;
  font:800 10px/1.25 ui-monospace,SFMono-Regular,Menlo,monospace;
}

.nios-topic-chart{
  padding:18px 20px 10px;
}

.nt-chart-title{
  display:flex;
  justify-content:space-between;
  color:#d8e7ff;
  font:900 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin-bottom:10px;
}

.nt-chart-title small{
  color:#9aa8bd;
}

#ntChart{
  width:100%;
  height:280px;
  display:block;
  background:
    linear-gradient(rgba(89,118,153,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(89,118,153,.035) 1px, transparent 1px),
    rgba(6,17,30,.54);
  background-size:64px 48px;
  border:1px solid rgba(89,118,153,.18);
  border-radius:6px;
}

.nt-grid{
  stroke:rgba(89,118,153,.26);
  stroke-width:1;
}

.nt-axis{
  fill:#9aa8bd;
  font:800 11px ui-monospace,SFMono-Regular,Menlo,monospace;
}

.nt-legend{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  padding:11px 4px 0;
  color:#d8e7ff;
  font:900 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
}

.nt-legend span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.nt-legend i{
  width:9px;
  height:9px;
  border-radius:50%;
  display:inline-block;
}

.nios-topic-timeline{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:1px;
  background:rgba(89,118,153,.18);
  border-top:1px solid rgba(89,118,153,.22);
}

.nt-day{
  background:rgba(10,24,42,.98);
  padding:12px;
  min-height:74px;
}

.nt-day small{
  display:block;
  color:#9aa8bd;
  font:800 9px/1.25 ui-monospace,SFMono-Regular,Menlo,monospace;
}

.nt-day b{
  display:block;
  margin-top:8px;
  color:#00ff9d;
  font:900 12px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;
}

.nios-trends-insight{
  padding:14px 18px;
  border-top:1px solid rgba(89,118,153,.22);
  color:#d8e7ff;
  font:800 12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
}

.nios-trends-insight b{
  color:#00ff9d;
}

.nios-trends-insight .warn{
  color:#ffbd2e;
}

body:not(.tab-nios-active) #niosTrendsPanel{
  display:none;
}

@media(max-width:1000px){
  .nios-current-state{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nios-topic-timeline{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:620px){
  #niosTrendsPanel{margin:12px 12px 86px}
  .nios-trends-head{align-items:flex-start;flex-direction:column}
  .nios-current-state{grid-template-columns:1fr}
  .nios-topic-timeline{grid-template-columns:1fr}
}

/* NIOS Trending Topics History V1.2 — Light Mode Compatibility
   Scope: CSS only. No data/API/engine mutation. */

html[data-theme="light"] #niosTrendsPanel{
  background:linear-gradient(180deg,#fffdf8,#f7f0e5) !important;
  border-color:rgba(145,125,92,.34) !important;
  color:#263830 !important;
  box-shadow:0 14px 34px rgba(57,45,25,.07);
}

html[data-theme="light"] .nios-trends-head{
  background:#fffaf1 !important;
  border-color:rgba(145,125,92,.24) !important;
}

html[data-theme="light"] .nios-trends-head h3{
  color:#087d4e !important;
}

html[data-theme="light"] .nios-trends-ranges button{
  background:#f7efe2 !important;
  border-color:rgba(145,125,92,.32) !important;
  color:#5d6f66 !important;
}

html[data-theme="light"] .nios-trends-ranges button.active{
  background:rgba(8,125,78,.10) !important;
  border-color:rgba(8,125,78,.42) !important;
  color:#087d4e !important;
}

html[data-theme="light"] .nios-trends-grid,
html[data-theme="light"] .nios-topic-chart{
  background:
    linear-gradient(rgba(105,92,70,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(105,92,70,.045) 1px,transparent 1px),
    #fffaf1 !important;
  background-size:34px 34px !important;
  border-color:rgba(145,125,92,.24) !important;
}

html[data-theme="light"] .nios-current-state,
html[data-theme="light"] .nios-topic-timeline{
  background:#fffaf1 !important;
  border-color:rgba(145,125,92,.24) !important;
}

html[data-theme="light"] .nios-current-state span,
html[data-theme="light"] .nios-topic-chart span,
html[data-theme="light"] .nios-topic-timeline span,
html[data-theme="light"] .nios-trends-insight{
  color:#5d6f66 !important;
}

html[data-theme="light"] .nios-current-state b,
html[data-theme="light"] .nios-topic-timeline b,
html[data-theme="light"] .nios-trends-insight b{
  color:#087d4e !important;
}

html[data-theme="light"] .nios-current-state strong,
html[data-theme="light"] .nios-topic-chart strong,
html[data-theme="light"] .nios-topic-timeline strong{
  color:#14241b !important;
}

html[data-theme="light"] .nios-topic-card,
html[data-theme="light"] .nios-topic-timeline > div{
  background:#f7efe2 !important;
  border-color:rgba(145,125,92,.24) !important;
  color:#263830 !important;
}

html[data-theme="light"] .nios-trends-insight{
  background:linear-gradient(90deg,rgba(8,125,78,.10),rgba(255,253,248,.96)) !important;
  border-color:rgba(8,125,78,.24) !important;
  color:#263830 !important;
}

html[data-theme="light"] .nios-trends-insight .warn{
  color:#a46b00 !important;
}

html[data-theme="light"] #ntChart text,
html[data-theme="light"] #ntChart .nt-axis{
  fill:#5d6f66 !important;
}

html[data-theme="light"] #ntChart .nt-label,
html[data-theme="light"] #ntChart .nt-topic-label{
  fill:#263830 !important;
}

html[data-theme="light"] #ntChart .nt-grid{
  stroke:rgba(105,92,70,.16) !important;
}

html[data-theme="light"] #ntChart .nt-line-bg,
html[data-theme="light"] #ntChart .nt-rank-line-bg{
  stroke:rgba(67,84,76,.18) !important;
}

html[data-theme="light"] #ntChart .nt-point-bg{
  fill:#fffaf1 !important;
  stroke:rgba(67,84,76,.22) !important;
}

/* NIOS Trending Topics History V1.3 — Full Rank 1-10 Chart
   Purpose: show FX_RATES and other lower-ranked lenses without fake rank compression. */

.nios-topic-chart svg#ntChart{
  min-height:420px;
}

#ntChart{
  height:420px;
}

@media(max-width:900px){
  .nios-topic-chart svg#ntChart,
  #ntChart{
    height:390px;
    min-height:390px;
  }
}