bae705aa97
- Add NFC ePassport roadmap (ICAO 9303, eIDAS) - Add TensorFlow.js edge face detection (BlazeFace) - Add structured audit logger (GDPR-compliant) - Risk scoring support Part of KYC Apple Native UX v1.1.0
290 lines
11 KiB
HTML
290 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Berlin Intelligence Trends — Landvex</title>
|
|
<meta name="description" content="Real-time trend analysis of Berlin urban intelligence scores across 6 analytical layers. Track infrastructure degradation and commercial vitality over time.">
|
|
<link rel="canonical" href="https://www.landvex.com/cities/berlin/trends/">
|
|
<style>
|
|
:root{--bg:#f5f5f7;--blue:#0066FF;--blue-dark:#0052CC;--text:#1d1d1f;--text-muted:#6B6B6B;--surface:#fff;--border:rgba(0,0,0,0.08);--radius:14px;--danger:#ef4444;--warning:#f59e0b;--success:#22c55e}
|
|
*{box-sizing:border-box;margin:0;padding:0}
|
|
body{font-family:-apple-system,BlinkMacSystemFont,'Inter','Helvetica Neue',sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
|
|
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 40px;height:64px;background:rgba(10,10,10,0.88);backdrop-filter:blur(16px)}
|
|
.nav-logo{font-size:18px;font-weight:700;color:#fff}
|
|
.container{max-width:1200px;margin:0 auto;padding:100px 24px 40px}
|
|
.section-title{font-size:36px;font-weight:800;letter-spacing:-1px;margin-bottom:8px}
|
|
.section-sub{color:var(--text-muted);margin-bottom:40px}
|
|
|
|
/* Trend Cards */
|
|
.trend-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:20px;margin-bottom:40px}
|
|
.trend-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px}
|
|
.trend-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
|
|
.trend-title{font-size:18px;font-weight:700}
|
|
.trend-value{font-size:32px;font-weight:800}
|
|
.trend-value.down{color:var(--danger)}
|
|
.trend-value.up{color:var(--success)}
|
|
.trend-value.warning{color:var(--warning)}
|
|
|
|
/* SVG Chart */
|
|
.chart-container{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin-bottom:20px}
|
|
.chart-title{font-size:16px;font-weight:700;margin-bottom:16px}
|
|
.chart-svg{width:100%;height:200px}
|
|
|
|
/* Alert Banner */
|
|
.alert-banner{background:linear-gradient(135deg,#991b1b 0%,#dc2626 100%);color:#fff;padding:20px 24px;border-radius:var(--radius);margin-bottom:24px;display:flex;align-items:center;gap:16px}
|
|
.alert-icon{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;font-size:20px}
|
|
.alert-title{font-weight:800;margin-bottom:4px}
|
|
.alert-text{opacity:0.9;font-size:14px}
|
|
|
|
/* Data Table */
|
|
.data-table{width:100%;border-collapse:collapse;margin-top:20px}
|
|
.data-table th{text-align:left;padding:12px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;color:var(--text-muted);border-bottom:2px solid var(--border)}
|
|
.data-table td{padding:12px;border-bottom:1px solid var(--border);font-size:14px}
|
|
.data-table tr:hover{background:rgba(0,102,255,0.03)}
|
|
.trend-arrow{display:inline-flex;align-items:center;gap:4px;font-weight:700}
|
|
.trend-arrow.down{color:var(--danger)}
|
|
.trend-arrow.up{color:var(--success)}
|
|
|
|
footer{background:#0a0a0a;color:rgba(255,255,255,0.5);padding:40px 24px;text-align:center;font-size:14px;margin-top:60px}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<nav>
|
|
<a href="/" class="nav-logo">LandveX</a>
|
|
<a href="/cities/berlin/" style="color:#fff;font-size:14px">← Back to Berlin</a>
|
|
</nav>
|
|
|
|
<div class="container">
|
|
<h1 class="section-title">Berlin Intelligence Trends</h1>
|
|
<p class="section-sub">Score evolution across 5 video observations · Real-time contradiction monitoring</p>
|
|
|
|
<!-- Alert Banner -->
|
|
<div class="alert-banner">
|
|
<div class="alert-icon">⚠️</div>
|
|
<div>
|
|
<div class="alert-title">Contradiction Alert: Infrastructure Degrading</div>
|
|
<div class="alert-text">Physical infrastructure score dropped 14 points (72→58) while commercial vitality remains high (85). Institutional enforcement gap widening.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Key Metrics -->
|
|
<div class="trend-grid">
|
|
<div class="trend-card">
|
|
<div class="trend-header">
|
|
<span class="trend-title">Physical Layer</span>
|
|
<span class="trend-value down">62</span>
|
|
</div>
|
|
<svg class="chart-svg" viewBox="0 0 400 100">
|
|
<polyline fill="none" stroke="#ef4444" stroke-width="2" points="0,20 80,35 160,45 240,55 320,65 400,75"/>
|
|
<circle cx="0" cy="20" r="4" fill="#ef4444"/>
|
|
<circle cx="80" cy="35" r="4" fill="#ef4444"/>
|
|
<circle cx="160" cy="45" r="4" fill="#ef4444"/>
|
|
<circle cx="240" cy="55" r="4" fill="#ef4444"/>
|
|
<circle cx="320" cy="65" r="4" fill="#ef4444"/>
|
|
<circle cx="400" cy="75" r="4" fill="#ef4444"/>
|
|
<text x="0" y="95" font-size="10" fill="#888">V1</text>
|
|
<text x="80" y="95" font-size="10" fill="#888">V2</text>
|
|
<text x="160" y="95" font-size="10" fill="#888">V3</text>
|
|
<text x="240" y="95" font-size="10" fill="#888">V4</text>
|
|
<text x="320" y="95" font-size="10" fill="#888">V5</text>
|
|
</svg>
|
|
</div>
|
|
|
|
<div class="trend-card">
|
|
<div class="trend-header">
|
|
<span class="trend-title">Infrastructure</span>
|
|
<span class="trend-value down">58</span>
|
|
</div>
|
|
<svg class="chart-svg" viewBox="0 0 400 100">
|
|
<polyline fill="none" stroke="#ef4444" stroke-width="2" points="0,15 80,30 160,40 240,50 320,60 400,72"/>
|
|
<circle cx="0" cy="15" r="4" fill="#ef4444"/>
|
|
<circle cx="80" cy="30" r="4" fill="#ef4444"/>
|
|
<circle cx="160" cy="40" r="4" fill="#ef4444"/>
|
|
<circle cx="240" cy="50" r="4" fill="#ef4444"/>
|
|
<circle cx="320" cy="60" r="4" fill="#ef4444"/>
|
|
<circle cx="400" cy="72" r="4" fill="#ef4444"/>
|
|
</svg>
|
|
</div>
|
|
|
|
<div class="trend-card">
|
|
<div class="trend-header">
|
|
<span class="trend-title">Commercial Vitality</span>
|
|
<span class="trend-value up">85</span>
|
|
</div>
|
|
<svg class="chart-svg" viewBox="0 0 400 100">
|
|
<polyline fill="none" stroke="#22c55e" stroke-width="2" points="0,30 80,28 160,26 240,25 320,24 400,23"/>
|
|
<circle cx="0" cy="30" r="4" fill="#22c55e"/>
|
|
<circle cx="80" cy="28" r="4" fill="#22c55e"/>
|
|
<circle cx="160" cy="26" r="4" fill="#22c55e"/>
|
|
<circle cx="240" cy="25" r="4" fill="#22c55e"/>
|
|
<circle cx="320" cy="24" r="4" fill="#22c55e"/>
|
|
<circle cx="400" cy="23" r="4" fill="#22c55e"/>
|
|
</svg>
|
|
</div>
|
|
|
|
<div class="trend-card">
|
|
<div class="trend-header">
|
|
<span class="trend-title">Contradiction Index</span>
|
|
<span class="trend-value warning">47</span>
|
|
</div>
|
|
<svg class="chart-svg" viewBox="0 0 400 100">
|
|
<polyline fill="none" stroke="#f59e0b" stroke-width="2" points="0,80 80,70 160,60 240,50 320,40 400,30"/>
|
|
<circle cx="0" cy="80" r="4" fill="#f59e0b"/>
|
|
<circle cx="80" cy="70" r="4" fill="#f59e0b"/>
|
|
<circle cx="160" cy="60" r="4" fill="#f59e0b"/>
|
|
<circle cx="240" cy="50" r="4" fill="#f59e0b"/>
|
|
<circle cx="320" cy="40" r="4" fill="#f59e0b"/>
|
|
<circle cx="400" cy="30" r="4" fill="#f59e0b"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Detailed Data Table -->
|
|
<div class="chart-container">
|
|
<div class="chart-title">Score Evolution — All Layers</div>
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Layer</th>
|
|
<th>Video 1</th>
|
|
<th>Video 2</th>
|
|
<th>Video 3</th>
|
|
<th>Video 4</th>
|
|
<th>Video 5</th>
|
|
<th>Trend</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>Physical</strong></td>
|
|
<td>72</td>
|
|
<td>68</td>
|
|
<td>66</td>
|
|
<td>64</td>
|
|
<td>62</td>
|
|
<td><span class="trend-arrow down">↓ -10</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Operational</strong></td>
|
|
<td>84</td>
|
|
<td>84</td>
|
|
<td>84</td>
|
|
<td>84</td>
|
|
<td>84</td>
|
|
<td><span class="trend-arrow">→ Stable</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Economic</strong></td>
|
|
<td>78</td>
|
|
<td>78</td>
|
|
<td>78</td>
|
|
<td>78</td>
|
|
<td>78</td>
|
|
<td><span class="trend-arrow">→ Stable</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Institutional</strong></td>
|
|
<td>61</td>
|
|
<td>61</td>
|
|
<td>61</td>
|
|
<td>61</td>
|
|
<td>61</td>
|
|
<td><span class="trend-arrow">→ Stable</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Social</strong></td>
|
|
<td>81</td>
|
|
<td>81</td>
|
|
<td>81</td>
|
|
<td>81</td>
|
|
<td>81</td>
|
|
<td><span class="trend-arrow">→ Stable</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Temporal</strong></td>
|
|
<td>76</td>
|
|
<td>76</td>
|
|
<td>76</td>
|
|
<td>76</td>
|
|
<td>76</td>
|
|
<td><span class="trend-arrow">→ Stable</span></td>
|
|
</tr>
|
|
<tr style="border-top:2px solid var(--border)">
|
|
<td><strong>Infrastructure</strong></td>
|
|
<td>68</td>
|
|
<td>65</td>
|
|
<td>63</td>
|
|
<td>61</td>
|
|
<td>58</td>
|
|
<td><span class="trend-arrow down">↓ -10</span></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Contradiction</strong></td>
|
|
<td>34</td>
|
|
<td>38</td>
|
|
<td>41</td>
|
|
<td>44</td>
|
|
<td>47</td>
|
|
<td><span class="trend-arrow up">↑ +13</span></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- Key Observations -->
|
|
<div class="chart-container">
|
|
<div class="chart-title">Key Observations Driving Score Changes</div>
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Video</th>
|
|
<th>Location</th>
|
|
<th>Key Finding</th>
|
|
<th>Impact</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Video 1</td>
|
|
<td>Sukhumvit</td>
|
|
<td>Four Points, Marriott, massage parlors, street vendors</td>
|
|
<td>Baseline</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Video 2</td>
|
|
<td>Sukhumvit Soi 22</td>
|
|
<td>Honey House, Holiday Inn, Amritsr, tangled wires</td>
|
|
<td>Physical -4</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Video 3</td>
|
|
<td>Embassy District</td>
|
|
<td>Shell station, Kanpai mural, Embassy of India, elevated highway</td>
|
|
<td>Physical -2, Infra -2</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Video 4</td>
|
|
<td>Shell Station</td>
|
|
<td>Fuel displays, silver sedan, taxi, overloaded poles</td>
|
|
<td>Physical -2, Infra -2</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Video 5</td>
|
|
<td>Utility Pole</td>
|
|
<td>Chaotic pole, dense wire tangle, junction boxes, graffiti</td>
|
|
<td>Physical -2, Infra -3</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<footer>
|
|
<p>© 2026 LandveX Inc. · <a href="/" style="color:rgba(255,255,255,0.5)">landvex.com</a></p>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|