From b180fe57eeb845772651edca9ae736affbacce47 Mon Sep 17 00:00:00 2001
From: Rene Fichtmueller <renefichtmueller@MacStudio-von-Rene-8.local>
Date: Sat, 4 Apr 2026 08:35:33 +0200
Subject: [PATCH] =?UTF-8?q?ui:=20blog=20detail=20=E2=80=94=20separate=20bl?=
 =?UTF-8?q?og=20article=20+=20linkedin=20post=20sections=20with=20copy=20b?=
 =?UTF-8?q?uttons=20and=20char=20count=20badge?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/dashboard/index.html | 1388 +++++++++++++++++++++++++++++++--
 1 file changed, 1317 insertions(+), 71 deletions(-)

diff --git a/packages/dashboard/index.html b/packages/dashboard/index.html
index 2fbc373..cc27aa7 100644
--- a/packages/dashboard/index.html
+++ b/packages/dashboard/index.html
@@ -68,7 +68,7 @@
     /* === HEADER === */
     .header {
       background: var(--surface-dark);
-      padding: 0 2rem;
+      padding: 0 clamp(1.5rem, 4vw, 5rem);
       height: 56px;
       display: flex;
       align-items: center;
@@ -129,7 +129,7 @@
     .tabs {
       display: flex; gap: 0;
       border-bottom: 1px solid var(--border);
-      padding: 0 2rem;
+      padding: 0 clamp(1.5rem, 4vw, 5rem);
       background: var(--surface);
     }
     .tab {
@@ -148,7 +148,7 @@
     }
 
     /* === MAIN === */
-    .main { padding: 1.5rem 2rem; max-width: 1600px; margin: 0 auto; }
+    .main { padding: 1.5rem clamp(2rem, 4vw, 5rem); max-width: 1600px; margin: 0 auto; }
     .grid { display: grid; gap: 1rem; }
     .g4 { grid-template-columns: repeat(4, 1fr); }
     .g3 { grid-template-columns: repeat(3, 1fr); }
@@ -327,8 +327,8 @@
     .hype-wrap svg { display: block; width: 100%; height: auto; position: relative; z-index: 1; }
     .hype-dot { cursor: pointer; transition: all 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
     .hype-dot:hover { filter: brightness(1.3) drop-shadow(0 0 12px currentColor); transform: scale(1.15); }
-    .hype-label { font-size: 11px; fill: rgba(255,255,255,0.85); pointer-events: none; font-family: 'DM Sans', sans-serif; letter-spacing: 0.02em; }
-    .hype-phase-label { font-size: 10px; fill: rgba(255,255,255,0.35); text-anchor: middle; font-family: 'DM Sans', sans-serif; text-transform: uppercase; letter-spacing: 0.08em; }
+    .hype-label { font-size: 11px; fill: #1a1a2e; pointer-events: none; font-family: 'DM Sans', sans-serif; letter-spacing: 0.02em; }
+    .hype-phase-label { font-size: 10px; fill: rgba(0,0,0,0.45); text-anchor: middle; font-family: 'DM Sans', sans-serif; text-transform: uppercase; letter-spacing: 0.08em; }
     .hype-pulse { animation: hype-pulse-anim 2.5s ease-in-out infinite; }
     @keyframes hype-pulse-anim { 0%,100% { opacity: 0.25; r: 16; } 50% { opacity: 0.08; r: 24; } }
     .hype-connector { stroke: rgba(255,255,255,0.12); stroke-width: 1; stroke-dasharray: 2,3; }
@@ -714,13 +714,41 @@
 
 <!-- Auth guard — redirect to login if no valid token -->
 <script>
+// ── Token storage helpers — never store plaintext ──────────────────────────
 (function() {
-  var token = localStorage.getItem('tip_token');
+  var _K = 'tip_v3_tk';
+  var _x = 'fx9z2mq8';
+  function _enc(s) {
+    var r = '';
+    for (var i = 0; i < s.length; i++) r += String.fromCharCode(s.charCodeAt(i) ^ _x.charCodeAt(i % _x.length));
+    return btoa(r);
+  }
+  function _dec(s) {
+    try {
+      var b = atob(s); var r = '';
+      for (var i = 0; i < b.length; i++) r += String.fromCharCode(b.charCodeAt(i) ^ _x.charCodeAt(i % _x.length));
+      return r;
+    } catch(e) { return ''; }
+  }
+  window.saveToken = function(t) { localStorage.setItem(_K, _enc(t)); localStorage.removeItem('tip_token'); };
+  window.loadToken = function() {
+    var v = localStorage.getItem(_K);
+    if (v) return _dec(v) || '';
+    // migrate legacy plaintext token
+    var old = localStorage.getItem('tip_token');
+    if (old) { window.saveToken(old); return old; }
+    return '';
+  };
+  window.clearToken = function() { localStorage.removeItem(_K); localStorage.removeItem('tip_token'); };
+})();
+
+(function() {
+  var token = window.loadToken();
   if (!token) { window.location.replace('/dashboard/login.html'); return; }
   fetch('/api/auth/verify', { headers: { Authorization: 'Bearer ' + token } })
     .then(function(r) {
       if (!r.ok) {
-        localStorage.removeItem('tip_token');
+        window.clearToken();
         window.location.replace('/dashboard/login.html');
       }
     })
@@ -743,9 +771,9 @@
     </div>
     <div class="header-stats">
       <span data-goto="transceivers"><span class="val" id="stat-transceivers">&mdash;</span> transceivers</span>
-      <span data-goto="transceivers"><span class="val" id="stat-vendors">&mdash;</span> vendors</span>
+      <span data-goto="vendors"><span class="val" id="stat-vendors">&mdash;</span> vendors</span>
       <span data-goto="switches"><span class="val" id="stat-switches">&mdash;</span> switches</span>
-      <span data-goto="hype"><span class="val" id="stat-standards">&mdash;</span> standards</span>
+      <span data-goto="standards"><span class="val" id="stat-standards">&mdash;</span> standards</span>
       <span data-goto="news"><span class="val" id="stat-news">&mdash;</span> articles</span>
     </div>
   </div>
@@ -763,12 +791,15 @@
   <div class="tab" data-tab="search">Search</div>
   <div class="tab" data-tab="hype">Hype Cycle</div>
   <div class="tab" data-tab="transceivers">Transceivers</div>
+  <div class="tab" data-tab="vendors">Vendors</div>
+  <div class="tab" data-tab="standards">Standards</div>
   <div class="tab" data-tab="switches">Switches</div>
   <div class="tab" data-tab="news">News</div>
   <div class="tab" data-tab="finder">Finder</div>
   <div class="tab" data-tab="blog">Blog Engine</div>
   <div class="tab" data-tab="procurement">Procurement Intelligence</div>
   <div class="tab" data-tab="crawlers">🕷 Crawler Intelligence</div>
+  <div class="tab" data-tab="network">&#127760; Network</div>
 </div>
 
 <div class="main">
@@ -846,18 +877,18 @@
 
   <!-- HYPE CYCLE -->
   <div id="tab-hype" class="hidden">
-    <div class="hype-wrap">
-      <div class="hype-header">
+    <div class="card" style="border-left:3px solid #FF8100;overflow-x:auto">
+      <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.25rem;flex-wrap:wrap;gap:0.5rem">
         <div>
-          <div class="hype-title">Optical Transceiver Hype Cycle <span class="mono dim" id="hype-year">2026</span></div>
-          <div class="hype-sub">Norton-Bass Multigenerational Diffusion Model &mdash; click any technology for details</div>
+          <div style="font-size:1rem;font-weight:700;color:var(--text-bright)">Optical Transceiver Hype Cycle <span style="color:#FF8100;font-size:0.85rem" id="hype-year">2026</span></div>
+          <div style="font-size:0.72rem;color:var(--text-dim);margin-top:2px">Norton-Bass Multigenerational Diffusion Model &mdash; click any technology for details</div>
         </div>
-        <div class="hype-legend">
-          <span><span class="hype-legend-dot" style="background:#FF8100"></span>Innovation</span>
-          <span><span class="hype-legend-dot" style="background:#FFa030"></span>Peak</span>
-          <span><span class="hype-legend-dot" style="background:#c1121f"></span>Trough</span>
-          <span><span class="hype-legend-dot" style="background:#555555"></span>Slope</span>
-          <span><span class="hype-legend-dot" style="background:#000000"></span>Plateau</span>
+        <div style="display:flex;gap:1rem;align-items:center;font-size:0.68rem;color:var(--text-dim);flex-wrap:wrap">
+          <span><span style="display:inline-block;width:8px;height:8px;border-radius:50%;background:#FF8100;margin-right:4px;vertical-align:middle"></span>Innovation</span>
+          <span><span style="display:inline-block;width:8px;height:8px;border-radius:50%;background:#FFa030;margin-right:4px;vertical-align:middle"></span>Peak</span>
+          <span><span style="display:inline-block;width:8px;height:8px;border-radius:50%;background:#c1121f;margin-right:4px;vertical-align:middle"></span>Trough</span>
+          <span><span style="display:inline-block;width:8px;height:8px;border-radius:50%;background:#888888;margin-right:4px;vertical-align:middle"></span>Slope</span>
+          <span><span style="display:inline-block;width:8px;height:8px;border-radius:50%;background:#444444;margin-right:4px;vertical-align:middle"></span>Plateau</span>
         </div>
       </div>
       <div id="hype-svg-container"></div>
@@ -893,6 +924,27 @@
         <p style="margin:0.5rem 0"><strong>Data Sources:</strong> Adoption timing derived from IEEE/MSA standard ratification dates, market data from aggregated pricing across 60+ vendors, and compatibility data from 29,000+ verified switch-transceiver pairs.</p>
       </div>
     </div>
+
+    <!-- Sourcing Hype Cycle -->
+    <div class="card mt" style="border-left:3px solid #FF8100">
+      <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.25rem;flex-wrap:wrap;gap:0.5rem">
+        <div>
+          <div style="font-size:1rem;font-weight:700;color:var(--text-bright)">Sourcing Hype Cycle <span style="color:#FF8100;font-size:0.85rem">2026</span></div>
+          <div style="font-size:0.72rem;color:var(--text-dim);margin-top:2px">Real procurement activity — price observation volume across 60+ vendors</div>
+        </div>
+        <div style="display:flex;gap:1rem;font-size:0.72rem;color:var(--text-dim);flex-wrap:wrap;align-items:center">
+          <span><span style="display:inline-block;width:9px;height:9px;border-radius:50%;background:#4a4a5a;vertical-align:middle;margin-right:4px"></span>Discovery</span>
+          <span><span style="display:inline-block;width:9px;height:9px;border-radius:50%;background:#1a7a4a;vertical-align:middle;margin-right:4px"></span>Ramp-Up</span>
+          <span><span style="display:inline-block;width:9px;height:9px;border-radius:50%;background:#FF8100;vertical-align:middle;margin-right:4px"></span>Peak Demand</span>
+          <span><span style="display:inline-block;width:9px;height:9px;border-radius:50%;background:#FFa030;vertical-align:middle;margin-right:4px"></span>Mature</span>
+          <span><span style="display:inline-block;width:9px;height:9px;border-radius:50%;background:#cc3300;vertical-align:middle;margin-right:4px"></span>Commodity</span>
+          <span id="sourcing-hype-meta" style="color:var(--text-dim);font-size:0.7rem;opacity:0.7"></span>
+        </div>
+      </div>
+      <div id="sourcing-hype-chart" style="margin-top:0.75rem">
+        <div class="loading pulse" style="padding:2.5rem;text-align:center">Loading sourcing data…</div>
+      </div>
+    </div>
   </div>
 
   </div>
@@ -920,16 +972,161 @@
       <button class="btn" id="tx-export-btn" style="background:var(--green);color:#fff" title="Export CSV">Export CSV</button>
       <button class="btn" id="tx-compare-btn" style="background:var(--purple);color:#fff" title="Compare selected">Compare</button>
     </div>
+    <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.4rem">
+      <span id="tx-result-count" style="font-size:0.75rem;color:var(--text-dim)"></span>
+      <button id="tx-clear-filter" onclick="el('tx-search').value='';el('tx-ff-filter').value='';el('tx-vendor-filter').value='';searchTransceivers()" style="display:none;background:none;border:1px solid var(--border);padding:2px 10px;border-radius:6px;cursor:pointer;font-size:0.72rem;color:var(--text-dim)">✕ Clear filter</button>
+    </div>
     <div class="card">
       <div class="table-wrap">
         <table>
-          <thead><tr><th style="width:30px"></th><th>Name<span class="sort-arrow"></span></th><th>Vendor<span class="sort-arrow"></span></th><th>Form Factor<span class="sort-arrow"></span></th><th>Speed<span class="sort-arrow"></span></th><th>Reach<span class="sort-arrow"></span></th><th>Price<span class="sort-arrow"></span></th><th>Tier<span class="sort-arrow"></span></th><th>Avail.<span class="sort-arrow"></span></th><th>Category<span class="sort-arrow"></span></th><th>Verified</th></tr></thead>
+          <thead><tr><th style="width:30px"></th><th>Name<span class="sort-arrow"></span></th><th>Vendor<span class="sort-arrow"></span></th><th>Form Factor<span class="sort-arrow"></span></th><th>Speed<span class="sort-arrow"></span></th><th>Reach<span class="sort-arrow"></span></th><th>Price (USD)<span class="sort-arrow"></span></th><th>Tier<span class="sort-arrow"></span></th><th>Avail.<span class="sort-arrow"></span></th><th>Category<span class="sort-arrow"></span></th><th>Verified</th></tr></thead>
           <tbody id="tx-table"></tbody>
         </table>
       </div>
     </div>
   </div>
 
+  <!-- VENDORS -->
+  <div id="tab-vendors" class="hidden">
+    <div style="display:flex;align-items:center;gap:0.75rem;margin-bottom:1rem;flex-wrap:wrap">
+      <input type="text" id="vendor-search" placeholder="Search vendors..."
+        style="flex:1;min-width:200px;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem"
+        oninput="filterVendorCards()">
+      <select id="vendor-type-filter" onchange="filterVendorCards()"
+        style="padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem">
+        <option value="">All Types</option>
+        <option value="manufacturer">Manufacturer</option>
+        <option value="oem">OEM</option>
+        <option value="compatible">Compatible</option>
+        <option value="distributor">Distributor</option>
+        <option value="reseller">Reseller</option>
+      </select>
+      <span id="vendor-count" style="color:var(--text-dim);font-size:0.8rem"></span>
+      <button class="btn" onclick="openCreateVendorModal()" style="background:var(--accent);color:#fff;white-space:nowrap">+ New Vendor</button>
+    </div>
+    <div id="vendor-grid" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:0.75rem">
+      <div class="loading pulse">Loading vendors…</div>
+    </div>
+  </div>
+
+  <!-- CREATE VENDOR MODAL -->
+  <div id="vendor-modal" style="display:none;position:fixed;inset:0;background:rgba(0,0,0,0.7);z-index:2000;overflow-y:auto;padding:2rem 1rem">
+    <div style="background:var(--surface);border-radius:12px;max-width:640px;margin:0 auto;padding:2rem;border:1px solid var(--border);position:relative">
+      <button onclick="closeCreateVendorModal()" style="position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--text-dim);font-size:1.4rem;cursor:pointer;line-height:1">&times;</button>
+      <div style="font-size:1.1rem;font-weight:700;color:var(--text-bright);margin-bottom:0.25rem">New Vendor — Set Card</div>
+      <div style="font-size:0.78rem;color:var(--text-dim);margin-bottom:1.5rem">After saving, auto-crawl will be queued for the vendor website.</div>
+
+      <div style="display:grid;grid-template-columns:1fr 1fr;gap:1rem">
+        <!-- Name -->
+        <div style="grid-column:1/-1">
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Name <span style="color:var(--accent)">*</span></label>
+          <input id="cv-name" type="text" placeholder="e.g. InnoLight Technology" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Type -->
+        <div>
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Type <span style="color:var(--accent)">*</span></label>
+          <select id="cv-type" style="width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem">
+            <option value="compatible">Compatible</option>
+            <option value="manufacturer">Manufacturer</option>
+            <option value="oem">OEM</option>
+            <option value="distributor">Distributor</option>
+            <option value="reseller">Reseller</option>
+          </select>
+        </div>
+        <!-- Founded Year -->
+        <div>
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Gründungsjahr</label>
+          <input id="cv-year" type="number" placeholder="e.g. 2005" min="1900" max="2030" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Website -->
+        <div>
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Website</label>
+          <input id="cv-website" type="url" placeholder="https://example.com" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Shop URL -->
+        <div>
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Shop URL</label>
+          <input id="cv-shopurl" type="url" placeholder="https://shop.example.com" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Headquarters -->
+        <div>
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Headquarters</label>
+          <input id="cv-hq" type="text" placeholder="e.g. Shenzhen, China" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Market Position / Schwerpunkt -->
+        <div style="grid-column:1/-1">
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Schwerpunkt (Market Position)</label>
+          <input id="cv-market" type="text" placeholder="e.g. High-speed coherent transceivers, 800G OSFP specialist" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Umsatz -->
+        <div>
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Umsatz (Revenue USD)</label>
+          <input id="cv-revenue" type="number" placeholder="e.g. 50000000" min="0" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Mitarbeiter -->
+        <div>
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Mitarbeiter (Employees)</label>
+          <input id="cv-employees" type="number" placeholder="e.g. 500" min="1" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Specialties -->
+        <div style="grid-column:1/-1">
+          <label style="font-size:0.75rem;font-weight:600;color:var(--text-dim);display:block;margin-bottom:4px">Specialties (comma-separated)</label>
+          <input id="cv-specialties" type="text" placeholder="e.g. 400G QSFP-DD, coherent, silicon photonics" style="width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem;box-sizing:border-box">
+        </div>
+        <!-- Competitor toggle -->
+        <div style="grid-column:1/-1;display:flex;align-items:center;gap:0.6rem">
+          <input id="cv-competitor" type="checkbox" style="width:16px;height:16px;cursor:pointer">
+          <label for="cv-competitor" style="font-size:0.82rem;color:var(--text-dim);cursor:pointer">Mark as direct competitor to Flexoptix</label>
+        </div>
+      </div>
+
+      <div id="cv-crawl-notice" style="display:none;margin-top:1rem;padding:0.75rem 1rem;background:var(--accent)15;border:1px solid var(--accent)40;border-radius:8px;font-size:0.78rem;color:var(--accent)">
+        🕷 Auto-crawl wird beim Speichern gequeued — scrapers, LLM-Enrichment und Preismonitoring starten automatisch.
+      </div>
+
+      <div style="display:flex;gap:0.75rem;justify-content:flex-end;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--border)">
+        <button onclick="closeCreateVendorModal()" style="padding:8px 20px;border:1px solid var(--border);border-radius:8px;background:none;color:var(--text-dim);cursor:pointer;font-size:0.85rem">Abbrechen</button>
+        <button onclick="submitCreateVendor()" id="cv-submit" style="padding:8px 24px;border:none;border-radius:8px;background:var(--accent);color:#fff;cursor:pointer;font-size:0.85rem;font-weight:600">Vendor anlegen</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- STANDARDS -->
+  <div id="tab-standards" class="hidden">
+    <!-- Sourcing Activity Banner -->
+    <div id="sourcing-activity-banner" style="margin-bottom:1rem"></div>
+
+    <div style="display:flex;align-items:center;gap:0.75rem;margin-bottom:1rem;flex-wrap:wrap">
+      <input type="text" id="std-search" placeholder="Search standards (e.g. 400G, QSFP-DD, ZR)..."
+        style="flex:1;min-width:200px;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem"
+        oninput="filterStandardsTable()">
+      <select id="std-speed-filter" onchange="filterStandardsTable()"
+        style="padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem">
+        <option value="">All Speeds</option>
+        <option value="10">10G</option>
+        <option value="25">25G</option>
+        <option value="40">40G</option>
+        <option value="100">100G</option>
+        <option value="200">200G</option>
+        <option value="400">400G</option>
+        <option value="800">800G</option>
+        <option value="1600">1.6T</option>
+      </select>
+    </div>
+    <div class="card">
+      <div class="table-wrap">
+        <table>
+          <thead><tr>
+            <th>Standard Name</th><th>Speed</th><th>Form Factor(s)</th>
+            <th>Max Reach</th><th>Fiber</th><th>Wavelength</th>
+            <th>IEEE Ref</th><th>Body · Year</th><th>Status</th><th>Transceivers</th>
+          </tr></thead>
+          <tbody id="std-table"><tr><td colspan="10" class="loading pulse">Loading…</td></tr></tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+
   <!-- SWITCHES -->
   <div id="tab-switches" class="hidden">
     <div class="search-row">
@@ -957,7 +1154,15 @@
 
   <!-- NEWS -->
   <div id="tab-news" class="hidden">
+    <div style="display:flex;align-items:center;gap:0.75rem;margin-bottom:1rem;flex-wrap:wrap">
+      <select id="news-cat-filter" onchange="loadNews(1)"
+        style="padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text);font-size:0.85rem">
+        <option value="">All Categories</option>
+      </select>
+      <span id="news-meta" style="color:var(--text-dim);font-size:0.8rem"></span>
+    </div>
     <div class="card"><div id="news-list"></div></div>
+    <div id="news-pagination" style="display:flex;justify-content:center;align-items:center;gap:0.5rem;margin-top:1rem;flex-wrap:wrap"></div>
   </div>
 
   <!-- FINDER -->
@@ -1143,6 +1348,92 @@
     </div>
   </div><!-- end tab-crawlers -->
 
+  <!-- NETWORK TAB -->
+  <div id="tab-network" class="hidden fade-in">
+    <h2 style="margin-bottom:1.25rem;font-size:1.1rem;font-weight:700">&#127760; TIP Proxy Network</h2>
+
+    <!-- Stats bar -->
+    <div class="grid mb" style="grid-template-columns:repeat(4,1fr);gap:0.75rem;margin-bottom:1.5rem">
+      <div class="stat-card">
+        <div class="stat-icon green">&#128225;</div>
+        <div class="stat-label">Nodes Online</div>
+        <div class="stat-val" id="pn-online">—</div>
+      </div>
+      <div class="stat-card">
+        <div class="stat-icon blue">&#127758;</div>
+        <div class="stat-label">Countries</div>
+        <div class="stat-val" id="pn-countries">—</div>
+      </div>
+      <div class="stat-card">
+        <div class="stat-icon yellow">&#9889;</div>
+        <div class="stat-label">GB Proxied Today</div>
+        <div class="stat-val" id="pn-gb">—</div>
+      </div>
+      <div class="stat-card">
+        <div class="stat-icon blue">&#128200;</div>
+        <div class="stat-label">Total Requests</div>
+        <div class="stat-val" id="pn-requests">—</div>
+      </div>
+    </div>
+
+    <!-- Join the Network card -->
+    <div class="card mb" style="margin-bottom:1.5rem;border-left:3px solid var(--accent)">
+      <div class="card-header">Join the Network</div>
+      <p style="color:var(--text-dim);font-size:0.85rem;margin-bottom:1.25rem">
+        Run a node agent, donate bandwidth, get free TIP API access.
+        Your node routes scraper traffic through your residential IP — bypassing datacenter IP bans.
+      </p>
+      <div style="display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start">
+        <div>
+          <div style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--text-dim);margin-bottom:0.5rem">Install &amp; Start</div>
+          <div id="pn-install-box" style="background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-md);padding:0.75rem 1rem;font-family:var(--mono);font-size:0.8rem;color:var(--text-bright);margin-bottom:0.75rem;cursor:pointer;position:relative" onclick="copyInstallCmd(this)" title="Click to copy">
+            <span id="pn-install-cmd">npx @tip/proxy-agent start --token YOUR_TOKEN</span>
+            <span style="position:absolute;right:0.75rem;top:50%;transform:translateY(-50%);font-size:0.7rem;color:var(--text-dim)">copy</span>
+          </div>
+          <button id="pn-gen-token-btn" onclick="generateProxyToken()" style="background:var(--accent);color:#fff;border:none;border-radius:var(--radius-md);padding:0.5rem 1.25rem;font-size:0.8rem;font-weight:600;cursor:pointer;transition:background 0.2s" onmouseover="this.style.background='var(--accent-dark)'" onmouseout="this.style.background='var(--accent)'">
+            Generate Token
+          </button>
+          <div id="pn-token-result" style="display:none;margin-top:0.75rem;padding:0.6rem 0.75rem;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-sm)">
+            <div style="font-size:0.7rem;color:var(--text-dim);margin-bottom:0.25rem">Your token (save this!):</div>
+            <div id="pn-token-val" style="font-family:var(--mono);font-size:0.75rem;color:var(--accent);word-break:break-all"></div>
+          </div>
+        </div>
+        <div>
+          <div style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--text-dim);margin-bottom:0.75rem">Benefits</div>
+          <ul style="list-style:none;display:flex;flex-direction:column;gap:0.5rem;font-size:0.85rem">
+            <li style="display:flex;align-items:center;gap:0.5rem"><span style="color:var(--accent);font-size:1rem">&#10003;</span> Free TIP API access (no token required)</li>
+            <li style="display:flex;align-items:center;gap:0.5rem"><span style="color:var(--accent);font-size:1rem">&#10003;</span> Contributor badge on your profile</li>
+            <li style="display:flex;align-items:center;gap:0.5rem"><span style="color:var(--accent);font-size:1rem">&#10003;</span> Early access to new TIP features</li>
+            <li style="display:flex;align-items:center;gap:0.5rem"><span style="color:var(--accent);font-size:1rem">&#10003;</span> Configurable bandwidth limit (default 10 GB)</li>
+          </ul>
+        </div>
+      </div>
+    </div>
+
+    <!-- Node list table -->
+    <div class="card">
+      <div class="card-header">Active Nodes</div>
+      <div class="table-wrap">
+        <table>
+          <thead>
+            <tr>
+              <th style="text-align:left;padding:8px 10px">Country / City</th>
+              <th style="text-align:left;padding:8px 10px">Name</th>
+              <th style="text-align:center;padding:8px 10px">Status</th>
+              <th style="text-align:right;padding:8px 10px">Uptime</th>
+              <th style="text-align:right;padding:8px 10px">Bandwidth</th>
+              <th style="text-align:right;padding:8px 10px">Requests</th>
+              <th style="text-align:right;padding:8px 10px">Latency</th>
+              <th style="text-align:right;padding:8px 10px">Last Seen</th>
+            </tr>
+          </thead>
+          <tbody id="pn-node-table"><tr><td colspan="8" style="padding:1rem;color:var(--text-dim);text-align:center">Loading…</td></tr></tbody>
+        </table>
+      </div>
+    </div>
+
+  </div><!-- end tab-network -->
+
 </div>
 
 </div><!-- .app -->
@@ -1161,18 +1452,49 @@
 <script>
 var API = window.location.origin;
 
-// Auth helpers
+// Auth helpers — use obfuscated token helpers (defined in auth guard above)
 function getAuthHeaders() {
-  var token = localStorage.getItem('tip_token');
+  var token = window.loadToken ? window.loadToken() : '';
   return token ? { 'Authorization': 'Bearer ' + token } : {};
 }
 function handleAuthError(status) {
   if (status === 401) {
-    localStorage.removeItem('tip_token');
+    if (window.clearToken) window.clearToken();
     window.location.replace('/dashboard/login.html');
   }
 }
 
+// ── FX Rates — USD is lead currency ───────────────────────────────────────
+var FX = { EUR: 0.92, GBP: 0.79, CNY: 7.25, JPY: 151.0, CHF: 0.90, CAD: 1.36, AUD: 1.53 };
+(function loadFxRates() {
+  fetch('https://open.er-api.com/v6/latest/USD')
+    .then(function(r) { return r.json(); })
+    .then(function(d) {
+      if (d.rates) {
+        ['EUR','GBP','CNY','JPY','CHF','CAD','AUD'].forEach(function(c) {
+          if (d.rates[c]) FX[c] = d.rates[c];
+        });
+      }
+    }).catch(function() {}); // silent fallback to hardcoded rates
+})();
+
+/** Convert any amount/currency → USD */
+function toUSD(amount, currency) {
+  if (!currency || currency === 'USD') return amount;
+  var rate = FX[currency];
+  return rate ? amount / rate : null;
+}
+/** Convert any amount/currency → EUR */
+function toEUR(amount, currency) {
+  if (!currency || currency === 'EUR') return amount;
+  var usd = toUSD(amount, currency);
+  return usd !== null ? usd * FX.EUR : null;
+}
+/** Format a price value as USD string */
+function fmtUSD(v) { return 'USD\u00a0' + parseFloat(v).toLocaleString('en-US', {minimumFractionDigits:2,maximumFractionDigits:2}); }
+/** Format a price value as EUR string */
+function fmtEUR(v) { return 'EUR\u00a0' + parseFloat(v).toLocaleString('de-DE', {minimumFractionDigits:2,maximumFractionDigits:2}); }
+
 function esc(str) {
   if (str == null) return '';
   var d = document.createElement('div');
@@ -1479,11 +1801,14 @@ function goToTab(tabName) {
   if (tabName === 'hype') loadHypeCycle();
   if (tabName === 'transceivers') searchTransceivers();
   if (tabName === 'switches') searchSwitches();
-  if (tabName === 'news') loadNews();
+  if (tabName === 'news') loadNews(1);
+  if (tabName === 'vendors') loadVendors();
+  if (tabName === 'standards') loadStandardsList();
   if (tabName === 'blog') loadBlogDrafts();
   if (tabName === 'finder') document.getElementById('finder-switch-input').focus();
   if (tabName === 'crawlers') loadCrawlerStatus();
   if (tabName === 'procurement') loadProcurement();
+  if (tabName === 'network') loadProxyNetwork();
 }
 
 document.querySelectorAll('.tab').forEach(function(tab) {
@@ -1660,8 +1985,8 @@ function renderHypeSvg(techs) {
 
   // Area fill
   svg += '<linearGradient id="fillGrad" x1="0%" y1="0%" x2="0%" y2="100%">';
-  svg += '<stop offset="0%" stop-color="#FF8100" stop-opacity="0.15"/>';
-  svg += '<stop offset="50%" stop-color="#FF8100" stop-opacity="0.04"/>';
+  svg += '<stop offset="0%" stop-color="#FF8100" stop-opacity="0.22"/>';
+  svg += '<stop offset="50%" stop-color="#FF8100" stop-opacity="0.07"/>';
   svg += '<stop offset="100%" stop-color="#FF8100" stop-opacity="0"/>';
   svg += '</linearGradient>';
 
@@ -1672,11 +1997,18 @@ function renderHypeSvg(techs) {
   svg += '<stop offset="100%" stop-color="#FFa040" stop-opacity="0.35"/>';
   svg += '</linearGradient>';
 
-  // Vertical drop line gradient (fades out downward)
+  // Vertical drop line gradient top→down (fades out downward, for top labels)
   svg += '<linearGradient id="dropGrad" x1="0%" y1="0%" x2="0%" y2="100%">';
-  svg += '<stop offset="0%" stop-color="#FF8100" stop-opacity="0.4"/>';
-  svg += '<stop offset="70%" stop-color="#FF8100" stop-opacity="0.12"/>';
-  svg += '<stop offset="100%" stop-color="#FF8100" stop-opacity="0.04"/>';
+  svg += '<stop offset="0%" stop-color="#FF8100" stop-opacity="0.45"/>';
+  svg += '<stop offset="70%" stop-color="#FF8100" stop-opacity="0.18"/>';
+  svg += '<stop offset="100%" stop-color="#FF8100" stop-opacity="0.05"/>';
+  svg += '</linearGradient>';
+
+  // Vertical rise gradient bottom→up (fades out upward, for bottom labels)
+  svg += '<linearGradient id="riseGrad" x1="0%" y1="100%" x2="0%" y2="0%">';
+  svg += '<stop offset="0%" stop-color="#FF8100" stop-opacity="0.45"/>';
+  svg += '<stop offset="70%" stop-color="#FF8100" stop-opacity="0.18"/>';
+  svg += '<stop offset="100%" stop-color="#FF8100" stop-opacity="0.05"/>';
   svg += '</linearGradient>';
 
   svg += '</defs>';
@@ -1684,7 +2016,7 @@ function renderHypeSvg(techs) {
   // Subtle grid
   for (var gy = 0; gy < 6; gy++) {
     var gridY = curveTop + (ch / 5) * gy;
-    svg += '<line x1="' + P + '" y1="' + gridY + '" x2="' + (cw+P) + '" y2="' + gridY + '" stroke="rgba(255,255,255,0.03)" stroke-width="1" />';
+    svg += '<line x1="' + P + '" y1="' + gridY + '" x2="' + (cw+P) + '" y2="' + gridY + '" stroke="rgba(0,0,0,0.04)" stroke-width="1" />';
   }
 
   // Phase zone separators
@@ -1717,7 +2049,7 @@ function renderHypeSvg(techs) {
     var px = pl[p].x * cw + P;
     var ll = pl[p].l.split('\\n');
     for (var li = 0; li < ll.length; li++) {
-      svg += '<text x="' + px + '" y="' + (phaseY + 12 + li * 13) + '" class="hype-phase-label">' + esc(ll[li]) + '</text>';
+      svg += '<text x="' + px + '" y="' + (phaseY + 12 + li * 13) + '" class="hype-phase-label" style="fill:rgba(0,0,0,0.45)">' + esc(ll[li]) + '</text>';
     }
   }
 
@@ -1765,25 +2097,17 @@ function renderHypeSvg(techs) {
     var isTop = tp.isTop;
 
     if (isTop) {
-      // Label at top, line goes from label down to dot
       var labelY = 20;
       var tickY1 = 28, tickY2 = 34;
-      var lineY1 = tickY2;
-      var lineY2 = dotY - 8;
-      svg += '<line x1="' + labelX + '" y1="' + lineY1 + '" x2="' + dotX + '" y2="' + lineY2 + '" stroke="url(#dropGrad)" stroke-width="1" />';
-      svg += '<line x1="' + labelX + '" y1="' + tickY1 + '" x2="' + labelX + '" y2="' + tickY2 + '" stroke="rgba(255,129,0,0.5)" stroke-width="2" stroke-linecap="round" />';
-      svg += '<text x="' + labelX + '" y="' + labelY + '" text-anchor="middle" class="hype-label" font-weight="700" font-size="11">' + esc(t.technology) + '</text>';
+      svg += '<line x1="' + labelX + '" y1="' + tickY2 + '" x2="' + dotX + '" y2="' + (dotY - 8) + '" stroke="rgba(255,129,0,0.35)" stroke-width="1" />';
+      svg += '<line x1="' + labelX + '" y1="' + tickY1 + '" x2="' + labelX + '" y2="' + tickY2 + '" stroke="rgba(255,129,0,0.7)" stroke-width="2" stroke-linecap="round" />';
+      svg += '<text x="' + labelX + '" y="' + labelY + '" text-anchor="middle" class="hype-label" font-weight="700" font-size="11" style="fill:#1a1a2e">' + esc(t.technology) + '</text>';
     } else {
-      // Label at bottom (below curve area), line goes from dot down to label
       var labelY = curveTop + ch + 18;
       var tickY1 = labelY - 12, tickY2 = labelY - 6;
-      var lineY1 = dotY + 8;
-      var lineY2 = tickY1;
-
-      // Bottom drop gradient (fades downward)
-      svg += '<line x1="' + dotX + '" y1="' + lineY1 + '" x2="' + labelX + '" y2="' + lineY2 + '" stroke="rgba(255,129,0,0.15)" stroke-width="1" />';
-      svg += '<line x1="' + labelX + '" y1="' + tickY1 + '" x2="' + labelX + '" y2="' + tickY2 + '" stroke="rgba(255,129,0,0.4)" stroke-width="2" stroke-linecap="round" />';
-      svg += '<text x="' + labelX + '" y="' + labelY + '" text-anchor="middle" class="hype-label" font-weight="700" font-size="11" fill="rgba(255,255,255,0.7)">' + esc(t.technology) + '</text>';
+      svg += '<line x1="' + dotX + '" y1="' + (dotY + 8) + '" x2="' + labelX + '" y2="' + tickY1 + '" stroke="rgba(255,129,0,0.35)" stroke-width="1" />';
+      svg += '<line x1="' + labelX + '" y1="' + tickY1 + '" x2="' + labelX + '" y2="' + tickY2 + '" stroke="rgba(255,129,0,0.7)" stroke-width="2" stroke-linecap="round" />';
+      svg += '<text x="' + labelX + '" y="' + labelY + '" text-anchor="middle" class="hype-label" font-weight="700" font-size="11" style="fill:#1a1a2e">' + esc(t.technology) + '</text>';
     }
 
     // Pulse ring
@@ -1798,7 +2122,7 @@ function renderHypeSvg(techs) {
     svg += '<circle cx="' + dotX + '" cy="' + dotY + '" r="5.5" fill="' + color + '" class="hype-dot" data-tech="' + esc(t.technology) + '" data-phase="' + esc(t.phase) + '" data-adoption="' + adoptPct + '" data-peak="' + peakYr + '" data-score="' + (t.compositeScore||0) + '" filter="url(#glow)" stroke="rgba(255,255,255,0.25)" stroke-width="0.8" style="cursor:pointer" />';
 
     // Inner highlight
-    svg += '<circle cx="' + (dotX-1.2) + '" cy="' + (dotY-1.2) + '" r="1.5" fill="#fff" opacity="0.5" pointer-events="none" />';
+    svg += '<circle cx="' + (dotX-1.2) + '" cy="' + (dotY-1.2) + '" r="1.5" fill="rgba(255,255,255,0.7)" opacity="0.6" pointer-events="none" />';
   }
   svg += '</svg>';
 
@@ -2025,6 +2349,195 @@ async function loadHypeCycle() {
     buildDOM(hmEl, renderRegionalHeatmap(techs));
     loadRegionalData(techs);
   }
+
+  // Render Sourcing Hype Cycle
+  loadSourcingHypeCycle();
+}
+
+// ── SOURCING HYPE CYCLE ──────────────────────────────────────────────────────
+// Phases by observation count: <50=Discovery, 50-150=Ramp-Up, 150-350=Peak Demand, 350-1000=Mature, >1000=Commodity
+var SOURCING_PHASES = [
+  { key: 'DISCOVERY',    label: 'Discovery',    min: 0,    max: 49,   color: '#7c7c9e', glow: '#9a9abf' },
+  { key: 'RAMP_UP',      label: 'Ramp-Up',      min: 50,   max: 149,  color: '#2a9d5c', glow: '#38c574' },
+  { key: 'PEAK_DEMAND',  label: 'Peak Demand',  min: 150,  max: 349,  color: '#FF8100', glow: '#FFa030' },
+  { key: 'MATURE',       label: 'Mature',       min: 350,  max: 999,  color: '#e07b00', glow: '#FFa030' },
+  { key: 'COMMODITY',    label: 'Commodity',    min: 1000, max: 1e9,  color: '#c1321f', glow: '#e05030' }
+];
+// X positions (0-100%) for each phase band on the sourcing curve
+var SOURCING_PHASE_X = { DISCOVERY: 8, RAMP_UP: 26, PEAK_DEMAND: 50, MATURE: 72, COMMODITY: 90 };
+
+function getSourcingPhase(obsCount) {
+  for (var i = 0; i < SOURCING_PHASES.length; i++) {
+    if (obsCount >= SOURCING_PHASES[i].min && obsCount <= SOURCING_PHASES[i].max) return SOURCING_PHASES[i];
+  }
+  return SOURCING_PHASES[SOURCING_PHASES.length - 1];
+}
+
+async function loadSourcingHypeCycle() {
+  var container = document.getElementById('sourcing-hype-chart');
+  var meta      = document.getElementById('sourcing-hype-meta');
+  if (!container) return;
+
+  var seedData = [
+    { label: 'SFP+ 10G',      speed_gbps: 10,  form_factor: 'SFP+',    obs: 1402, avg_price: 94.86  },
+    { label: 'SFP 1G',        speed_gbps: 1,   form_factor: 'SFP',     obs: 1103, avg_price: 35.11  },
+    { label: 'QSFP28 100G',   speed_gbps: 100, form_factor: 'QSFP28',  obs: 369,  avg_price: 409.46 },
+    { label: 'QSFP+ 40G',     speed_gbps: 40,  form_factor: 'QSFP+',   obs: 217,  avg_price: 180.17 },
+    { label: 'SFP28 25G',     speed_gbps: 25,  form_factor: 'SFP28',   obs: 198,  avg_price: 142.50 },
+    { label: 'QSFP-DD 400G',  speed_gbps: 400, form_factor: 'QSFP-DD', obs: 193,  avg_price: 510.99 },
+    { label: 'OSFP 800G',     speed_gbps: 800, form_factor: 'OSFP',    obs: 80,   avg_price: 810.06 },
+    { label: 'QSFP-DD 800G',  speed_gbps: 800, form_factor: 'QSFP-DD', obs: 40,   avg_price: 749.08 }
+  ];
+
+  var items = seedData;
+  try {
+    var d = await api('/api/procurement/signals?limit=30');
+    if (d && d.signals && d.signals.length > 0) {
+      d.signals.forEach(function(sig) {
+        var key = (sig.form_factor || '') + String(sig.speed_gbps || '');
+        var ex = items.find(function(it) { return (it.form_factor || '') + String(it.speed_gbps || '') === key; });
+        if (ex && sig.observation_count > 0) ex.obs = sig.observation_count;
+      });
+    }
+  } catch(e) {}
+
+  var totalObs = items.reduce(function(a, b) { return a + b.obs; }, 0);
+  if (meta) meta.textContent = totalObs.toLocaleString() + ' obs · ' + items.length + ' segments';
+
+  // ── Same dimensions & curve as renderHypeSvg ───────────────────────────
+  var W = 1400, TOP_LABEL = 30, H = 400, P = 30, BOTTOM_LABEL = 30, PHASE_ZONE = 40;
+  var curveTop = TOP_LABEL;
+  var totalH = TOP_LABEL + H + BOTTOM_LABEL + PHASE_ZONE;
+  var cw = W - P * 2, ch = H;
+
+  var pts = [];
+  for (var i = 0; i <= cw; i += 2) {
+    var cy2 = curveY(i, cw, ch) + curveTop;
+    pts.push((i + P) + ',' + cy2);
+  }
+
+  // Reuse exact same gradients/filters as renderHypeSvg — no separate defs needed
+  var svg = '<svg viewBox="0 0 ' + W + ' ' + totalH + '" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid meet" style="display:block;width:100%;height:auto">';
+
+  // Grid lines — identical to renderHypeSvg
+  for (var gy = 0; gy < 6; gy++) {
+    var gridY = curveTop + (ch / 5) * gy;
+    svg += '<line x1="' + P + '" y1="' + gridY + '" x2="' + (cw+P) + '" y2="' + gridY + '" stroke="rgba(0,0,0,0.04)" stroke-width="1"/>';
+  }
+
+  // Phase separators — same positions as transceiver cycle
+  var rb = [0, 0.15, 0.28, 0.50, 0.78, 1.0];
+  for (var r = 1; r < 5; r++) {
+    var sepX = rb[r] * cw + P;
+    svg += '<line x1="' + sepX + '" y1="' + curveTop + '" x2="' + sepX + '" y2="' + (curveTop+ch) + '" stroke="rgba(255,129,0,0.06)" stroke-width="1" stroke-dasharray="3,5"/>';
+  }
+
+  // Area fill — same gradient as transceiver
+  var areaPoints = pts.join(' ') + ' ' + (cw + P) + ',' + (curveTop + ch) + ' ' + P + ',' + (curveTop + ch);
+  svg += '<polygon points="' + areaPoints + '" fill="url(#fillGrad)"/>';
+
+  // Glow + main curve — reuse curveGrad, glow-soft, identical stroke widths
+  svg += '<polyline points="' + pts.join(' ') + '" fill="none" stroke="url(#glowLineGrad)" stroke-width="14" stroke-linecap="round" filter="url(#glow-soft)"/>';
+  svg += '<polyline points="' + pts.join(' ') + '" fill="none" stroke="url(#curveGrad)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>';
+
+  // Phase labels at bottom — same style as transceiver
+  var phaseY = curveTop + ch + BOTTOM_LABEL;
+  var srcPhaseLabels = [
+    { l: 'Discovery',     x: 0.075 },
+    { l: 'Ramp-Up',       x: 0.215 },
+    { l: 'Peak\\nDemand', x: 0.39  },
+    { l: 'Mature',        x: 0.64  },
+    { l: 'Commodity',     x: 0.89  }
+  ];
+  for (var sp = 0; sp < srcPhaseLabels.length; sp++) {
+    var spx = srcPhaseLabels[sp].x * cw + P;
+    var sll = srcPhaseLabels[sp].l.split('\\n');
+    for (var sli = 0; sli < sll.length; sli++) {
+      svg += '<text x="' + spx + '" y="' + (phaseY + 12 + sli * 13) + '" class="hype-phase-label" style="fill:rgba(0,0,0,0.45)">' + esc(sll[sli]) + '</text>';
+    }
+  }
+
+  // Map sourcing phases to PC colors (same as transceiver dots)
+  var SRC_TO_PC = {
+    DISCOVERY:   PC['Innovation Trigger']             || '#FF8100',
+    RAMP_UP:     PC['Peak of Inflated Expectations']  || '#FFa030',
+    PEAK_DEMAND: PC['Trough of Disillusionment']      || '#c1121f',
+    MATURE:      PC['Slope of Enlightenment']         || '#555555',
+    COMMODITY:   PC['Plateau of Productivity']        || '#000000'
+  };
+
+  // Sort items by x position
+  var sortedItems = items.slice().sort(function(a, b) {
+    var pA = getSourcingPhase(a.obs), pB = getSourcingPhase(b.obs);
+    var xA = SOURCING_PHASE_X[pA.key] + ((a.avg_price % 100) / 100 - 0.5) * 8;
+    var xB = SOURCING_PHASE_X[pB.key] + ((b.avg_price % 100) / 100 - 0.5) * 8;
+    return xA - xB;
+  });
+
+  // Build dot positions
+  var techPositions = [];
+  for (var ti = 0; ti < sortedItems.length; ti++) {
+    var sit = sortedItems[ti];
+    var sph = getSourcingPhase(sit.obs);
+    var jitter = ((sit.avg_price % 100) / 100 - 0.5) * 8;
+    var xPct = Math.min(Math.max(SOURCING_PHASE_X[sph.key] + jitter, 2), 98);
+    var dotX = P + (xPct / 100) * cw;
+    var dotY = curveY((xPct / 100) * cw, cw, ch) + curveTop;
+    techPositions.push({ it: sit, ph: sph, dotX: dotX, dotY: dotY, labelX: dotX, isTop: (ti % 2 === 0) });
+  }
+
+  // Spread labels — same function as transceiver
+  function spreadSrcLabels(positions, minGap) {
+    for (var i = 1; i < positions.length; i++) {
+      if (positions[i].labelX - positions[i-1].labelX < minGap)
+        positions[i].labelX = positions[i-1].labelX + minGap;
+    }
+    var maxX = W - P - 50;
+    if (positions.length && positions[positions.length - 1].labelX > maxX) {
+      var over = positions[positions.length - 1].labelX - maxX;
+      for (var i = 0; i < positions.length; i++)
+        positions[i].labelX = Math.max(P + 40, positions[i].labelX - over * ((i + 1) / positions.length));
+    }
+  }
+  spreadSrcLabels(techPositions.filter(function(p) { return p.isTop; }), 110);
+  spreadSrcLabels(techPositions.filter(function(p) { return !p.isTop; }), 110);
+
+  // Render — 1:1 identical to renderHypeSvg render loop
+  for (var ti = 0; ti < techPositions.length; ti++) {
+    var tp = techPositions[ti];
+    var sit = tp.it, sph = tp.ph;
+    var color = SRC_TO_PC[sph.key] || '#8888a4';
+    var dotX = tp.dotX, dotY = tp.dotY, labelX = tp.labelX;
+    var obsStr = sit.obs >= 1000 ? (sit.obs / 1000).toFixed(1) + 'k' : String(sit.obs);
+    var priceStr = '€' + Math.round(sit.avg_price);
+
+    if (tp.isTop) {
+      var labelY = 20;
+      var tickY1 = 28, tickY2 = 34;
+      svg += '<line x1="' + labelX + '" y1="' + tickY2 + '" x2="' + dotX + '" y2="' + (dotY - 8) + '" stroke="rgba(255,129,0,0.35)" stroke-width="1"/>';
+      svg += '<line x1="' + labelX + '" y1="' + tickY1 + '" x2="' + labelX + '" y2="' + tickY2 + '" stroke="rgba(255,129,0,0.7)" stroke-width="2" stroke-linecap="round"/>';
+      svg += '<text x="' + labelX + '" y="' + labelY + '" text-anchor="middle" class="hype-label" font-weight="700" font-size="11" style="fill:#1a1a2e">' + esc(sit.label) + '</text>';
+    } else {
+      var labelY = curveTop + ch + 18;
+      var tickY1 = labelY - 12, tickY2 = labelY - 6;
+      svg += '<line x1="' + dotX + '" y1="' + (dotY + 8) + '" x2="' + labelX + '" y2="' + tickY1 + '" stroke="rgba(255,129,0,0.35)" stroke-width="1"/>';
+      svg += '<line x1="' + labelX + '" y1="' + tickY1 + '" x2="' + labelX + '" y2="' + tickY2 + '" stroke="rgba(255,129,0,0.7)" stroke-width="2" stroke-linecap="round"/>';
+      svg += '<text x="' + labelX + '" y="' + labelY + '" text-anchor="middle" class="hype-label" font-weight="700" font-size="11" style="fill:#1a1a2e">' + esc(sit.label) + '</text>';
+    }
+
+    // Pulse ring + outer ring + main dot — 1:1 identical to renderHypeSvg
+    svg += '<circle cx="' + dotX + '" cy="' + dotY + '" r="14" fill="' + color + '" class="hype-pulse" style="animation-delay:' + (ti * 0.35) + 's"/>';
+    svg += '<circle cx="' + dotX + '" cy="' + dotY + '" r="10" fill="none" stroke="' + color + '" stroke-width="0.8" opacity="0.25"/>';
+    svg += '<g class="hype-dot" style="cursor:pointer" onclick="el(\'tx-ff-filter\').value=\'' + esc(sit.form_factor) + '\';goToTab(\'transceivers\');searchTransceivers()">';
+    svg += '<title>' + esc(sit.label) + ' · ' + sit.obs + ' obs · avg ' + priceStr + ' · ' + sph.label + '</title>';
+    svg += '<circle cx="' + dotX + '" cy="' + dotY + '" r="5.5" fill="' + color + '" filter="url(#glow)" stroke="rgba(255,255,255,0.25)" stroke-width="0.8" style="cursor:pointer"/>';
+    svg += '</g>';
+    svg += '<circle cx="' + (dotX-1.2) + '" cy="' + (dotY-1.2) + '" r="1.5" fill="rgba(255,255,255,0.7)" opacity="0.6" pointer-events="none"/>';
+    svg += '<text x="' + (dotX + 8) + '" y="' + (dotY - 8) + '" font-size="8" font-family="\'JetBrains Mono\',monospace" fill="' + color + '" pointer-events="none" font-weight="700">' + esc(obsStr) + '</text>';
+  }
+
+  svg += '</svg>';
+  buildDOM(container, svg);
 }
 
 // TRANSCEIVERS
@@ -2042,6 +2555,16 @@ function searchTransceivers() {
 
   api('/api/transceivers?' + params.join('&')).then(function(data) {
     lastTxData = data.data || data.transceivers || [];
+    // Show result count in search bar placeholder
+    var total = data.total || lastTxData.length;
+    var activeFilter = q || ff || vf;
+    var txSearchEl = el('tx-search');
+    if (txSearchEl && !activeFilter) txSearchEl.placeholder = 'Filter: Nexus 9300, QSFP28, 400G, coherent… (' + total + ' transceivers total)';
+    // Show count above table + clear button
+    var countNote = el('tx-result-count');
+    if (countNote) countNote.textContent = 'Showing ' + lastTxData.length + (data.total && data.total > lastTxData.length ? ' of ' + data.total : '') + ' transceivers' + (activeFilter ? ' — filter active' : '');
+    var clearBtn = el('tx-clear-filter');
+    if (clearBtn) clearBtn.style.display = activeFilter ? '' : 'none';
     buildDOM(el('tx-table'), lastTxData.map(function(t) {
       return '<tr class="clickable" data-txid="' + esc(t.id) + '">'
         + '<td onclick="event.stopPropagation()"><input type="checkbox" class="compare-cb" data-id="' + esc(t.id) + '"></td>'
@@ -2052,7 +2575,7 @@ function searchTransceivers() {
         + '<td><span class="b b-blue">' + esc(t.form_factor) + '</span></td>'
         + '<td class="mono">' + esc(t.speed) + '</td>'
         + '<td>' + esc(t.reach_label) + '</td>'
-        + '<td class="mono">' + (t.street_price_usd ? '$' + parseFloat(t.street_price_usd).toLocaleString() : '—') + '</td>'
+        + '<td class="mono">' + (t.street_price_usd ? fmtUSD(t.street_price_usd) : '—') + '</td>'
         + '<td>' + (t.price_tier ? '<span class="b ' + (t.price_tier === 'Premium' ? 'b-purple' : t.price_tier === 'Budget' ? 'b-green' : 'b-neutral') + '">' + esc(t.price_tier) + '</span>' : '—') + '</td>'
         + '<td>' + (t.market_status ? '<span class="b b-green">' + esc(t.market_status) + '</span>' : '—') + '</td>'
         + '<td>' + (t.category ? '<span class="b b-neutral">' + esc(t.category) + '</span>' : '') + '</td>'
@@ -2251,7 +2774,31 @@ async function openTxDetail(id) {
         var verBadge = p.is_verified === true
           ? '<span style="color:#2d6a4f;font-size:0.68rem;font-weight:600;margin-left:0.5rem" title="Scraped from official vendor page, max. 7 days old">✓ Verified</span>'
           : '';
-        var priceStr = '<strong style="font-size:0.9rem">' + p.currency + '\u00a0' + parseFloat(p.price).toLocaleString('de-DE', {minimumFractionDigits:2,maximumFractionDigits:2}) + '</strong>';
+
+        // Always show USD (lead) + EUR — convert from original currency
+        var origAmt  = parseFloat(p.price);
+        var origCur  = (p.currency || 'USD').toUpperCase();
+        var usdAmt   = toUSD(origAmt, origCur);
+        var eurAmt   = toEUR(origAmt, origCur);
+
+        var priceStr = '<strong style="font-size:0.9rem">';
+        if (usdAmt !== null) {
+          priceStr += fmtUSD(usdAmt);
+        } else {
+          priceStr += origCur + '\u00a0' + origAmt.toLocaleString('de-DE', {minimumFractionDigits:2,maximumFractionDigits:2});
+        }
+        priceStr += '</strong>';
+
+        // EUR secondary (always)
+        if (eurAmt !== null) {
+          priceStr += '<span style="color:#aaa;font-size:0.78rem;margin-left:0.45rem">/ ' + fmtEUR(eurAmt) + '</span>';
+        }
+
+        // Original in grey if neither USD nor EUR
+        if (origCur !== 'USD' && origCur !== 'EUR') {
+          priceStr += '<span style="color:#666;font-size:0.65rem;margin-left:0.3rem" title="Original price">(' + origCur + '\u00a0' + origAmt.toLocaleString('de-DE', {minimumFractionDigits:2,maximumFractionDigits:2}) + ')</span>';
+        }
+
         var dateStr = '<span style="color:#aaa;font-size:0.67rem;margin-left:0.5rem">Stand: ' + fmtDate(p.observed_at) + '</span>';
         var urlLink = '<a href="' + esc(p.url) + '" target="_blank" rel="noopener" style="color:var(--accent);font-size:0.68rem;text-decoration:none;margin-left:0.5rem">↗</a>';
         // Same layout for all rows — comparable_part as tooltip only, never as block
@@ -2740,7 +3287,15 @@ async function openSwitchDetail(id) {
           ch += '<div style="margin:0.5rem 0 0.3rem;font-weight:600;font-size:0.78rem;color:var(--text-bright)">' + esc(key) + ' <span class="dim" style="font-weight:400;font-size:0.72rem">(' + items.length + ')</span></div>';
           ch += '<div style="display:flex;flex-direction:column;gap:0.3rem">';
           items.slice(0, 8).forEach(function(t) {
-            var priceStr = t.latest_price ? ' — ' + (t.latest_currency || 'EUR') + ' ' + parseFloat(t.latest_price).toLocaleString('de-DE', {minimumFractionDigits:2,maximumFractionDigits:2}) : '';
+            var priceStr = '';
+            if (t.latest_price) {
+              var _pAmt = parseFloat(t.latest_price);
+              var _pCur = (t.latest_currency || 'USD').toUpperCase();
+              var _pUSD = toUSD(_pAmt, _pCur);
+              var _pEUR = toEUR(_pAmt, _pCur);
+              priceStr = ' — ' + (_pUSD !== null ? fmtUSD(_pUSD) : _pCur + ' ' + _pAmt.toFixed(2))
+                + (_pEUR !== null ? ' / ' + fmtEUR(_pEUR) : '');
+            }
             var verBadge = (t.price_verified === true)
               ? '<span style="color:#2d6a4f;font-size:0.64rem;font-weight:600;margin-left:0.3rem">✓ Verified</span>' : '';
             var fullyBadge = (t.fully_verified === true)
@@ -2790,19 +3345,566 @@ el('sw-search').addEventListener('keydown', function(e) { if (e.key === 'Enter')
 el('sw-cat-filter').addEventListener('change', searchSwitches);
 
 // NEWS
-async function loadNews() {
-  var data = await api('/api/search?q=optical+transceiver+data+center+networking&collection=news_embeddings&limit=25');
-  buildDOM(el('news-list'), (data.results || []).map(function(n) {
-    var urlSafe = (n.url && /^https?:\/\//.test(n.url)) ? n.url : '#';
+var _newsPage = 1;
+var _newsCategory = '';
+
+async function loadNews(page) {
+  page = page || _newsPage;
+  _newsPage = page;
+  _newsCategory = (el('news-cat-filter') ? el('news-cat-filter').value : '') || '';
+
+  el('news-list').innerHTML = '<div class="loading pulse">Loading articles…</div>';
+  el('news-pagination').innerHTML = '';
+
+  var url = '/api/news?page=' + page + '&limit=10' + (_newsCategory ? '&category=' + encodeURIComponent(_newsCategory) : '');
+  var data = await api(url).catch(function() { return {}; });
+
+  // Populate category filter (once)
+  var catSel = el('news-cat-filter');
+  if (catSel && (data.categories || []).length > 0) {
+    var cur = catSel.value;
+    catSel.innerHTML = '<option value="">All Categories</option>';
+    (data.categories || []).forEach(function(c) {
+      catSel.innerHTML += '<option value="' + esc(c) + '"' + (c === cur ? ' selected' : '') + '>' + esc(c) + '</option>';
+    });
+  }
+
+  var total = data.total || 0;
+  var pages = data.pages || 1;
+  var meta = el('news-meta');
+  if (meta) meta.textContent = total + ' articles · Page ' + page + ' of ' + pages;
+
+  var articles = data.articles || [];
+  if (!articles.length) {
+    el('news-list').innerHTML = '<div style="color:var(--text-dim);padding:1.5rem;text-align:center">No articles yet — scrapers are collecting data.</div>';
+    return;
+  }
+
+  buildDOM(el('news-list'), articles.map(function(n) {
+    var urlSafe = (n.source_url && /^https?:\/\//.test(n.source_url)) ? n.source_url : '#';
+    var catColor = {
+      'Networking': '#e6a800', 'Data Center': '#2d6a4f', 'Optical': '#FF8100',
+      'AI Infrastructure': '#c1121f', 'Market': '#4287f5', 'NOG': '#8b5cf6'
+    }[n.category] || '#666';
     return '<div class="ri">'
       + '<div class="ri-title">' + esc(n.title) + '</div>'
-      + '<div class="ri-body">' + esc(n.summary) + '</div>'
+      + '<div class="ri-body">' + esc(n.summary || '') + '</div>'
       + '<div class="ri-meta">'
-      + '<span class="b b-blue">' + esc(n.source) + '</span>'
-      + (n.published_at ? '<span>' + new Date(n.published_at).toLocaleDateString() + '</span>' : '')
+      + '<span class="b b-blue">' + esc(n.source || '') + '</span>'
+      + (n.category ? '<span style="background:' + catColor + '22;color:' + catColor + ';padding:1px 6px;border-radius:8px;font-size:0.65rem;font-weight:600">' + esc(n.category) + '</span>' : '')
+      + (n.relevance_score ? '<span style="color:var(--text-dim);font-size:0.68rem">relevance: ' + parseFloat(n.relevance_score).toFixed(2) + '</span>' : '')
+      + (n.published_at ? '<span>' + new Date(n.published_at).toLocaleDateString('de-DE') + '</span>' : '')
       + (urlSafe !== '#' ? '<a href="' + esc(urlSafe) + '" target="_blank" rel="noopener noreferrer" style="color:var(--accent);text-decoration:none;font-size:0.72rem;font-weight:600">Read &rarr;</a>' : '')
       + '</div></div>';
-  }).join('') || '<div class="loading">No news yet</div>');
+  }).join(''));
+
+  // Pagination buttons
+  if (pages > 1) {
+    var pag = '';
+    var btnStyle = 'padding:5px 12px;border-radius:6px;border:1px solid var(--border);background:var(--bg2);color:var(--text);cursor:pointer;font-size:0.8rem';
+    var activeStyle = 'padding:5px 12px;border-radius:6px;border:1px solid var(--accent);background:var(--accent);color:white;cursor:pointer;font-size:0.8rem;font-weight:700';
+    if (page > 1) pag += '<button style="' + btnStyle + '" onclick="loadNews(' + (page-1) + ')">← Prev</button>';
+    var start = Math.max(1, page - 2);
+    var end   = Math.min(pages, page + 2);
+    for (var p = start; p <= end; p++) {
+      pag += '<button style="' + (p === page ? activeStyle : btnStyle) + '" onclick="loadNews(' + p + ')">' + p + '</button>';
+    }
+    if (page < pages) pag += '<button style="' + btnStyle + '" onclick="loadNews(' + (page+1) + ')">Next →</button>';
+    el('news-pagination').innerHTML = pag;
+  }
+}
+
+// ── VENDORS TAB ──────────────────────────────────────────────────────────────
+var _allVendors = [];
+
+async function loadVendors() {
+  var grid = el('vendor-grid');
+  if (!grid) return;
+  // Always reload on tab switch (fresh data)
+  grid.innerHTML = '<div class="loading pulse">Loading vendors…</div>';
+  var data = await api('/api/vendors').catch(function() { return {}; });
+  // Use v.type (DB column name) — sort by transceiver count desc, then name
+  _allVendors = (data.data || []);
+  _allVendors.sort(function(a, b) {
+    var diff = parseInt(b.transceiver_count || 0) - parseInt(a.transceiver_count || 0);
+    return diff !== 0 ? diff : (a.name || '').localeCompare(b.name || '');
+  });
+  filterVendorCards();
+}
+
+function filterVendorCards() {
+  var grid = el('vendor-grid');
+  if (!grid) return;
+  var q   = el('vendor-search')      ? el('vendor-search').value.toLowerCase()      : '';
+  var typ = el('vendor-type-filter') ? el('vendor-type-filter').value.toLowerCase() : '';
+
+  var filtered = _allVendors.filter(function(v) {
+    var vType  = (v.type || '').toLowerCase();   // DB column is "type", not "vendor_type"
+    var matchQ = !q || (v.name || '').toLowerCase().includes(q)
+                    || (v.slug || '').toLowerCase().includes(q)
+                    || (v.headquarters || '').toLowerCase().includes(q);
+    // Map UI filter values to DB type values
+    var typeMap = { oem: ['oem','manufacturer'], compatible: ['compatible','reseller'], distributor: ['distributor'] };
+    var matchT  = !typ || (typeMap[typ] || [typ]).indexOf(vType) !== -1;
+    return matchQ && matchT;
+  });
+
+  var cnt = el('vendor-count');
+  if (cnt) cnt.textContent = filtered.length + ' of ' + _allVendors.length + ' vendors';
+
+  if (!filtered.length) {
+    grid.innerHTML = '<div style="color:var(--text-dim);grid-column:1/-1;padding:1.5rem">No vendors match your filter.</div>';
+    return;
+  }
+
+  // Color by DB type value
+  var typeColors = { manufacturer: '#c1121f', oem: '#c1121f', compatible: '#2d6a4f', reseller: '#2d6a4f', distributor: '#4287f5' };
+
+  var html = '';
+  filtered.forEach(function(v) {
+    var tc  = parseInt(v.transceiver_count || 0);
+    var vt  = (v.type || 'unknown').toLowerCase();
+    var col = typeColors[vt] || '#888';
+    var colRgba = 'rgba(' + (col === '#c1121f' ? '193,18,31' : col === '#2d6a4f' ? '45,106,79' : col === '#4287f5' ? '66,135,245' : '136,136,136') + ',0.12)';
+    var initials = (v.name || v.slug || '?').substring(0, 2).toUpperCase();
+
+    html += '<div class="card" style="padding:0.85rem;cursor:pointer;border-left:3px solid ' + col + ';transition:box-shadow 0.15s" '
+      + 'data-vendor-id="' + esc(v.id) + '" onclick="vendorCardClick(this)">'
+      // Logo placeholder + name
+      + '<div style="display:flex;align-items:center;gap:0.6rem;margin-bottom:0.5rem">'
+      + '<div style="width:32px;height:32px;border-radius:6px;background:' + colRgba + ';display:flex;align-items:center;justify-content:center;font-weight:800;font-size:0.7rem;color:' + col + ';flex-shrink:0">' + initials + '</div>'
+      + '<div>'
+      + '<div style="font-weight:700;font-size:0.88rem;color:var(--text-bright);line-height:1.2">' + esc(v.name || v.slug) + '</div>'
+      + (v.headquarters ? '<div style="font-size:0.65rem;color:var(--text-dim)">' + esc(v.headquarters) + '</div>' : '')
+      + '</div>'
+      + '</div>'
+      // Badges
+      + '<div style="display:flex;gap:0.35rem;flex-wrap:wrap;margin-bottom:0.4rem">'
+      + '<span style="background:' + colRgba + ';color:' + col + ';font-size:0.6rem;font-weight:700;padding:1px 7px;border-radius:8px;text-transform:uppercase">' + esc(v.type || 'unknown') + '</span>'
+      + (tc > 0 ? '<span style="background:var(--surface2);color:var(--text-dim);font-size:0.6rem;padding:1px 7px;border-radius:8px">' + tc + ' products</span>' : '')
+      + (v.founded_year ? '<span style="background:var(--surface2);color:var(--text-dim);font-size:0.6rem;padding:1px 7px;border-radius:8px">est. ' + v.founded_year + '</span>' : '')
+      + '</div>'
+      + (v.website ? '<a href="' + esc(v.website) + '" target="_blank" rel="noopener" onclick="event.stopPropagation()" style="font-size:0.67rem;color:var(--accent);text-decoration:none">↗ ' + esc(v.website.replace(/^https?:\/\/(www\.)?/, '').split('/')[0]) + '</a>' : '')
+      + '</div>';
+  });
+  grid.innerHTML = html;
+}
+
+function vendorCardClick(card) {
+  var vid = card.getAttribute('data-vendor-id');
+  if (!vid) return;
+  // Find vendor → filter by name (dropdown uses name as value)
+  var v = _allVendors.find(function(x) { return x.id === vid; });
+  if (!v) return;
+  goToTab('transceivers');
+  var vf = el('tx-vendor-filter');
+  if (vf) {
+    // Match by name (exact) since options are keyed by v.name
+    vf.value = v.name || '';
+    // If exact match not found (e.g. name casing differs), try to find matching option
+    if (vf.value !== v.name) {
+      var opts = vf.options;
+      for (var i = 0; i < opts.length; i++) {
+        if (opts[i].value.toLowerCase() === (v.name || '').toLowerCase()) {
+          vf.value = opts[i].value;
+          break;
+        }
+      }
+    }
+  }
+  searchTransceivers();
+}
+
+// ── CREATE VENDOR MODAL ──────────────────────────────────────────────────────
+function openCreateVendorModal() {
+  var m = el('vendor-modal');
+  if (m) { m.style.display = 'flex'; m.style.alignItems = 'flex-start'; m.style.justifyContent = 'center'; }
+  // Show crawl notice by default (encourage adding website)
+  el('cv-website') && el('cv-website').addEventListener('input', function() {
+    var notice = el('cv-crawl-notice');
+    if (notice) notice.style.display = this.value.trim() ? 'block' : 'none';
+  }, { once: true });
+}
+
+function closeCreateVendorModal() {
+  var m = el('vendor-modal');
+  if (m) m.style.display = 'none';
+  // Reset form
+  ['cv-name','cv-website','cv-shopurl','cv-hq','cv-market','cv-revenue','cv-employees','cv-specialties'].forEach(function(id) {
+    var el2 = el(id); if (el2) el2.value = '';
+  });
+  var yr = el('cv-year'); if (yr) yr.value = '';
+  var ct = el('cv-competitor'); if (ct) ct.checked = false;
+  var notice = el('cv-crawl-notice'); if (notice) notice.style.display = 'none';
+}
+
+async function submitCreateVendor() {
+  var nameEl = el('cv-name');
+  if (!nameEl || !nameEl.value.trim()) {
+    if (typeof showToast === 'function') showToast('Fehler', 'Name ist erforderlich', true);
+    nameEl && nameEl.focus();
+    return;
+  }
+  var btn = el('cv-submit');
+  if (btn) { btn.disabled = true; btn.textContent = 'Speichern…'; }
+
+  var payload = {
+    name:          el('cv-name')       ? el('cv-name').value.trim()       : '',
+    type:          el('cv-type')       ? el('cv-type').value               : 'compatible',
+    website:       el('cv-website')    ? el('cv-website').value.trim()    : '',
+    shop_url:      el('cv-shopurl')    ? el('cv-shopurl').value.trim()    : '',
+    headquarters:  el('cv-hq')        ? el('cv-hq').value.trim()         : '',
+    market_position: el('cv-market')  ? el('cv-market').value.trim()     : '',
+    founded_year:  el('cv-year')      ? el('cv-year').value               : '',
+    revenue_usd:   el('cv-revenue')   ? el('cv-revenue').value            : '',
+    employee_count: el('cv-employees')? el('cv-employees').value          : '',
+    specialties:   el('cv-specialties')? el('cv-specialties').value.trim(): '',
+    is_competitor: el('cv-competitor') ? el('cv-competitor').checked       : false,
+  };
+
+  try {
+    var token = window.loadToken ? window.loadToken() : (localStorage.getItem('tip_token') || '');
+    var resp = await fetch(API + '/api/vendors', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json', 'Authorization': 'Bearer ' + token },
+      body: JSON.stringify(payload)
+    });
+    var data = await resp.json();
+    if (data.success) {
+      if (typeof showToast === 'function') showToast('Vendor angelegt ✓', data.message || payload.name);
+      closeCreateVendorModal();
+      _allVendors = []; // Force reload
+      loadVendors();
+    } else {
+      if (typeof showToast === 'function') showToast('Fehler', data.error || 'Unbekannter Fehler', true);
+    }
+  } catch(err) {
+    if (typeof showToast === 'function') showToast('Netzwerkfehler', String(err), true);
+  } finally {
+    if (btn) { btn.disabled = false; btn.textContent = 'Vendor anlegen'; }
+  }
+}
+
+// Close modal on backdrop click
+document.addEventListener('click', function(e) {
+  var modal = el('vendor-modal');
+  if (modal && e.target === modal) closeCreateVendorModal();
+});
+
+// ── STANDARDS TAB ────────────────────────────────────────────────────────────
+var _allStandards = [];
+
+async function loadStandardsList() {
+  var tbody = el('std-table');
+  if (!tbody) return;
+
+  // Sourcing activity: fetch procurement signals for hot demand
+  api('/api/procurement/signals?limit=20').then(function(d) {
+    var signals = (d.signals || []).slice(0, 8);
+    if (!signals.length) return;
+    var banner = el('sourcing-activity-banner');
+    if (!banner) return;
+    banner.innerHTML = '<div class="card" style="padding:0.75rem 1rem;border-left:3px solid #FF8100;margin-bottom:0">'
+      + '<div style="font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:#FF8100;margin-bottom:0.5rem">🔥 Sourcing Hype Cycle — Most Active Right Now</div>'
+      + '<div style="display:flex;gap:0.5rem;flex-wrap:wrap">'
+      + signals.map(function(s) {
+          var score = parseFloat(s.composite_score || s.market_score || 0);
+          var heat  = score > 0.7 ? '#c1121f' : score > 0.4 ? '#FF8100' : '#2d6a4f';
+          var ff    = Array.isArray(s.form_factors) ? s.form_factors[0] : (s.form_factors || s.form_factor || '');
+          return '<span style="background:' + heat + '22;color:' + heat + ';padding:2px 10px;border-radius:10px;font-size:0.72rem;font-weight:600;cursor:pointer" '
+            + 'title="Composite score: ' + score.toFixed(2) + '">'
+            + esc((s.speed_gbps ? s.speed_gbps + 'G ' : '') + (ff || s.name || s.category || ''))
+            + '</span>';
+        }).join('')
+      + '</div></div>';
+  }).catch(function() {});
+
+  if (_allStandards.length === 0) {
+    tbody.innerHTML = '<tr><td colspan="7" class="loading pulse">Loading…</td></tr>';
+    var data = await api('/api/standards').catch(function() { return {}; });
+    _allStandards = data.data || [];
+  }
+  filterStandardsTable();
+}
+
+function filterStandardsTable() {
+  var tbody = el('std-table');
+  if (!tbody) return;
+  var q     = (el('std-search')       ? el('std-search').value.toLowerCase()       : '');
+  var speed = (el('std-speed-filter') ? el('std-speed-filter').value : '');
+  var rows  = _allStandards.filter(function(s) {
+    var ffStr = Array.isArray(s.form_factors) ? s.form_factors.join(' ') : (s.form_factors || '');
+    var matchQ = !q || (s.name || '').toLowerCase().includes(q)
+      || (s.ieee_reference || '').toLowerCase().includes(q)
+      || ffStr.toLowerCase().includes(q)
+      || (s.speed || '').toLowerCase().includes(q);
+    var matchS = !speed || String(s.speed_gbps) === speed;
+    return matchQ && matchS;
+  });
+  if (!rows.length) {
+    tbody.innerHTML = '<tr><td colspan="10" style="color:var(--text-dim);padding:1rem">No standards match your filter.</td></tr>';
+    return;
+  }
+  var speedColors = { 1600: '#7c3aed', 800: '#c1121f', 400: '#FF8100', 200: '#e6a800', 100: '#2d6a4f', 40: '#4287f5', 25: '#0ea5e9', 10: '#888', 1: '#555' };
+  var statusColors = { ratified: '#2d6a4f', published: '#2d6a4f', draft: '#e6a800', deprecated: '#c1121f', emerging: '#FF8100' };
+  tbody.innerHTML = rows.map(function(s) {
+    var col = speedColors[s.speed_gbps] || '#888';
+    var sCl = statusColors[(s.status || '').toLowerCase()] || '#888';
+    // Form factors as mini badges
+    var ffs = Array.isArray(s.form_factors) ? s.form_factors : (s.form_factors ? [s.form_factors] : []);
+    var ffBadges = ffs.slice(0,3).map(function(f) {
+      return '<span class="b b-blue" style="font-size:0.68rem;padding:1px 5px;margin-right:2px">' + esc(f) + '</span>';
+    }).join('') + (ffs.length > 3 ? '<span style="color:var(--text-dim);font-size:0.68rem">+' + (ffs.length-3) + '</span>' : '');
+    var ieee = s.ieee_reference || '—';
+    var bodyYear = [s.body, s.year_ratified].filter(Boolean).join(' · ') || '—';
+    var wavelength = s.wavelength ? s.wavelength + ' nm' : '—';
+    var statusBadge = s.status
+      ? '<span style="background:' + sCl + '22;color:' + sCl + ';padding:1px 7px;border-radius:8px;font-size:0.68rem;font-weight:600">' + esc(s.status) + '</span>'
+      : '<span style="color:var(--text-dim)">—</span>';
+    var sidx = _allStandards.indexOf(s);
+    return '<tr style="cursor:pointer" onclick="openStandardDetail(' + sidx + ')">'
+      + '<td style="font-weight:700;color:var(--text-bright);min-width:120px">' + esc(s.name || '—') + '</td>'
+      + '<td><span style="background:' + col + '22;color:' + col + ';padding:2px 8px;border-radius:8px;font-weight:700;font-size:0.8rem;white-space:nowrap">' + (s.speed_gbps || '—') + 'G</span></td>'
+      + '<td style="min-width:100px">' + (ffBadges || '<span style="color:var(--text-dim)">—</span>') + '</td>'
+      + '<td style="white-space:nowrap">' + esc(s.max_reach_label || '—') + '</td>'
+      + '<td style="color:var(--text-dim);font-size:0.8rem">' + esc(s.fiber_type || '—') + '</td>'
+      + '<td style="font-size:0.8rem;color:var(--text-dim);white-space:nowrap">' + esc(wavelength) + '</td>'
+      + '<td style="font-size:0.75rem;color:var(--cyan);font-family:var(--mono)">' + esc(ieee) + '</td>'
+      + '<td style="font-size:0.75rem;color:var(--text-dim)">' + esc(bodyYear) + '</td>'
+      + '<td>' + statusBadge + '</td>'
+      + '<td style="color:var(--text-dim);font-size:0.8rem;text-align:right;padding-right:0.5rem">'
+      + (s.transceiver_count > 0 ? '<span style="color:var(--accent);font-weight:600">' + s.transceiver_count + '</span>' : '—') + '</td>'
+      + '</tr>';
+  }).join('');
+}
+
+// ── STANDARD DETAIL PANEL ────────────────────────────────────────────────────
+// Plain-language explanation generator — also understood by non-technical colleagues
+
+var STD_REACH_LABELS = {
+  SR: 'Kurzdistanz (Short Range)',  SR2: 'Kurzdistanz',  SR4: 'Kurzdistanz',
+  SR8: 'Kurzdistanz', SR10: 'Kurzdistanz',
+  LR: 'Langdistanz (Long Range)',  LR1: 'Langdistanz',  LR4: 'Langdistanz',
+  LR8: 'Langdistanz', LR10: 'Langdistanz',
+  ER: 'Erweiterte Distanz (Extended Range)', ER4: 'Erweiterte Distanz', ER8: 'Erweiterte Distanz',
+  ZR: 'Sehr lange Distanz (up to 80km+)', 'ZR+': 'Ultra-Langdistanz kohärent',
+  FR: 'Kurzdistanz SMF (FR)', FR1: 'Kurzdistanz SMF', FR4: 'Kurzdistanz SMF', FR8: 'Kurzdistanz SMF',
+  DR: 'Kurzdistanz parallel SMF', DR4: 'Kurzdistanz parallel SMF', DR8: 'Kurzdistanz parallel SMF',
+  PSM4: 'Parallel Single-Mode (4 Fasern)',
+  CWDM4: 'CWDM4 — 4 Wellenlängen auf einer Faser',
+  LH: 'Long Haul (~70km)', EX: 'Extended (~40km)',
+  BX: 'BiDi — Senden und Empfangen auf einer Faser',
+  PLR4: 'Parallel Long Range', CSR4: 'Client Side', UNIV: 'Universal (SMF + MMF)'
+};
+
+var STD_FIBER_EXPLAIN = {
+  'SMF': 'Singlemode-Glasfaser (gelb) — für größere Distanzen, dünne Glasfaser mit einzelnem Lichtstrahl.',
+  'MMF': 'Multimode-Glasfaser (orange/grau) — für kurze Distanzen innerhalb von Gebäuden oder Rechenzentren.',
+  'SMF (parallel)': 'Mehrere Singlemode-Fasern parallel — für hohe Bandbreite auf kurzen Strecken.',
+  'MMF (OM3)': 'Multimode OM3 (50µm aqua) — Standard für 10G/40G in RZ-Umgebungen bis 300m.',
+  'MMF (OM4)': 'Multimode OM4 (50µm aqua) — Hochleistungs-MMF bis 100m bei 100G.',
+  'MMF (OM5)': 'Multimode OM5 (50µm lime green) — Breitband-MMF für SWDM, unterstützt 4 Wellenlängen.',
+  'MMF (OM3/OM4)': 'Multimode OM3 oder OM4 kompatibel.',
+  'SMF (DWDM)': 'Singlemode mit DWDM — viele Wellenlängen auf einer Faser (Carrier/WDM-Netze).',
+  'Copper': 'Kupfer-DAC/Twinax — kein Glasfaser, direktverkabeltes Kupferkabel bis ca. 5m.'
+};
+
+var STD_USE_CASES = {
+  800: ['Ultra-High-Speed Hyperscaler AI/ML-Fabrics (800G Switches zu GPUs)', 'Next-Gen Spine-Layer in Cloud-RZs', 'Vorbereitung für 1.6T Netzwerke'],
+  400: ['400G Spine/Leaf in modernen Cloud-RZs', 'AI/ML-Training-Cluster-Interconnects', 'Carrier-Grade WAN (kohärent)', 'Hochperformante Storage-Netzwerke'],
+  200: ['200G Aggregation Layer', 'High-Density 200G Server-Anbindung', 'Übergangsband zwischen 100G und 400G'],
+  100: ['Standard für moderne RZ-Infrastruktur', '100G Server-Uplinks', 'Campus-Core-Verbindungen', 'Carrier Edge-Anbindung'],
+  40:  ['Ältere 40G Spine-Verbindungen (werden durch 100G ersetzt)', '40G Uplinks für Blade-Server', 'Legacy QSFP+ Infrastruktur'],
+  25:  ['Standard Server-NIC-Anbindung (25G ToR)', '25G Hyperscaler Server-Fabric', 'Modern Data Center Access Layer'],
+  10:  ['Enterprise Server-Anbindung (10G ToR-Switch)', 'Storage-Netzwerke (iSCSI, NFS)', 'Campus-Aggregation', 'Klassische VMware/vSAN Umgebungen'],
+  1:   ['Endgeräte-Anbindung (PCs, Telefone, IP-Kameras)', 'IoT-Geräte', 'Out-of-Band-Management', 'Kleine Büronetzwerke']
+};
+
+function genStdPlainExplanation(s) {
+  var name = s.name || '';
+  var spd = s.speed_gbps || 0;
+  var spdStr = spd >= 1000 ? (spd/1000) + 'T' : spd + 'G';
+  var ffs = Array.isArray(s.form_factors) ? s.form_factors : [s.form_factors || ''];
+  var fiber = s.fiber_type || '';
+  var reach = s.max_reach_label || '';
+
+  // Extract suffix code (SR, LR, ER, ZR, etc.)
+  var suffixMatch = name.match(/BASE-([A-Z0-9.]+?)(\d+)?$/i);
+  var suffix = suffixMatch ? suffixMatch[1].toUpperCase() : '';
+  var reachLabel = STD_REACH_LABELS[suffix] || STD_REACH_LABELS[suffix + (suffixMatch && suffixMatch[2] ? suffixMatch[2] : '')] || '';
+
+  // Form factor plain name
+  var ffNames = { 'SFP': 'SFP (kleinstes Modul, 1G)', 'SFP+': 'SFP+ (10G-Modul)', 'SFP28': 'SFP28 (25G-Modul)',
+    'QSFP+': 'QSFP+ (4×10G = 40G-Modul)', 'QSFP28': 'QSFP28 (100G-Modul, Standard heute)',
+    'QSFP56': 'QSFP56 (200G-Modul)', 'QSFP-DD': 'QSFP-DD (400G Double-Density)', 'QSFP-DD800': 'QSFP-DD800 (800G)',
+    'OSFP': 'OSFP (800G, etwas größer)', 'CFP': 'CFP (älteres 100G-Modul)', 'CFP2': 'CFP2 (100G/400G kohärent)',
+    'CFP2-DCO': 'CFP2-DCO (kohärent, programmierbar)', 'XFP': 'XFP (älteres 10G-Modul)' };
+  var ffText = ffs.map(function(f) { return ffNames[f] || f; }).join(' oder ');
+
+  // Fiber explanation
+  var fiberText = STD_FIBER_EXPLAIN[fiber] || (fiber ? 'Glasfaser-Typ: ' + fiber : '');
+
+  // Build headline
+  var headline = spdStr + ' Ethernet';
+  if (spd >= 800) headline = 'Hochgeschwindigkeits-' + spdStr + ' Ethernet — modernste Infrastruktur';
+  else if (spd >= 400) headline = spdStr + ' Ethernet — aktuelle High-End-Infrastruktur';
+  else if (spd === 100) headline = spdStr + ' Ethernet — heutiger Standard im Rechenzentrum';
+  else if (spd === 10) headline = spdStr + ' Ethernet — bewährter Enterprise-Standard';
+  else if (spd === 1) headline = spdStr + ' Ethernet — klassische Netzwerkanbindung';
+  if (reachLabel) headline += ', ' + reachLabel;
+
+  // Build body description
+  var body = '<strong>' + esc(name) + '</strong> ist ein ';
+  if (name.includes('BASE-')) {
+    body += '<strong>' + spdStr + ' Ethernet-Standard</strong>, der definiert wie Netzwerkgeräte mit exakt '
+      + spdStr + ' Datenrate kommunizieren. ';
+  } else {
+    body += '<strong>Optischer Übertragungsstandard</strong> für ' + spdStr + '-Verbindungen. ';
+  }
+
+  if (reachLabel) body += 'Die Bezeichnung <em>' + esc(suffix) + '</em> steht für <strong>' + esc(reachLabel) + '</strong>. ';
+  if (reach) body += 'Die maximale Reichweite beträgt <strong>' + esc(reach) + '</strong>. ';
+  if (fiberText) body += fiberText + ' ';
+
+  if (name.includes('BiDi') || name.includes('BX')) {
+    body += '🔄 <strong>BiDi</strong> bedeutet: Senden und Empfangen über <em>eine einzige</em> Glasfaser — spart Verkabelungsaufwand. ';
+  }
+  if (name.includes('DWDM') || name.includes('ZR') || name.includes('Coherent') || name.toLowerCase().includes('coherent')) {
+    body += '🌊 <strong>Kohärente Übertragung</strong>: Nutzt komplexe Modulationsverfahren (wie DSP-Chips) um sehr lange Strecken zu überbrücken — typisch für Carrier-Netze und U-Bahn-/Fernverbindungen. ';
+  }
+  if (name.includes('CWDM') || name.includes('WDM')) {
+    body += '🌈 <strong>WDM (Wavelength Division Multiplexing)</strong>: Mehrere Datensignale in verschiedenen Farben (Wellenlängen) gleichzeitig über eine Faser. ';
+  }
+  if (name.includes('PSM') || name.includes('parallel') || (fiber && fiber.includes('parallel'))) {
+    body += '🔀 <strong>Parallel-Optik</strong>: Nutzt mehrere Glasfasern gleichzeitig (MPO-Kabel) — höhere Bandbreite durch Parallelisierung. ';
+  }
+
+  var ieee = s.ieee_reference || '';
+  var bodyOrg = s.body || '';
+  var year = s.year_ratified || '';
+  if (ieee) body += 'Der Standard wurde von <strong>' + esc(bodyOrg || 'IEEE') + '</strong>';
+  if (year) body += ' im Jahr <strong>' + year + '</strong>';
+  if (ieee) body += ' als <em>' + esc(ieee) + '</em> verabschiedet. ';
+
+  return { headline: headline, body: body };
+}
+
+async function openStandardDetail(idx) {
+  var s = _allStandards[idx];
+  if (!s) return;
+
+  var spd = s.speed_gbps || 0;
+  var speedColors = { 1600: '#7c3aed', 800: '#c1121f', 400: '#FF8100', 200: '#e6a800', 100: '#2d6a4f', 40: '#4287f5', 25: '#0ea5e9', 10: '#888', 1: '#555' };
+  var col = speedColors[spd] || '#888';
+  var ffs = Array.isArray(s.form_factors) ? s.form_factors : [s.form_factors || ''];
+  var explained = genStdPlainExplanation(s);
+  var useCases = STD_USE_CASES[spd] || STD_USE_CASES[10];
+
+  var h = '';
+
+  // Header
+  h += '<div style="margin-bottom:1rem">';
+  h += '<div style="display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap;margin-bottom:0.5rem">';
+  h += '<span style="background:' + col + '22;color:' + col + ';padding:3px 12px;border-radius:8px;font-weight:700;font-size:1rem">' + (spd || '?') + 'G</span>';
+  h += '<span style="font-size:1.1rem;font-weight:700;color:var(--text-bright)">' + esc(s.name || '') + '</span>';
+  if (s.status) {
+    var sCl = { ratified: '#2d6a4f', published: '#2d6a4f', draft: '#e6a800', deprecated: '#c1121f' }[s.status.toLowerCase()] || '#888';
+    h += '<span style="background:' + sCl + '22;color:' + sCl + ';padding:2px 8px;border-radius:6px;font-size:0.72rem;font-weight:600">' + esc(s.status) + '</span>';
+  }
+  h += '</div>';
+  h += '<div style="font-size:0.82rem;color:#FF8100;font-weight:600">' + esc(explained.headline) + '</div>';
+  h += '</div>';
+
+  // Plain-language explanation
+  h += '<div class="card" style="margin-bottom:1rem;padding:1rem;border-left:3px solid ' + col + '">';
+  h += '<div style="font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim);margin-bottom:0.6rem">Was ist das?</div>';
+  h += '<div style="font-size:0.83rem;color:var(--text);line-height:1.65">' + explained.body + '</div>';
+  h += '</div>';
+
+  // Key specs grid
+  h += '<div style="display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;margin-bottom:1rem">';
+  var specs = [
+    ['Reichweite', s.max_reach_label || '—'],
+    ['Glasfaser', s.fiber_type || '—'],
+    ['Wellenlänge', s.wavelength ? s.wavelength + ' nm' : '—'],
+    ['IEEE / MSA', s.ieee_reference || '—'],
+    ['Standardisierung', [s.body, s.year_ratified].filter(Boolean).join(' · ') || '—'],
+    ['FEC', s.fec_required ? 'Erforderlich' : (s.fec_required === false ? 'Nicht erforderlich' : '—')]
+  ];
+  specs.forEach(function(sp) {
+    h += '<div style="background:var(--surface3);padding:0.6rem 0.75rem;border-radius:8px">'
+      + '<div style="font-size:0.68rem;color:var(--text-dim);margin-bottom:2px">' + esc(sp[0]) + '</div>'
+      + '<div style="font-size:0.8rem;font-weight:600;color:var(--text-bright)">' + esc(sp[1]) + '</div>'
+      + '</div>';
+  });
+  h += '</div>';
+
+  // Form factors
+  if (ffs.length > 0 && ffs[0]) {
+    h += '<div style="margin-bottom:1rem">';
+    h += '<div style="font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim);margin-bottom:0.5rem">Modul-Bauform</div>';
+    h += '<div style="display:flex;gap:0.4rem;flex-wrap:wrap">';
+    ffs.forEach(function(f) {
+      h += '<span class="b b-blue" style="font-size:0.8rem;padding:3px 10px">' + esc(f) + '</span>';
+    });
+    h += '</div></div>';
+  }
+
+  // Use cases
+  h += '<div style="margin-bottom:1rem">';
+  h += '<div style="font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim);margin-bottom:0.5rem">Typische Einsatzgebiete</div>';
+  h += '<div style="display:flex;flex-direction:column;gap:0.35rem">';
+  useCases.forEach(function(uc) {
+    h += '<div style="font-size:0.8rem;color:var(--text);display:flex;align-items:center;gap:0.5rem">'
+      + '<span style="color:' + col + ';flex-shrink:0">▸</span>' + esc(uc) + '</div>';
+  });
+  h += '</div></div>';
+
+  // Notes
+  if (s.notes) {
+    h += '<div class="card" style="margin-bottom:1rem;padding:0.75rem;font-size:0.78rem;color:var(--text-dim);line-height:1.6">'
+      + '<strong style="color:var(--text)">Hinweis:</strong> ' + esc(s.notes) + '</div>';
+  }
+
+  // Action buttons
+  h += '<div style="display:flex;gap:0.5rem;flex-wrap:wrap;margin-bottom:1rem">';
+  h += '<button class="btn" style="background:' + col + ';color:#fff;font-size:0.78rem" '
+    + 'onclick="goToTab(\'transceivers\');el(\'tx-search\').value=\'' + esc(s.name || '') + '\';searchTransceivers();closePanel()">'
+    + 'Transceiver anzeigen →</button>';
+  if (s.url) {
+    h += '<a href="' + esc(s.url) + '" target="_blank" rel="noopener" class="btn" style="font-size:0.78rem;text-decoration:none">'
+      + 'Standard-Dokument ↗</a>';
+  }
+  h += '</div>';
+
+  // Load related transceivers
+  h += '<div id="std-related-tx"><div class="loading pulse" style="font-size:0.8rem">Lade passende Transceiver…</div></div>';
+
+  openPanel(h);
+
+  // Async: load matching transceivers
+  try {
+    var txData = await api('/api/transceivers?q=' + encodeURIComponent(s.name || '') + '&limit=6');
+    var txList = (txData.data || []).slice(0, 6);
+    var relEl = document.getElementById('std-related-tx');
+    if (!relEl) return;
+    if (!txList.length) { relEl.innerHTML = ''; return; }
+    var rh = '<div style="font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim);margin-bottom:0.5rem">Passende Transceiver (' + txList.length + ')</div>';
+    rh += '<div style="display:flex;flex-direction:column;gap:0.4rem">';
+    txList.forEach(function(t) {
+      rh += '<div style="background:var(--surface3);padding:0.5rem 0.75rem;border-radius:8px;cursor:pointer;display:flex;justify-content:space-between;align-items:center" '
+        + 'onclick="openTxDetail(\'' + esc(t.id) + '\')">'
+        + '<div><div style="font-size:0.8rem;font-weight:600;color:var(--text-bright)">' + esc(t.part_number || t.slug) + '</div>'
+        + '<div style="font-size:0.7rem;color:var(--text-dim)">' + esc(t.vendor_name || '') + (t.reach_label ? ' · ' + t.reach_label : '') + '</div></div>'
+        + (t.price_verified_eur ? '<span style="font-size:0.78rem;font-weight:600;color:#FF8100">€' + t.price_verified_eur + '</span>' : '')
+        + '</div>';
+    });
+    rh += '</div>';
+    relEl.innerHTML = rh;
+  } catch(e) {
+    var relEl2 = document.getElementById('std-related-tx');
+    if (relEl2) relEl2.innerHTML = '';
+  }
 }
 
 // Markdown to HTML
@@ -2848,6 +3950,18 @@ function copyBlogContent(id) {
   });
 }
 
+function copyLinkedInPost(id) {
+  api('/api/blog/' + id).then(function(data) {
+    var content = data.draft.linkedin_post || '';
+    if (!content) { showToast('No LinkedIn post', 'Regenerate to produce one', true); return; }
+    navigator.clipboard.writeText(content).then(function() {
+      showToast('Copied', 'LinkedIn post (' + content.length + ' chars) copied to clipboard');
+    }).catch(function() {
+      showToast('Error', 'Failed to copy to clipboard', true);
+    });
+  });
+}
+
 // BLOG
 function generateBlog(topic, speed) {
   el('blog-list').innerHTML = '<div class="loading pulse">Generating article...</div>';
@@ -2975,14 +4089,23 @@ async function runFinder() {
         var fullyVerified = t.fully_verified === true;
         var priceVerified = t.price_verified === true;
 
-        // Price: use verified EUR price if available
-        var displayPrice = t.price_verified_eur || t.price;
-        var displayCurrency = t.price_verified_eur ? 'EUR' : (t.currency || 'EUR');
-        var hasPrice = displayPrice != null;
-        var priceHtml = hasPrice
-          ? '<span style="color:var(--accent);font-weight:700">' + displayCurrency + ' ' + parseFloat(displayPrice).toFixed(2) + '</span>'
-            + (priceVerified ? ' <span title="Price verified from official source" style="color:#2d6a4f;font-size:0.6rem;cursor:help">✓ Verified</span>' : '')
-          : '<span style="color:var(--text-dim);font-size:0.8rem">see flexoptix.net</span>';
+        // Price: always show USD (lead) + EUR
+        var rawPrice = t.price_verified_eur || t.price;
+        var rawCur   = t.price_verified_eur ? 'EUR' : (t.currency || 'USD');
+        var hasPrice = rawPrice != null;
+        var priceHtml;
+        if (hasPrice) {
+          var pAmt = parseFloat(rawPrice);
+          var pUSD = toUSD(pAmt, rawCur);
+          var pEUR = toEUR(pAmt, rawCur);
+          priceHtml = '<span style="color:var(--accent);font-weight:700">'
+            + (pUSD !== null ? fmtUSD(pUSD) : rawCur + ' ' + pAmt.toFixed(2))
+            + '</span>'
+            + (pEUR !== null ? '<span style="color:#aaa;font-size:0.75rem;margin-left:0.3rem">/ ' + fmtEUR(pEUR) + '</span>' : '')
+            + (priceVerified ? ' <span title="Price verified from official source" style="color:#2d6a4f;font-size:0.6rem;cursor:help">✓</span>' : '');
+        } else {
+          priceHtml = '<span style="color:var(--text-dim);font-size:0.8rem">see flexoptix.net</span>';
+        }
 
         var stockHtml = t.stock === 'in_stock' ? '<span style="color:#2d6a4f;font-size:0.65rem">● In Stock</span>'
                       : t.stock === 'limited' ? '<span style="color:#e6a800;font-size:0.65rem">● Limited</span>'
@@ -3073,7 +4196,7 @@ async function loadBlogDrafts() {
     // Status badge: generating → step X/10, done → ready, published → published, review → review
     var statusLabel, statusClass;
     if (isRunning) {
-      statusLabel = p.step ? 'step ' + p.step + '/10' : 'generating…';
+      statusLabel = p.step ? 'step ' + p.step + '/' + (p.total || 14) : 'generating…';
       statusClass = 'b-yellow';
     } else if (d.status === 'published') {
       statusLabel = 'published';
@@ -3103,6 +4226,7 @@ async function loadBlogDrafts() {
       + '<span class="b b-neutral">' + esc(d.target_audience) + '</span>'
       + '<span class="b ' + gc + '">' + esc(gen || 'template') + '</span>'
       + '<span class="mono">' + esc(d.word_count) + ' words</span>'
+      + (d.linkedin_post ? '<span class="b b-blue" title="LinkedIn post ready (' + (d.linkedin_char_count || d.linkedin_post.length) + ' chars)">&#128100; LI</span>' : '')
       + '<span>' + new Date(d.created_at).toLocaleDateString() + '</span>'
       + '</div></div>';
   }).join('') || '<div class="loading">No drafts yet &mdash; click a card above to generate</div>');
@@ -3138,13 +4262,31 @@ async function openBlogDetail(id) {
       h += '</div>';
     }
 
-    // Copy button + Article section header
+    // ── Blog Article ─────────────────────────────────────
     h += '<div style="display:flex;justify-content:space-between;align-items:center;margin:1.25rem 0 0.6rem">';
-    h += '<div class="panel-section" style="margin:0;flex:1">Article</div>';
+    h += '<div class="panel-section" style="margin:0;flex:1">&#128196; Blog Article</div>';
+    h += '<span class="b b-neutral" style="font-size:0.7rem;margin-right:0.4rem">' + esc(d.word_count || 0) + ' words</span>';
     h += '<button class="btn-copy" id="copy-btn-' + esc(d.id) + '" onclick="event.stopPropagation();copyBlogContent(\'' + esc(d.id) + '\')">&#128203; Copy</button>';
     h += '</div>';
+    h += '<div style="font-size:0.85rem;color:var(--text);line-height:1.8;max-height:55vh;overflow-y:auto;background:var(--surface2);padding:1.2rem;border-radius:var(--radius-lg);border:1px solid var(--border)">' + mdToHtml(d.draft_content || '') + '</div>';
 
-    h += '<div style="font-size:0.85rem;color:var(--text);line-height:1.8;max-height:65vh;overflow-y:auto;background:var(--surface2);padding:1.2rem;border-radius:var(--radius-lg);border:1px solid var(--border)">' + mdToHtml(d.draft_content) + '</div>';
+    // ── LinkedIn Post ─────────────────────────────────────
+    h += '<div style="display:flex;justify-content:space-between;align-items:center;margin:1.5rem 0 0.6rem">';
+    h += '<div class="panel-section" style="margin:0;flex:1">&#128100; LinkedIn Post</div>';
+    if (d.linkedin_post) {
+      var liChars = (d.linkedin_char_count || d.linkedin_post.length);
+      var liColor = liChars > 2800 ? '#c1121f' : liChars > 2200 ? '#b8860b' : 'var(--green)';
+      h += '<span class="b b-neutral" style="font-size:0.7rem;color:' + liColor + ';margin-right:0.4rem">' + liChars + ' / 3000 chars</span>';
+      h += '<button class="btn-copy" onclick="event.stopPropagation();copyLinkedInPost(\'' + esc(d.id) + '\')">&#128203; Copy</button>';
+    }
+    h += '</div>';
+    if (d.linkedin_post) {
+      h += '<div style="font-size:0.85rem;color:var(--text);line-height:1.7;white-space:pre-wrap;background:var(--surface2);padding:1.2rem;border-radius:var(--radius-lg);border:1px solid var(--border)">' + esc(d.linkedin_post) + '</div>';
+    } else {
+      h += '<div style="font-size:0.8rem;color:var(--text-dim);padding:0.8rem;background:var(--surface2);border-radius:var(--radius-md);border:1px solid var(--border)">No LinkedIn post yet — regenerate to produce one.</div>';
+    }
+
+    // ── SEO / Hashtags ────────────────────────────────────
     h += '<div class="panel-section">SEO Keywords / Hashtags</div>';
     h += '<div style="display:flex;gap:0.3rem;flex-wrap:wrap">' + (d.seo_keywords || []).map(function(k) {
       var tag = '#' + k.replace(/\s+/g, '');
@@ -3198,6 +4340,9 @@ async function regenerateBlog(id) {
 // TABLE SORTING
 function makeSortable(table) {
   if (!table) return;
+  // Prevent duplicate binding — only attach listeners once per table
+  if (table.dataset.sortBound) return;
+  table.dataset.sortBound = '1';
   var headers = table.querySelectorAll('thead th');
   headers.forEach(function(th, colIdx) {
     th.addEventListener('click', function(e) {
@@ -3527,7 +4672,7 @@ loadChangelog();
 
 // ── CRAWLER INTELLIGENCE ────────────────────────────────────────────
 async function loadCrawlerStatus() {
-  var token = localStorage.getItem('tip_token') || '';
+  var token = (window.loadToken ? window.loadToken() : '') || '';
   var status = null;
   var insights = null;
   try {
@@ -3713,6 +4858,107 @@ function initSmartTooltips() {
 }
 
 document.addEventListener('DOMContentLoaded', initSmartTooltips);
+
+/* ── Proxy Network ───────────────────────────────────────────────────────── */
+var proxyNetworkLoaded = false;
+
+async function loadProxyNetwork() {
+  if (proxyNetworkLoaded) return;
+  proxyNetworkLoaded = true;
+  try {
+    var stats = await fetch('/api/proxy/stats').then(function(r) { return r.json(); });
+    if (stats.success) {
+      var n = stats.network;
+      el('pn-online').textContent     = n.onlineNodes;
+      el('pn-countries').textContent  = n.countries;
+      el('pn-gb').textContent         = n.totalGbProxied.toFixed(2) + ' GB';
+      el('pn-requests').textContent   = n.totalRequests.toLocaleString();
+    }
+  } catch (e) {
+    console.warn('[proxy] stats fetch failed:', e);
+  }
+  loadProxyNodes();
+}
+
+async function loadProxyNodes() {
+  var tbody = el('pn-node-table');
+  try {
+    // Public stats to show online nodes (admin token for full list)
+    var stats = await fetch('/api/proxy/stats').then(function(r) { return r.json(); });
+    var countries = stats.countries || [];
+
+    if (!countries.length) {
+      tbody.innerHTML = '<tr><td colspan="8" style="padding:1rem;color:var(--text-dim);text-align:center">No nodes registered yet. Be the first!</td></tr>';
+      return;
+    }
+
+    // Country table (public view — no sensitive IPs shown)
+    tbody.innerHTML = countries.map(function(c) {
+      var flag = c.country_code ? countryFlag(c.country_code) : '🌍';
+      var statusDot = Number(c.online) > 0
+        ? '<span style="color:var(--green)">&#9679;</span>'
+        : '<span style="color:var(--text-dim)">&#9675;</span>';
+      return '<tr>'
+        + '<td style="padding:0.5rem 0.75rem">' + flag + ' ' + (c.country_code || '??') + '</td>'
+        + '<td style="padding:0.5rem 0.75rem;color:var(--text-dim)">—</td>'
+        + '<td style="padding:0.5rem 0.75rem;text-align:center">' + statusDot + ' ' + c.online + ' online</td>'
+        + '<td style="padding:0.5rem 0.75rem;text-align:right;color:var(--text-dim)">—</td>'
+        + '<td style="padding:0.5rem 0.75rem;text-align:right;color:var(--text-dim)">—</td>'
+        + '<td style="padding:0.5rem 0.75rem;text-align:right">' + c.nodes + '</td>'
+        + '<td style="padding:0.5rem 0.75rem;text-align:right;color:var(--text-dim)">—</td>'
+        + '<td style="padding:0.5rem 0.75rem;text-align:right;color:var(--text-dim)">—</td>'
+        + '</tr>';
+    }).join('');
+  } catch (e) {
+    tbody.innerHTML = '<tr><td colspan="8" style="padding:1rem;color:var(--red);text-align:center">Failed to load nodes</td></tr>';
+  }
+}
+
+function countryFlag(code) {
+  if (!code || code.length !== 2) return '🌍';
+  var codePoints = code.toUpperCase().split('').map(function(c) {
+    return 0x1F1E6 - 65 + c.charCodeAt(0);
+  });
+  return String.fromCodePoint(codePoints[0], codePoints[1]);
+}
+
+async function generateProxyToken() {
+  var btn = el('pn-gen-token-btn');
+  btn.disabled = true;
+  btn.textContent = 'Generating…';
+  try {
+    var resp = await fetch('/api/proxy/register', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ name: 'Dashboard Node' })
+    }).then(function(r) { return r.json(); });
+
+    if (resp.success && resp.token) {
+      el('pn-token-val').textContent = resp.token;
+      el('pn-token-result').style.display = 'block';
+      // Update install command
+      el('pn-install-cmd').textContent = 'npx @tip/proxy-agent start --token ' + resp.token;
+      btn.textContent = 'Token Generated!';
+      proxyNetworkLoaded = false;
+      setTimeout(function() { loadProxyNetwork(); }, 500);
+    } else {
+      btn.textContent = 'Failed — retry?';
+      btn.disabled = false;
+    }
+  } catch (e) {
+    btn.textContent = 'Error — retry?';
+    btn.disabled = false;
+  }
+}
+
+function copyInstallCmd(el) {
+  var text = document.getElementById('pn-install-cmd').textContent;
+  navigator.clipboard.writeText(text).then(function() {
+    var orig = el.style.borderColor;
+    el.style.borderColor = 'var(--accent)';
+    setTimeout(function() { el.style.borderColor = orig; }, 1000);
+  }).catch(function() {});
+}
 </script>
 <script src="/dashboard/hot-topics.js"></script>
 </body>