/* ═══════════════════════════════════════════════════════════════════
   NOIRVAULTS — styles.css v9.0
   Extends noir-system.css with legacy/override rules.
   noir-system.css must be loaded first in each HTML page.
   ═══════════════════════════════════════════════════════════════════ */

/* noir-system.css is linked directly in each HTML page */
/* This file: legacy aliases and per-page micro-overrides */

/* ── Page default: full height ──────────────────────────────────── */
/* Keep `html` at a definite 100% (so descendant % heights resolve), but let
   `body` grow past the viewport via min-height — matches noir-system.css and
   keeps the long content pages that load this file (access, data-lab) scrollable. */
html { height: 100%; }
body { min-height: 100%; }
body {
  background: #030406;
  color: #F5F7FA;
  font-family: 'Inter', -apple-system, sans-serif;
}

/* ── Legacy color aliases (for old component JS) ─────────────────── */
:root {
  --violet:  #8B5CF6;
  --accent:  #8B5CF6;
  --surface: #06080D;
  --surface2: #0B0E14;
  --pos:     #2EE6A6;
  --neg:     #FF4D5E;
}

/* ── Old container class ─────────────────────────────────────────── */
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.nr-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* ── Old button classes ──────────────────────────────────────────── */
.btn, .nr-btn { display: inline-flex; align-items: center; justify-content: center; padding: 10px 20px; border-radius: 4px; font-family: 'JetBrains Mono', monospace; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; cursor: pointer; text-decoration: none; border: none; transition: all 140ms; }
.btn-primary, .nr-btn-primary { background: #D89A3A; color: #000; }
.btn-primary:hover, .nr-btn-primary:hover { background: #C28A3E; }
.btn-outline, .nr-btn-ghost, .btn-ghost { background: transparent; color: #7B8293; border: 1px solid rgba(255,255,255,.08); }
.btn-outline:hover, .nr-btn-ghost:hover { border-color: rgba(216,154,58,.28); color: #B0B8CC; }

/* ── Old badge ───────────────────────────────────────────────────── */
.badge { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 20px; font-family: 'JetBrains Mono', monospace; font-size: .56rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; background: rgba(216,154,58,.12); color: #D89A3A; border: 1px solid rgba(216,154,58,.22); }

/* ── Old card styles ─────────────────────────────────────────────── */
.card { background: #06080D; border: 1px solid rgba(255,255,255,.045); border-radius: 6px; padding: 20px; }
.card-icon { font-size: 1.2rem; color: #D89A3A; margin-bottom: 10px; }

/* ── Old grid helpers ────────────────────────────────────────────── */
.dash-grid { display: grid; gap: 12px; }
.dash-grid-2 { grid-template-columns: repeat(2, 1fr); }
.dash-grid-3 { grid-template-columns: repeat(3, 1fr); }
.dash-grid-4 { grid-template-columns: repeat(4, 1fr); }

/* ── Section headings ────────────────────────────────────────────── */
.section-sm { padding: 40px 0; }
.section-label { font-family: 'JetBrains Mono', monospace; font-size: .56rem; text-transform: uppercase; letter-spacing: .2em; color: #D89A3A; display: block; margin-bottom: 8px; }
.section-title { font-size: 1.6rem; font-weight: 700; color: #F5F7FA; margin-bottom: 10px; }
.section-desc { color: #7B8293; max-width: 480px; }

/* ── Reveal animation ────────────────────────────────────────────── */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .5s ease, transform .5s ease; }
.reveal.visible { opacity: 1; transform: none; }

/* ── Old NR panel aliases ────────────────────────────────────────── */
.nr-panel     { background: #06080D; border: 1px solid rgba(255,255,255,.045); display: flex; flex-direction: column; }
.nr-panel-hdr { height: 34px; display: flex; align-items: center; gap: 8px; padding: 0 12px; background: #0B0E14; border-bottom: 1px solid rgba(255,255,255,.025); flex-shrink: 0; }
.nr-panel-title { font-family: 'JetBrains Mono', monospace; font-size: .56rem; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: #D89A3A; }
.nr-panel-body  { flex: 1; overflow: hidden; }
.nr-panel-scroll { flex: 1; overflow-y: auto; }

/* ── Wl row (old workspace JS) ───────────────────────────────────── */
.nr-wl-row { display: flex; align-items: center; gap: 8px; padding: 6px 12px; cursor: pointer; border-bottom: 1px solid rgba(255,255,255,.025); }
.nr-wl-row:hover { background: rgba(255,255,255,.03); }
.nr-wl-row.active { background: rgba(216,154,58,.08); }
.nr-wl-sym { font-family: 'JetBrains Mono', monospace; font-size: .72rem; font-weight: 700; color: #F5F7FA; min-width: 64px; }
.nr-wl-price { font-family: 'JetBrains Mono', monospace; font-size: .64rem; color: #B0B8CC; flex: 1; text-align: right; }
.nr-wl-chg { font-family: 'JetBrains Mono', monospace; font-size: .6rem; font-weight: 700; min-width: 56px; text-align: right; }
.nr-wl-chg.pos { color: #2EE6A6; }
.nr-wl-chg.neg { color: #FF4D5E; }

/* ── Old sym trigger ─────────────────────────────────────────────── */
.nr-sym-trigger { display: flex; align-items: center; gap: 8px; padding: 5px 12px; background: #0D1018; border: 1px solid rgba(216,154,58,.10); border-radius: 6px; cursor: pointer; min-width: 196px; transition: border-color .18s; }
.nr-sym-trigger:hover { border-color: rgba(216,154,58,.40); }
.nr-sym-name { font-family: 'JetBrains Mono', monospace; font-size: .82rem; font-weight: 700; color: #F5F7FA; }
.nr-sym-icon { color: #D89A3A; }

/* ── Old tf button ───────────────────────────────────────────────── */
.nr-tf-btn, .tf-btn { padding: 4px 8px; font-family: 'JetBrains Mono', monospace; font-size: .6rem; font-weight: 600; letter-spacing: .04em; background: transparent; border: 1px solid transparent; border-radius: 3px; color: #7B8293; cursor: pointer; transition: all 120ms; text-transform: uppercase; }
.nr-tf-btn.active, .tf-btn.active { color: #D89A3A; background: rgba(216,154,58,.10); border-color: rgba(216,154,58,.22); }
.nr-tf-btn:hover, .tf-btn:hover { color: #B0B8CC; }

/* ── Score/Matrix (old) ──────────────────────────────────────────── */
.nr-score-num { font-family: 'JetBrains Mono', monospace; font-size: 3rem; font-weight: 800; letter-spacing: -.04em; color: #7B8293; line-height: 1; }
.nr-score-num.bull { color: #2EE6A6; }
.nr-score-num.bear { color: #FF4D5E; }
.nr-score-num.neut { color: #D89A3A; }
.nr-bias-tag { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 3px; font-family: 'JetBrains Mono', monospace; font-size: .6rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.nr-bias-tag.bull { background: rgba(46,230,166,.12); color: #2EE6A6; }
.nr-bias-tag.bear { background: rgba(255,77,94,.12); color: #FF4D5E; }
.nr-bias-tag.neut { background: rgba(216,154,58,.12); color: #D89A3A; }

/* ── Status dot ──────────────────────────────────────────────────── */
.nr-status-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.nr-status-dot.live { background: #2EE6A6; animation: pulse 2.5s ease-in-out infinite; }
.nr-status-dot.delayed { background: #D89A3A; }
.nr-status-dot.offline { background: #4A5168; }

/* ── Old picker modal ────────────────────────────────────────────── */
.nr-picker { position: fixed; inset: 0; z-index: 9999; background: rgba(3,4,6,.88); backdrop-filter: blur(16px); display: none; align-items: flex-start; justify-content: center; padding-top: 60px; }
.nr-picker.open { display: flex; }
.nr-picker-box { background: #0B0E14; border: 1px solid rgba(216,154,58,.22); border-radius: 8px; width: 100%; max-width: 560px; max-height: 70vh; display: flex; flex-direction: column; box-shadow: 0 40px 100px rgba(0,0,0,.9); }

/* ── Market heatmap tiles ────────────────────────────────────────── */
.nv-hm-tile { aspect-ratio: 1.4; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 3px; cursor: pointer; transition: filter 120ms, transform 120ms; padding: 4px; }
.nv-hm-tile:hover { filter: brightness(1.15); transform: scale(1.02); }
.nv-hm-sym { font-family: 'JetBrains Mono', monospace; font-size: .6rem; font-weight: 700; color: rgba(255,255,255,.9); }
.nv-hm-chg { font-family: 'JetBrains Mono', monospace; font-size: .72rem; font-weight: 700; color: #fff; }

/* ── GL container reset ──────────────────────────────────────────── */
.lm_goldenlayout { background: #030406; }
.lm_header { background: #06080D !important; }
.lm_tab { background: #0B0E14 !important; color: #7B8293 !important; font-family: 'JetBrains Mono', monospace !important; font-size: .58rem !important; text-transform: uppercase; letter-spacing: .06em; border: none !important; }
.lm_tab.lm_active { color: #D89A3A !important; border-bottom: 2px solid #D89A3A !important; }
.lm_content { background: #030406 !important; }

/* ── Research page ───────────────────────────────────────────────── */
.nv-research-grid { display: grid; grid-template-columns: 280px 1fr; height: 100%; overflow: hidden; }
.nv-research-list { border-right: 1px solid rgba(255,255,255,.04); overflow-y: auto; background: #06080D; }
.nv-research-body { overflow-y: auto; padding: 20px 24px; }

/* ── Scrollbar for landing pages (overflow:auto) ─────────────────── */
.nv-landing ::-webkit-scrollbar { width: 3px; }