/* ============================================================
   MASTER VORTEX — News flow view styles.
   Pairs with news.js (view: #newsView). Tokens match styles.css /
   screener.css (--green, --panel, --edge, --dim...).

   The .view-tabs / .view-tab rules below mirror screener.css so
   the tab bar renders correctly on shells that load news.css
   without screener.css. Where both files load, the later file
   wins per-property — so .view-tab.active below MUST stay
   identical to screener.css (solid green background + near-black
   #03140a text). They once diverged: this file set
   color:var(--green) while screener.css supplied the green
   background, giving invisible green-on-green tab text.
   ============================================================ */
.view-tabs{display:flex;gap:6px;align-items:center}
.view-tab{font:inherit;font-size:12px;font-weight:400;letter-spacing:.5px;color:var(--dim);
  background:var(--panel-2);border:1px solid var(--edge);border-radius:999px;
  padding:6px 16px;cursor:pointer}
.view-tab:hover{color:var(--ink);border-color:#3a4d6b}
.view-tab.active{background:var(--green); color:#03140a; border-color:var(--green);
  box-shadow:0 0 14px rgba(30,227,8,.45);}

/* When the News view is open it owns the workspace: the chart grid
   (which holds the ticker canvas) steps aside. */
body.mv-news-open .main{display:none}
body.mv-news-open .tf-group{visibility:hidden}

.nws-view{flex:1; min-height:0; display:flex; flex-direction:column;
  background:var(--panel); margin:10px; border:1px solid var(--edge); border-radius:14px;
  overflow:hidden}
.nws-view[hidden]{display:none}

.nws-head{display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:12px 16px; border-bottom:1px solid var(--edge); background:var(--panel-2)}
.nws-title{font-size:15px; font-weight:400; letter-spacing:1.5px; color:var(--ink)}
.nws-controls{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-left:auto}
.nws-modes{display:flex; gap:0; border:1px solid var(--edge); border-radius:10px; overflow:hidden}
.nws-mode{font:inherit; font-size:12px; font-weight:400; letter-spacing:.4px;
  background:transparent; color:var(--dim); border:0; padding:7px 14px; cursor:pointer}
.nws-mode + .nws-mode{border-left:1px solid var(--edge)}
.nws-mode:hover{color:var(--ink)}
.nws-mode.active{background:#17351c; color:var(--green)}
.nws-refresh{font:inherit; font-size:12px; font-weight:400; letter-spacing:.4px;
  background:var(--panel); color:var(--ink); border:1px solid var(--edge);
  border-radius:10px; padding:7px 14px; cursor:pointer}
.nws-refresh:hover{border-color:var(--green); color:var(--green)}
.nws-refresh:disabled{opacity:.5; cursor:default}
.nws-status{font-size:12px; color:var(--dim); font-weight:400}
.nws-status.err{color:var(--red)}

.nws-list-wrap{flex:1; min-height:0; overflow-y:auto; position:relative}
.nws-list{max-width:880px; margin:0 auto; padding:6px 20px 20px}

.nws-item{padding:14px 2px 12px; border-bottom:1px solid rgba(120,150,190,.12)}
.nws-meta{display:flex; align-items:center; gap:7px; font-size:11.5px; font-weight:400;
  letter-spacing:.3px; margin-bottom:5px}
.nws-time{color:var(--green)}
.nws-src{color:var(--dim); text-transform:uppercase}
.nws-dot{color:#3a4d6b}
.nws-headline{display:block; font-size:16px; font-weight:400; line-height:1.35;
  color:var(--ink); text-decoration:none}
.nws-headline:hover{color:var(--green); text-decoration:underline}
.nws-headline:visited{color:#9db4cf}
.nws-sum{margin:6px 0 0; font-size:13.5px; line-height:1.5; color:#c6d6ea;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.nws-chips{display:flex; gap:6px; flex-wrap:wrap; margin-top:8px}
.nws-chip{font:inherit; font-size:11px; font-weight:400; letter-spacing:.4px;
  color:var(--dim); background:rgba(120,150,190,.08); border:1px solid var(--edge);
  border-radius:999px; padding:3px 10px; cursor:pointer}
.nws-chip:hover{color:var(--green); border-color:var(--green)}

.nws-divider{display:flex; align-items:center; gap:12px; margin:20px 0 4px;
  color:var(--dim); font-size:11px; font-weight:400; letter-spacing:1.5px}
.nws-divider::before,.nws-divider::after{content:''; flex:1; height:1px;
  background:rgba(120,150,190,.18)}

.nws-empty{padding:60px 20px; text-align:center; color:var(--dim);
  font-size:14px; font-weight:400}
.nws-empty[hidden]{display:none}

/* News by watchlist (2026-11-04): the dedicated view swaps the
   SYMBOL/MARKET scope switch for a pill per list under the head;
   the active pill is the list whose stories fill the feed. In-list
   symbol chips read green — they are why the story is here. */
.nws-pills{display:flex; gap:6px; flex-wrap:wrap; padding:10px 16px 2px}
.nws-pills[hidden]{display:none}
.nws-pill{font:inherit; font-size:12px; font-weight:400; letter-spacing:.4px;
  color:var(--dim); background:var(--panel-2); border:1px solid var(--edge);
  border-radius:999px; padding:5px 13px; cursor:pointer}
.nws-pill:hover{color:var(--ink); border-color:#3a4d6b}
.nws-pill.active{background:#17351c; color:var(--green); border-color:var(--green)}
.nws-view.wl-mode .nws-modes{display:none}
.nws-date{color:var(--dim)}
.nws-chip.inlist{color:var(--green); border-color:rgba(38,194,129,.55)}

@media (max-width:900px){
  .nws-view{margin:0; border-radius:0; border-left:0; border-right:0}
  .nws-title{display:none}
  .nws-controls{margin-left:0}
  .nws-list{padding:4px 14px 16px}
  .nws-headline{font-size:15px}
}