Files
openpilot/docs/prototypes/c3xl-navigation.html
lochuan e093d74e0a openpilot v2026.003.000 lean release (device-built, flat)
date: 2026-10-25T03:40:59
source commit: c3xl-lean@b13531ea3f789dc796a77901d5ff912baa85a1ac
built on: comma device
2026-10-25 03:40:59 +00:00

175 lines
36 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="zh-CN">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>C3XL 导航指引卡 · 2160×1080 原型</title>
<style>
:root { color-scheme: dark; font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif; color: #edf1f4; background: #101316; }
* { box-sizing: border-box; }
body { margin: 0; padding: 40px 24px; }
main { max-width: 1120px; margin: auto; }
.eyebrow { color: #80d8a6; font-size: 12px; letter-spacing: .16em; }
h1 { margin: 12px 0; font-size: 28px; font-weight: 600; letter-spacing: -.04em; }
.intro, #description { color: #a2afb9; font-size: 14px; line-height: 1.8; }
.intro { margin: 0 0 24px; }
.preview { border: 1px solid #2b3136; border-radius: 16px; overflow: hidden; background: #000; }
.viewport { position: relative; width: 100%; aspect-ratio: 2 / 1; }
.screen { position: absolute; width: 2160px; height: 1080px; transform-origin: top left; overflow: hidden; background: #000; }
.content { position: absolute; inset: 30px; overflow: hidden; border-radius: 60px; background: #58676c; }
.road { display: block; width: 2100px; height: 1020px; }
.shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, #0007, transparent 300px), linear-gradient(0deg, #000b, transparent 45%); }
.border { position: absolute; inset: 30px; border: 30px solid #167f40; border-radius: 60px; pointer-events: none; }
.set-speed { position: absolute; left: 46px; top: 45px; width: 200px; height: 204px; border: 6px solid #ffffff4b; border-radius: 35px; background: #000a; text-align: center; }
.set-speed span { position: absolute; top: 21px; left: 0; right: 0; font-size: 40px; font-weight: 600; line-height: 1; color: #80d8a6; }
.set-speed strong { position: absolute; top: 71px; left: 0; right: 0; font-size: 90px; line-height: 1; font-weight: 700; }
.current-speed { position: absolute; top: 62px; left: 50%; transform: translateX(-50%); font-size: 176px; line-height: 1; font-weight: 700; }
.speed-unit { position: absolute; top: 227px; left: 50%; transform: translateX(-50%); font-size: 66px; line-height: 1; font-weight: 500; color: #ffffffc8; }
.mode { position: absolute; left: 270px; top: 51px; width: 192px; height: 192px; display: grid; place-items: center; background: #000a; border-radius: 50%; }
.mode img { width: 144px; height: 144px; }
.npu { position: absolute; right: 42px; bottom: 28px; width: 108px; height: 80px; }
.nav-status { position: absolute; right: 60px; bottom: 126px; width: 72px; height: 72px; color: #9be6b9; }
.nav-status.lost { color: #6e767d; }
.nav-card { position: absolute; right: 42px; top: 30px; width: 540px; height: 250px; padding: 24px; border: 2px solid #ffffff24; border-radius: 32px; background: rgba(7, 13, 18, .9); }
.nav-primary { display: flex; align-items: center; height: 116px; gap: 24px; }
.maneuver { flex: 0 0 110px; height: 110px; color: #9be6b9; }
.distance { font-size: 76px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.distance small { font-size: 52px; font-weight: 500; }
.nav-summary { position: absolute; left: 24px; right: 24px; top: 170px; display: flex; gap: 16px; }
.nav-summary span { height: 56px; display: flex; align-items: center; padding: 0 14px; border-radius: 14px; background: #ffffff17; font-size: 44px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.remaining-time { color: #9be6b9; }
.remaining-distance { color: #a2afb9; }
.nav-card.short { height: 150px; }
.nav-card.short .nav-primary { height: 98px; }
.phrase { font-size: 56px; font-weight: 650; color: #a2afb9; white-space: nowrap; }
.nav-card.lost .phrase { color: #d25a5a; }
.nav-card.arrived .phrase { color: #fff; }
.alert { position: absolute; left: 40px; right: 40px; bottom: 40px; height: 300px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; border-radius: 30px; background: #da6f25f1; }
.alert strong { font-size: 88px; font-weight: 700; line-height: 1.2; }
.alert span { font-size: 66px; }
[hidden] { display: none !important; }
.caption { margin: 12px 0 24px; text-align: center; font-size: 12px; color: #83909a; line-height: 1.8; }
.controls { display: flex; flex-wrap: wrap; gap: 8px; }
button { min-height: 44px; padding: 10px 15px; border: 1px solid #3a454d; border-radius: 9px; background: #1b2126; color: #dce4e9; font: inherit; font-size: 14px; cursor: pointer; }
button:hover { background: #29333b; }
button[aria-pressed="true"] { color: #9be6b9; border-color: #9be6b9; background: #20352a; }
button:focus-visible { outline: 3px solid #9be6b9; outline-offset: 3px; }
#description { min-height: 50px; margin: 18px 0 20px; }
details { padding-top: 18px; border-top: 1px solid #2b3136; color: #83909a; font-size: 12px; }
summary { cursor: pointer; width: fit-content; padding: 6px 0; }
pre { overflow-x: auto; padding: 16px; border-radius: 8px; background: #090d10; line-height: 1.7; color: #a2afb9; }
.footnote { margin-top: 20px; font-size: 12px; color: #83909a; }
@media (max-width: 600px) { body { padding: 24px 12px; } h1 { font-size: 24px; } }
</style>
<main>
<div class="eyebrow">C3XL / ON-ROAD</div>
<h1>导航指引,融入现有行车画面。</h1>
<p class="intro">保留 C3XL 行车 HUD,导航状态紧挨 NPU 上方,路线指引单独成卡。</p>
<div class="preview">
<div class="viewport" id="viewport">
<div class="screen" id="screen" role="img" aria-label="C3XL 2160×1080 行车界面,导航状态位于右下 NPU 上方">
<div class="content" id="content">
<svg class="road" viewBox="0 0 2100 1020" aria-hidden="true">
<defs>
<linearGradient id="sky" x2="0" y2="1"><stop stop-color="#53636d"/><stop offset="1" stop-color="#a0a9aa"/></linearGradient>
<linearGradient id="asphalt" x2="0" y2="1"><stop stop-color="#646967"/><stop offset="1" stop-color="#303839"/></linearGradient>
<linearGradient id="path" x2="0" y2="1"><stop stop-color="#80d8a6" stop-opacity=".12"/><stop offset="1" stop-color="#66d79a" stop-opacity=".6"/></linearGradient>
</defs>
<path fill="url(#sky)" d="M0 0H2100V1020H0z"/>
<path fill="#596259" d="M0 450L180 365L410 440L700 390L950 455L1200 415L1500 450L1790 360L2100 435V1020H0z"/>
<path fill="url(#asphalt)" d="M970 450H1130L2100 1020H0z"/>
<path fill="url(#path)" d="M1032 457H1068L1370 1020H710z"/>
<path d="M970 467L220 1020M1130 467L1900 1020" stroke="#dce0cc" stroke-width="8" opacity=".8"/>
<path d="M1030 475L850 1020M1075 475L1250 1020" stroke="#e2e5d8" stroke-width="8" stroke-dasharray="55 65" opacity=".65"/>
</svg>
<div class="shade"></div>
<div class="set-speed" aria-hidden="true"><span>MAX</span><strong>80</strong></div>
<div class="current-speed" aria-hidden="true">72</div>
<div class="speed-unit" aria-hidden="true">km/h</div>
<div class="mode" id="mode" aria-hidden="true"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQoAAAEKCAYAAAGdzCtfAAAAAXNSR0IArs4c6QAAQABJREFUeAHtnQcY5US59xGWhV1677IrSwcpKh0FxHIVEUHKpeoVUFFELnARAZVPEVSUqldQWKRYEBAEr4JI7yLSO+zSZSnSO+z3+589OeTkTJKZZJKT5OR9nvckmXn7vGeSTGaSmWbKAdOnT98NfAh8Ajwwh6iZ3uXCjLLpLvTvAmzprQhdDYgqdzEoyts5xoCbZEQE3jQShwqhvybC0zkMkQzsxkZEnGHqrF7Zypk5rCzYt2UO6JO2XQdeCmiisoPyga0IQ7DIAEGOgpDcvmgPiITw/hDxnAMEHgpC8uONCRG94EGnUQQ6Dgr0hAl6yarKoCJrYgb8aVuTroFktTECQftJWAwcl2aISUcnIhIYMJuIgrowXVCWtLWVJbpoRJYyCQ48N9UllSXxRY3si0i00jUCSUapLk6+yvsMSRMUrQ/4g/Ichn9+Zpj3CgS5bKNGiNdUZilz8rsw5DGIF7Nk6JElKc0SmWiy9hSVvSNDflS2UpO+XMnaFXga2x3BmWmuTn+UoWlO7MgSYwhW7yqYKVSWuhvi+X0ccUCjbZimVx4q/FKvsLsTqkvcDfjiiIL68Dag7ZUFBdr2Crs7FI0N18fsf0vk1IUvI8KkVxrk9ur76oLSvsLuQVAXs31eZNStEFM/4FyXvkPeVfHO7YRKe4VkXbAfbMP1QVnQl5jqojTBsbZh+kBGrx8JCrqEC4YZtR+uD44lUBClDY6jPEF5sA3X93keFhomChi1DdOEy6P7Nvxhmj5DoorChGFFacbY8EVpek0TKAoTSCHwxaAu2IZpgrLQ9qOh/d6uBAUHJv6BiATEYUaVhZmjdQFPsE2iDdcF9NrGGqLKNIWicYE4IyQj0ZBASV6DkgwIdFgZEhC7GmRjQCA78xaj9pFhETgqs8A8jBjxR/AN8DrQ631yrF0ocoGtYgW5VqB1exfNBtrn0nQmJqgERgXYJJ0r30BPGiiNCpJyQVCftJ1B2U8recA6SXx9dTPoZ/z2VWQ8CMtj/6SomAHPxBAQ2Xoe0Cdtw3KhG4/sVwL6PiPChD4NCJTFye8ZEUcQCPC1NekZSMwiIhB2wCR/jAjC1oUZ4vaT6E1KkuSIvtMcgdDg2MQEzVuUD0TORBuUpcjr/AFEo2GGcQGTaUv9s10jnQyQLPEJTHKDMqrvl+CXg4LwlsotugLmCZdn2Zcc4IYY3vdonCPR0hjGvkvAgCarLOcQdxXOFigOb5NyIEwX3c9kBMpejwrKc5zJiDwKTbyZjMja9iYDVJbJCDHKEGAq+Lp2VJYVBv4d4eRyER7wJfDMDU3nKUWURpFYOvAgEBQcs7V93HmfeBC+eIi3bzcwQIVRPanddtTqPsndg0BoHG1QH+YNaFXXlxNBRZjYJMBUb+Lt0s0aptc+tP8Kl3WMSFMEg0aPo3BnwJdggEJvenwa3KN0nlb0RUJaTAIRtETUAo5PFa3AUNcpCowM14fpqX8kXNfZ70js/gxUUkDVn8I0Sfsx/D0WU32vrEfFTq8wshOmie5HSHuHEbqTexWmHYi/FWaIoQmT9O3b0JtoBsqQukmf5OnTzw8TRer6DiN07+6rnD796XB9sN+72g4KwlsJCB/n2TclaSAv0QgR+TAkyQDpGPiLqjAMEiCg7Ilwuc3+DM7+e1ITX2okTEwqI0K6Nu27SO4aG8cy3HIMfkXNmhPWL9qL1LRwMQBn9zY5jIzZXeTE0F5pkG3818fwF19sMDCtSBeFX0iyjPpNwXvSBBnqjaPuSbrCdZn+qzIiLCRmfy7+uy/G1OUqttGfpd9w+psELRHjydJBb9ndFhII6Q7r4dDoQ2Ar20Nj7M1WHBIc3T0mm8RiuDDuPVEDQ8ebpGlN/JtIUIyA3qP+mPqhF8fZnvT3MaaYPIkRtkU3ReOCNPQgBAZ0nR4bHAdb+QXYPTWC8IAOeeQnEFbHbcSV3mGiL1Ad0aN8Z+eNRKaclahZHlwVXDmnqER25P8UHAAjE1TjBigjN/hGxoRC5PXd6xnkuxZdkqAutQplOxkU3hEw9jpQEQWFwTapswlowltEvM1xT2a4rqj9DDZqMKZvKl8go9OBZg0EfMeIN4CyA6EAB7q7296UcdWZAMcHBgDFK9rYs0lUEPRzdBX2NtDsGaVzON5MLRIF+Pd3kBElHd8z7p2dBaJEHPcm7YXrNParwUCv4/thBdF9OR8tizuWP3F1BZRPU2ZcWIBgo0iXQEhAl76shlpYmeH8aNLoqUWhazACkWVliDIj1+kqMNhmi1O72NANi0aZoYeSr5ZpgGuGlJUZnc6sLGU2ATcFqiT7Zu7MvYgz0mRYmLYMIzPoWAy7+x6N2dgMz/ROMOS0Qel+YSGm/Rg+E6lVmeSFCQ02hasH9qP8AwQUxNg8QbQ95Sheg+MbVRiC+WB+NnRs3HU12iDkbfTMEpQjTyPhVwbHNlubQEiOyVYjL4R3iTgCa9sYA8/SET6bw1XDsmE41oYpQvNoWEbSfoSvcxim72VGUAiFHuIvExx3t68TPeNUmAidMfJhmmgroE/zPucO09juR2XF8aFDl9//jNZH+QeCIQaY1WK3pDFH68PHyCjsUjrqRFhvdD/ODpMM440ahLeaiCVYEFVoOhZ/AKb6DGUbucjDzBdibJ1FcjLo72TJihJqAleBJhkWZXe66EmQ11mT5CIrlhYlRycoSs0WeCcl8SfUpd6owftoAn+qbbFOp1WgdPYkxd26CwI5HFtPakmR21taCd3KKbSq/t/ABttttv9OVzoKf8lu4nNTW0M80b1Fd5B4VZ2kJ1cwooLVHNGyEo57Ewbz6vIaDJMxxOfflM9rqstQNi8tn7oeJYPc4bEQoDVAPaO5XcECNZnlPvAU0N9KoOG5OKgZx/YF88L1g5JrUILXvXmYeSNg4NfwpHfw2k/IaO8WJgtMHK9IZu2v9RKIIQSg34uZZpqNjjT1YizKFD423oeECZL2CcA/MgThj8iciOFGoE7PbH6QpNdQ91oGOwxiMhRJsSXskUF8Hwt6lrLUJbL1+piLOkDRLtKWAr2n177tQO9hKbpVXehUCY1jPJxixLm+HY+Thx2fSLHFqeO27iylNM4olesPn1RfVB1mDUwfCOuytcvK+JQgLICyZ8LKh7GfZKNNMFIDgYLXcGxg8pectVFQZlDyBCPx9IlgPQqoRRBCDWN89JkUpMTGgnFxMZsgkbECldj8pMluyh6KMy/2ryFBJqaq/R1MNqoM87W40fQuyHH4MJA1xkDUPQhBcFz8GOgjYDbOp6xLJgRB0DbOZnw0rowP83aeZimSEdigj6hmBxFfOoeJLkBxnDNTosRqVOLT1DS/+voIEUdNj0uvKF2WY9Tpabn+ipoA+zC6ChuTtPYNwp1FHAGnp09JwUDuMxHZtoeZHiJHbUHZ1iaFAV0vI0QUFAbbvNlgkhnIzridA5vSO7oY4SZ7Ah8HzhohGabF5aFq8y7K1pdCgZkiV+lLMyRPPyGjlKOifMjbrlfGgYbV+6BXabkDc+xD5D7Bfg9+Z2lej8ykXpWdv4Yqe5TdnSBlouXRY1hLn9oYtYHj3bBXjyJTIc7XuEA8jeCBl2FGtZiERmlKPk59DIjNK2BT9CQwRrPvtL67rwNKy4YKBqAv3hnsn6LO8rI+KTEHOH+4AiCIIXEqlrEmcBISQzzDys7vL2JIosUTTfMxo0S+jycQgAeThOLCktQ/nETjuy7p9Olbl+R9OC0IIoLmETZzaL8sKDUj9FdwcYzM0NsI5nfhyUpbZkZ03n7tYihxMy1rchFhTVtaRrhmQ+CBurxgv8htmRmR1Y+zszK68JWWERh1CVmxiYtxoiUhdKue6b7HRVeZgYgdOkszuIy/R6l/DRwq9dogLcDh+lIzoqvY6j4mbGQZGZF5ombYUMf9BUKOnQKvTpGfDGREzy7Q/jSoK3KrjLgdBSsVqcRFtiEQpZ0+P5hkqAyLAvSa/lNZiNqrY4y9KNVgpaoB9MgsFqB/1cCTt+jjYYUI00s8nCDMH91H0EYxwj7ZufZXZZSpG8Vocd+xia+PwPEgqtNVfpTfpN4kU3zB6TOx9U0Cu2VrJtS5Vj0VZsDgTcPHFvtZfeiI7t0NGiK1AYG6Ks0AA18ai7E+2pqucqP8RiUUGuT+Hd61kgJhfSVoEB5nh7E86kQGeTsg49dG4aFC5OoNbX3jHIHu4K8hcp3T+wBG0/yCPpruwVRToU1ZYEhAmyEIarDUIHTl9wUh0KltLyN0YDIiaqjoTGDiNdGFy6KyfcgIyw/vx8juvdAwnBHiezzMrH0EHBAtMx1HnTLRBGWiFQTH6NguxtCAJG6ba1EMJsS/zFAGRSHOimg5fPpGQiKEeSCcmEicXGl96R0jJnkIEKaTTIxhB5L24e3cS5hkdMt0Wa+PCeUB64UsKHncpCjJh16diZGyvvN8j9iwA+2YGBk+io8zqDQWoWwZk0IjcVyhSQBlP46jN5XHyMhT7PTVjxhFk022xpYh5NwYQR+LZTJUICPLe3MHVBtEJxYNCOgWJDLFVcYJo/zQOB5TOfSdAaAEeUlVV5tkJpXFCUvi6Z3C4ogkNKbuIU4/S8fUDRQnyBmgDReET7PhctM+OozvkhBtmpzUQEhIkhNpCsQvSJIxg8L86yD/JSSMN0mxkRG9oDLJSYymHAS+YGQsqVAGoMoYBMr1OCAVrDIikNJVGBwObOMiD995EG82wGBZkCA37m/bkRzHZ1LrFAgJSAuGaMIG2NCLJw0iMlPf0RemT5Otequ/RlhQV8E3w2XRfTkfQLQu63EgT1tkJNn9qmsQZJNzRoQd6RoVLhr2fuZ5mEmRTXWqG/neM4lUhuIIrpUtQN9csOLUJUgmO7K8dEtJlQeGvqguNiR4lfVFOy4B+Z9YA6pYgWefd/EuhdZqQmkV4zBgE45qwdyfUhxW9U3gBgMC2gK3CBDE7UGbgEOWGbSS8EjwvW7WtdSFRICGmAc8H6wyvI1xXy8kAAULzXV9WbBtHfEEVl3nJeAwprYU4eKlCN2US8BCXh3kw+DKJQVJsD+OHe7DuZrI0DptfU5rWlXsHXpSkARLEoyHwKHbUpFGuZAEcXpqUBG785lBImwMFgWXI3iLfBbacaNnTvDb4ItgEfCEnSU1pSJi83mMmi7itq9yKLBvHTDuXSdZQpE6savK8eizDe+vzBKBCM+RfUJreoBPX4z4lfXw3bUMAd6+nNVj+G6tpdOORuPnL3PESKw7OKosnxwjZ83h5FnlW1wdjcRtkxyxK2VJnHO0MjoU+/UdZwMaxEAse6v0HeO6ZyXCgNHTHA0XeTs0bNF6xClrzzvRQrx/EgzeU63rCLP7t2Q0JBJn4+TapPiXGpkkQ2LqrKY7lepETZURX32bwQX2LdRVLNnaxRpoFy/UoBEW7tgOemugf8CIKQ6GnO/fglZiNAK0x6oObSJSq4eKVs8bJC1qUNwx4/ZWMuP423L3CNA8Lt9GWp8mcl4Y0GeVEsIS7uhjbA9KjQBt9CnLdhLZfpmNc1DyicxKWkavEXBoswOdFTsIT1546azZLwN+bAZOBp8G88KlCNgD1AeGKgsOTm5t7YSDUKsLF2vFGQixVY+vT3OwuUjS2xC+agY3vLM4OLlQVPnARSHCroRo/Sih4Tj19bQGnlxF2KZe6XZw0VyCymfekYu708tWq8Sw0Rm9Oehb+oKM5RBikxCfQVCut8LYGIs9mpPQA3ieBuuWEHI12pOdosKiIdrYcfoIcN+Sob6kgOnuOMZQudYenRM69raLcUuCvfcyIPgab8KrJWinXqbP2DmxQPPWsZA9DjM2D+h6pw8Kj6Xwq0FF3NY2++L4o+XovZ6yD0TLR/x4NeJ8i68YEOPbkLVymrygbcM9RWpCIDT3pA4M3BHsATLbhBhsrZt7AeJVHoPVbiU09io2HOjcQ3SdpODgazZMCLd9jVZPHLL7VpdScWqvcrg7+j6D5nnOrn9IABxrdrnu4fvOsxwPC5YNJYh27wedXljTNdxmIs5PRds5fUiTpcfXQncD+CSohJoLXAF8H7gIWGU4hIb/TlYDCdHx8O6elb8kvofQcx14H/gsOBZcGFwNXBe0GV8Z75oUyK0dLEQyPOXLapJDYzNv+JJXQTm/1yvrNq2gYT5MeqB7SvCWEDIKmW9KLrtVeAuFjzhFZWytU8BW0dIGHL9Nuy1TpB/I/z/k6/TZOFBSbNw4r2aaqZTJPSTGi8Rup6bFTy/rk2NzNMkxGqtzrVSWT8TQ9kK9LJNy6VFPUcxUrVxm5WOmjcpeoJv4rYd83pTPrZ5CgyPLlq+6WI1tb5E9vuop/padvbqcTevSy4y0kuKsMhWWqUuJAVxRps4m6JqZbvaiJjiS4MMGM3Kj83taAl2nCqqFwHO6PFbXW9BqRLcpMGUURjRzNZbNtQlJ0aQ7uC11+hAcPGOT63dnBdAESNXY+1u5pFeUmYSYD9PKuqU/E11jYmKsJZm5Z3ch+w+9+3l1l45xfwYBCzjy6H3eOl192JVvSPTT8DHxQV+GuGVxZRbssDqVBcKxS48v/hocW26vQM8Hg55CPNYXnDAKnBNCSuCTsbNov+qArWkJ8VrBPvxCgQacEkI2wXORGNn9ra2NkHfGW3o9hRgts35+mLUiKTdY6sutJ6OAcfip1xkaAds132KcsdJP4Zro/6cPUZZxPg99nSl54Z5C+m3eKveMD0MlAyOUlM/7kudLjuwCkhJCp9oiE0ITf3wlhCYSpQL6Ogkhwr6koOJcyjQ5IxHIPG8XjeicB2VVuS2+H3v6es9wIPD7W5b/ujCb0770A15OS9g6CeU2F5/vDhtpDICl449g/FJhYXn20am5mprEOwx4C1/GxCnGtgWp02yzIuFlbPB2F4PNmmX1uoXBR6F37zBdX08RVEBkTJagvrvVdHxv8xhRqY/j2uiNmJHr8BzpBIwJgX8fAXWqKDohdscGnwmxNDbbJIS++taXEInRJBZaC2AFiYIyVKL0RCvF2Yg0OSYREPtKNtHuXImGZKjEAn3WwgZiT1GJ/0wka0DkFUvbNGTuOtaRKFqeJRLYVepOSfM0Y6+DULM8NHfZifNG9UlsSk1QF234cTH0G1vwvITuOePojKePgBhGl++R6dXIxwS8PrboV9KOzyMLEbqF7ksI7Pwm2APkl5kQuvUT+E4I/YFsEuJedMcmhFOsexG02HESbEmMWp/v9rbwwjvJBZauOpFh5e4Olh5hIzzx9BEVgPJ7KdNtjg1cQ0auZ0PoSoMdGkOYzZVvSPR6JnSqb93EwOXULvXzYUfqcIMInZJCDBizAps7tW8Jn8aYP1rSOpFhy0dguNCJqRziR/F5yaJU4bdOh4mn/pBuLUnQ7WnxgGGuL2TftUirsGcNcJjgbUFwXJxw7k1HB9ePk1VYOQbO62ikyG1G2DLbjPwsbwLO4MY7LJmNtWBEy5h3NFnvTbEQXSwJpm5ubW4/oYa4vUO/isKPCllfitXRF53YONJ3l5U1sLbnpUT5umYAdX1is7I5LOvZrqcu1yhh/irsL+TLCGKxetDyyNzBUa7Giao7JQHHXG6TgjgEW73JJvN9NLyvB4JK3M7t2IA9cmz8dg473+wJ8rjjfPfhohtnl4P+bhceA616oU8byvuK0PUUBZkm/vQJyn6gwSPNkEochcVO3dKrZzQ+b7FUfzt6VrGkdSYrNCnC1hCMxzleNFyWcf8O+PYFjweXyiijDLZzUHICqCH0n4A+Yr0GyXATsgoFH4Y6GUhy6NTwghPTaBP/iET4nzJDUHpShJ0jQTR76TmwnMGVsPJq7+9LIvx4WCZ6ufvIajyOvwKOBTuAnEOzyqo5n+ZrjA/iwHZoCaE4DrWnSGtIepKvQHNcGl0N6zXDbD0a38u4Qg3992uyEgXUY/q6wB8xNPMtq9/ojZg0Aj8HqIm1z4Nlw5koXLspIa/06cNnkGm0+ZD3IVBPeXWbqDGURcC5QN0R6VG07oq05EDbqaDGWIQ30dXrVYQt1DECNP5EUB97fQgsEv6G8M+DQ71Yr2MbFW4zjbIKeBE4bNDw/PfA6j5/KLw1hqiAwO8MvgZWGa7GuCWGGKbMqmtzTUGAdT3wZ7DI5XqZA5nCeAH1n+K65I0UukpUV/58SDKcpe6AaF0K1jEh1NAfA/X0VrfSn1VBlaGSPQWB0x3BreDSVQ5eTtsOpec4KKeMQtgrlRQkg5bOPQguUIi31RR6JMnx31UyrRJJQTLIDiVDlR+FF91u+5EcRxStxEb+0JOChDgNQ12nntn4VlealUkOzRkZGgwtKUiGNfH6HyV4rhHJP4LngdcT8NdcdWLrRHg+An4U/AxY9AX6VOyUztEBgvwAWARoLcoPQA1fFw7o+TB4IVgUbFO4E8NWQORWKiB6Gm5ebNi+ST926Amub3igCr4VYgOROt9jtP6ErEo/jsa+4zz6K1GFLUMspMHThOKQ6xLDuHh+OU1X1epxZBEwWN8S55dteaVuXTPFGk99vD7gVeTU/qILH2YD7wPzwi2ZGqMKTHi+cl7v4V+pCr74tgG/bs8Zm6d921S4PBz+dE6nNyvcyCErID4Lg2/liJPNi86G7GVXPU4enMNRPQUdKSBWmgaQGSofLDzrPNHM6KGP1WOVj1GcgcTskYxxE9tscXKHWo5hx2R06syhGl4h5cRv14wx1NSCagGOfDGjM5o400IoAsRxVjDTtUZIzHB3cUBDvVmgXSqY0HQE9K4MQXV+rpNgQrYqjF4ug+GPZdM2elzEdnKG+D4+tEhhrPVrmkOO/XNoBtdUMbHbNhQ/292/D8VdW+tCdOcOxdAGKCWGWXrkL5bqOkb+K9TYNrtHl2pgA5URZK1vcQV9kqJ4wKqDHC07u3irRkMDcX+fY+yLv1XFoLkcjWrXX3rOV+K/nmMb3ObZhH5xjsZM6eduj3xFgHb4smNbaBqhf8CIkx0Medu/Ba3EcARoi0sd2sPpNGI1cRflWo/xYtiolH3nj6umyGurDRGgXfTKBL1GwQZuZjLw6jaEtrOSrT4J0FW4CsrbnsIm+jlpiLNW0tnCaiTRu22IU5MCQVsgyPZFoD/D0NttFLc03iLgMnfzQS9aSQpbaF/q5SXi7kJooN/bNhJ0O7prCHEg4AgHZXo9UAtDioBDOzlddA6446DoewPMbUGpEaCt5nZor29kMg4Fv7RVkklBy+Q9ArSX1sNYQZLy2FtSSU5iDNWtxMXlnaHj2uziop4NLA7K1wD12c37a+NExFCHdtsbP4+KsMcfIng/CbeASk81x/4FwW+Aev9UXngcASeA74+P3PBrsM+27Wz/9DOccoie7a1qKdHC7hVA6y7Uwc840rupSP0WSSnOh5TEGWsoXzfEFr8L46oGZlPRlHgp5dVgmCahPGMycAhl3ynP83hN+L2ppe/GtSMD1xQI+zfq5o1X2asZxzlJH40tHbBxaZReDL6ndOV2CtU1f474nGJH7p9KSWEjFRsHcsA0ommTEM8OIyHw88Cus1NxuKoJobZQoH8lW4FrwbEqLBn2t9GHbScm0kGwP2gDpS7cwaA/2BhVcRq9DHZiYgN4rrSNR1RtX9chIVEC07GpyzHR5S3DnIuQ8eG8cirGr8cBuo2/p2i7iN9v0bGthZ65sKf3FNx0+kiTUfgb3HCmM5aPIU1LCMVW7+7WXYsW/KyqggJhe0vZvwrT9XoKDNyTimPClab9InsJbDgenbub9Da4TNMMliKuhayHIabOvX+4p/jhsAKP3f/TNX7UEkIhVxs8iv8aHCviCwCHubZrOClsnnJ+31VBEj1B2LCbDD9IohuROl28v0k8LvTpLz3QN23koferAV3n9EGBngE8GRQmbMegJPe8CfTpNcta3tauJ40P9veI9cHx1fY1xNvmFPIi+jozuYKewuqeNm9CYNvM4BTceQpsEyK5XYP1NVslk1nVnmFB1ZvrGfQUr8OU1khPkxTqUZxByQDT1eDazswtQxABfS/k/ODAZUv8V4b+tjQe5HfyIegp0hJC8nRn4AQYswaoJ6k65VQtIX6MTaspEGGgbDNQr2yuGpxHLAV7uxqGf1bzZpGtV0zPgI6q9B+rmcCI2QS8M13cUCguQmvvNjzwP24L7fzgg0OxNF3pU5BsHWd7tDxdXIfiLPG9i93l2d4VFWI4fpEyvfj8AfBNUL3MBHBF8ANglUH2atQu0wM8YqTTps2F+DBjIB//DurryM+Aaq+FwCXBDcAJYBq8TYxmUVJ8C8pD0qhrXP9PHF3Th/3E6irkrOdDVlVlEKt36d++SVUN9GDXnb4SQrYga302ep7QaFBPoYvA4IKzSc5O7ya9d5+I2Y0IXcO74AoIJGbvUlLYDGxUwFxnE+bAvZeduSwZGhy3FZvYQ6hZHy0yIbp5s4hl/tSNbN2mJkXhXTtJN43W1lV+02DZRiYFDVbW7eNyTcsI/FmukdcUJIX1AFXeRm3gtcUtTewp7szb0I785zjSV5183iYmRdl3U3tVvZUd7ZuziaePJzl7LOwYiFzkDTuFvN7EpNDIY2nXFMqmpiVFE08fuf71GZn1MKop8EIjk4J/7v4lt5CeTDYFnm9kUtA6h5fcQveVrK9Idc81NSl0nj+wyMhFZOeezByRN8zDuxubFET1eySGJseUAU1KiruanBRKhidJjLlLyIoVStBRlopOT1H2YE9ZzgV6niMxrOcyBkyO29Ud6atMfo16imurbKEn284gMd4AV02TB81/gUokwY5p9N363poJS/rKkjHEM1WDV1oKeEBlrSzGMF0DXAneD6pBVwM1gTkKVrO3lD1Rxroea+BPSaGA3FRXJwq2+zVCNHuSDuKn3rYxF5rKiZnBm5OcHvG6KRb+l3nra2FOLhItC/A2YfcSZC2qLDMBdSdJWQ3Bpgf9dol+bWqKr8qw4dPgazltOV38nQdHOc6JV2GPFpqkAjrmh0hLCOsEm+Nf4hLCHLFzicOp2LGzDQP2TIDOpocziVsPPZ27D1VONlGklH3ENiEkB1rNZ0w8P6foK70am9MS4sslGGWdELIFm6eC+rM/72obbNd0ZOiH7FqJze3at4S1EZDpIRC6rFZAW9pRKFk3uLE6Suglcs0NwT6dTsbGOhCpCPztjGhycEekPulQX//JlBASCq+ST8vvqg6nJRlIwJdMqvdRR6xyTRaCfzYHO24LaHuTUWyzHkU9nkBIlq2tviyyPfEkfhwP+7VY2SXormZtQ6h/78oUpcfOPSk7JlpuOP4o+v6q8vCzj6MMhEUWFT30nMf2JwjQ23ECCLQWAhWZEFr9nTshuvafGudHuDxICJX1/vU4KidTl+rD3OMJC82yj04N+oQTM4uYInjmw81n4wRj9/S4Ok/lur1/wocsTNWEo8PTZIXbtdcgFFrd46Jk2zQFDvWLOdCWRXpJSkL8tGBDdPfgJSG6dqYmBHQHhH3q+9fT4Bq82D5MYNoPZ5Wp3qUMnfdCP8mFp0jaJN+wdQ50d0b9irIhSb+rTuz9IDyXpfFFdUaTQuMIr6QJoX4ZBD1gQWdFgvFFd8dWdkA0P379O464BDtPQv8X4vS7lmOvzel54KFf7/QhhRiUek3RNcz38xKrF4C6BsWRfsuUhLCNjaPad8g9J8R8SO5r33c09e2lTw8gu76if4QFeP1UFPr0ttlhwX/2hSlygFF3lWDYxIjaXIfYq1c7p4JJSd/pIyCQpGA/YfsvMtvbhSIqCz9fx/iS+H5K7HoIvqVieH0V/4NYvt+XMGyeC1k2w9xXonfDqN647uWSKKHheFGUv9tQnqkI416C8ZBMzNmZ5kbv+XHs+KeLyqITQqdtbwnR9WVanE+R8o0jx53DuJ5C5bGDNyFBAxcpobpMuzSExgfmycRsz/R3GmKtOHJssL3gjhPhUr4gtnh7eozt66JcbzdOA33yS9cdA2DsKSDW6cPmXlkzt3yOW+hfM++AlX4LJqEjKSG+ijqbOzAfVh2GLd4SomuQTUKIVA9B3YDGHgdagZvkdGqULmal2I1oiyTNiFKC65sbZcFdSfZkqcPwzof3LBzIfieFcKsrWOguzuJEEg8yd7Rwzobki0l6VIeQsj9cp/EDr4APSmpbWCSzcjSMtdUCnSYAewVk/s5Bv4n0S0kGwXCYianosiSbstZhs75maAPPZdXR40PLpTaaRNNj8rjjot9gpy66+gCaRcCpBtqyiryO78g5DD/WwfjUSTfGC81wFLkQ2ih8nLSPYY8l1Wep6+rXxJws0LnVwy59YuJyBQ4h/wKXziLMA49ugd/0IKcnApcW5EAXxzZwAfr1bZf8gOI9FVBL2DW/xkEJ6L7SUn9VyTQ45x1cnLVVbhynMDGj/A3Kbbu+5chIPf30CtgwGYGf8yq0HGGJs7iymkA8noRXPYUNaHnA32wIXZJiHAJfthHapRmHEdlvfWIUEYjdqTo+prpqxS8Tg6J6CJfPTDg9kki9pgiijHMa0DksOLbYFjIAhB0noHsBC/3DJjm3wIQ4AufWs3UQO7w9ozLq5J/6MmgL3u/Hw0ZhhO04iq29vug2Dtvpcx8DN3c08gM+9cfKcjRKD7oKA2zZyNGeIsnvKcxRBGO4vs/mApcUaU+fbKx6r4tl0BbaY8g4dNzmaJNv8jX7guT5AGN3cTTYz62nix8Y+DNHIzVGUChgT/CZRlfT8tIXOd1fCX+Iq4GFBjpJOIbe6mos9La3tUmqY+sy2JOX5bRYYzxUYNypGQxc3IPq7CIw+OkMRq+dXWMyJ7aU+nAr2Zp8tfhyb4bY5j6NWd+SxrnH7Y5uD12vGa7F2bPiZOYs/11O/qGzE5s5lAwYMsnRmK1oD330LhfkTgppx5Asp4Qt8buIsYzyL7ByNUE/MzHZhZIX+0utjg6kHc62okwh8pIUXR2zpOgyVc+ufwRg9eITkwBD2SaGsloUEYdbMPTkDMaeTkJ8PwNf8Sw45TLRQ8kQBn2723rYPc4bZLwdFlrCfu75pNi4TQ47fxoXi0qV4+BbOZzUEG4mQOeyOfRmZc08xxKFs4GvZlUM366ZAjUsJgx+PoezYl3FxXboZ82pLw+7c+OgLO+ssvVc4lMZWhyfmifSXd7ORJkkp6DbyoOevCL2S7IxqEPJSXkVwV/4W3QCewvZ4sCvPARBItaPGkjZxmDZ1xCyJQ50KjA+waX8N3FMjuWp0+micXI9zn1hZ6MQp3V3cYUNrQXNAdDoHv5wC9phkWjK3V7gVFA9yEZgXniAO4xl8gqx4S8lKWQIiaHb39fALGMaEjHK8DUS4tiyAlBaUgQOkRyT2f9ccNxuEyOgpZuawVbqgJzPwatE74JKHPw8+8Y1jAFNu+1E4AhipbmdpSaENJfeU4QbnF7jhxxbXbWH+Rq+r3mwWgrg+jzJW1iGmhSBFySH1lUuHxyP8HYdkuG6Yftf+unD5DCBWIFynVKyPAgyiaxb2b7EQDD0hFDgKpEUMoSA6H0Jc7G7OOh9aYB0VBAOUiYAP66SbZU4fZgCwillPOV6aljKvbnJhgLLtiURzihQfi7Rlekpol4QNC2k0QtGlLg/iNbX8PgebA4+lFPZhKhdXOk9tGK8s1CYbR1Aw9471i7QdTWYYOttN/q0ZNXgYQz6bF3j2ii7aQgtlLlgCBnyGDr3Bgt/UFVWg1X2QtNHAGiojyNnM3ATcMWcMvUGmEvBC8Bfc6mT/40wCKoiNDopqhhwXzaR8HqL4KpdXI7thC5OZFvG991REwsalZ3axSlsHwBvA2/hz6SXxrRQswi0HUXFGqx7aaL1POuBmlek7aJgk+F5nLsG1Cs3hNfRobzEtoWKRKDtKIbQEHQGWhTwEVCXwcIlwBbiI6AXc18I/kVIJ/J4PGlbU0QE2o6iiKh2ZdIh6BZgc3Ab8GNgYwYy8KUKoIm6V4J6ZnBme1tTXJO0HYWn2NIpLIKoXUAtClrWk9hWTLYITIPtZPCXdB7eX9uZzaR6c7UdRYb2o1OYBTY97/pvcK0MIlqW8iOgAdUjwcnt+Id78NuOwiJmdAyaIPg1cB+wXZhgEbMakGhJ2ongoXQcj9XA3qGa2HYUhvDTMYyjeA9wf3AhA0lb1LwI6CmL1mT+iI7jmea5l8+jtqPoxo/OQa9vPApcJ19IW+6GREBjG/vQaZzXEH9yuTGyHUV3nGFvoncIOD5XFKvLrKcCT4OPdvEJtpo9GEWtudKSVS1u1zbY11MaxUZXWMF2TvZ1lbVwCHW8GNjUt0voNSO62jh4VMc3RqqjoHNQsqtjUAehAck6ggblNDlJeDV4K8mrRK4sEHd9E0mvs1uti7pq035d2+BX2P7fo3SL0viOgiTVWfFQUAORVfdXVwDqAP4AXgbeRDK+wbbxQDvNhpMbgsEktJVr4vTp2LkH7aTZpS3UKQIknV4Bre+nvgJWEfTZ6T+B/wUuUKfYDsNWYjQJ/DaY5fMWsJUCb6Ll22Bdr5KG0bTD0UkjrQ7eD1YJnsWYI8FJw4lKM7UST71pezNQb7Cu2gnhCWzaqJmRr6lXNMhY8OdgFUDfKzgX3LSm4ay12cR9bnB/8HGwKqAXbhfy3epaN1ZZxhP8pcDbh5wN6hgmg0uV5Xerxz4CtMss4LbgjeCwQW+vWcne+pYyVwQI9vrgM0Ns9SvQraXfLdQsArTbGPDroG4HhwUvoVgDti0UEQGCuxuoAaOyQV+52gOs7Nski4j3KMikTd8PXg0OA/Stor1GIc6F+0ggZwZ/NoRW1BWLVoK2MCIRoL3nAn8MDuNjYyegt31a4pprBE2PN38Nlgn/Qln7BlTXxmogPXkwP3hWmcnX1XU+26bObvWbKQTq4BIb6A107evXg1ZakyJAfiwH3lBiTkrV95sUQ6++EJzPgnqKUAZchZLFvTrQCmt8BMgZfQf5yTISFB36L+jNaC0oAgTjfaAGDIuGF1GwfRv1NgJ5I0AezQdeXHTCduU/x3b1vDbXlh/nlwCndoNR5OZehE+sbaBawysdAXLrQLCMAdB70DNa70bB4VPAouEyFMxT6SxrjWtMBMi19cBpRSc18k9uTNDiHMHJDcHXCw7mZOS3j5riGqEtLzQC5N6KoNZ6FAlaVNi8d7XilOZDXF5k5JB9Elj1ZeSFJmkrvDoRIBe1QPFpsEi4EOHNyHkcWQfUY8ii4CIE610GLbQRqFwEyM21QQ1IFgW6utBLgOoLOHBqUdFBrhaEzV/f6LSWj1IEyNVNwCJPmEfXLp76A4Oa6VgEqHdevnZBaQ1uI0AEyN3/LeJP0ZX5IFu907T6gKEfLTAQ/6/6EWgtbCOQHAH+HwuCDxT0P9FErQ8kWzDkWgzUm5yKAM2FmHfI7rXq2wh4jQA5vQVY1ByMb3g11pcwHP4rWARs7cvGVk4bgSpGgD/NX4r44yDzN5XxF2NmA+8vwNH7kNm+QqwyLd0aUmQEyPUdCvgPSeR14HAfoWKA7rWKWKdxRJGN0spuI1DFCHT/T0U8BNBr+PRNm/IBxYuBL4M+QW+wqvZATPmhbjWOWAT4D2jyoG/Q9PJyr9BRuDSoiR4+4U6EzTpiOdG620bAGAH+Cx/z+efqynqK7VxGhb4LUbQk6Hu9xp9929nKayNQ9wjwP9O6Ed+TtPSaR+fOwmmQAwVajfkQOLfHRjiWz7F9zaO8kRdFOy1IEJYDNTFNqA8I64tkYZyPY6f2h16fN3yqi0+GttPYvw+8R9h+Xo8oeIJuWyq2PldCT0XeJNpJH6O2AutEwWDdFkwBl7CSbEe0J8YeZ0c62lTEX221IrheCOs0Q/U17P4neH0Xr6TtH2S/hZQI0PazQXInODGF1KX6WuK/ri2DS0dxLULXthVsQbczhp5qQTcyJCSEXqy6Prg5+ClwWXBUQF9kvw7UbehZ5MZdo+K4rZ/kx5XQKj98we+Js7/X7WHgsaBP2MOXp3WUQyD1lvEPgZNBvaKvheQI3E31IeB76tjePm0mBjclh8q5dh8b+1KvKFCr71ucbCPMkmZ/erEfWtLWnoz4jcUJ9dqfBzcGU2MOTQvpEXgBkjPAE8gn3c6MBJBPRQwBrE8Mr04KYGLSYtQEmDUu4Qu+i0Hf8iWsinKI2STs2hv8HDgebKG8CPwLVT8HjyfPtN9IIMc0sPkI6Gul6EvIWoSYaWuEtI5Cg0++3gB8Hobo3rtRQKPpKuF7oAYZW6hWBDTuoXGw75N7enLQGCDvlsaZ+0Ffr308mxhtFReg2O9pYojO/L46iWnI2jLOiDqVExe94uw8sAPYfjHYdhLVbMQxmPV5UKuPBVqCfTqop0e1Bv7UD+LARzw6sSVx2TZOnvGKAgZdPt8bx5ShfCUc0+Od2gGx0ADad8AdwNiOlboW6heB6Zj8B/AQ8vOW+pnfeRHOUdi9lyfbX0HOQsRi4BYkLvGP9aRYYvaoUydBx6CFbkeBr4JKJF3e7QTGxYqqFmoaAZ0odaV7s9oaeAnU05Vy10TkCB7/ra/D7msccRyyfmgyZ+CKgiB9AsI/mYgzlN2CI6tl4CuNBX8Vg+3Aw0Dd97XQRiCIwG3s7EcO/yUoqOKWHF4Vu3xeES2Lz31jOqaz5E88BuPLHmV5E0VglwXPBnXF8Db4a7DtJLxFuDGCVsGTPytPAI1vnAguXjXv+FPfik0He7TryKisvisKgvBpCM6JEmU8Ph0HdszI65UNvzQFVutJvgnO61V4K2xUI6C1LoeAehSrpytDB/L8cYxY1JMha+DXTYGs6BXFN4IKD9uDPMjILIKgbQ7eCuqq4VVQ915tJ5E5oi1jJAILcax1SsHqzhuVcxGasg+/61HhvmFZvSsKnNyQisvDlTn2L6Q3+lgOfidWbJ8dhl3AfcBRWh/hFKcY4rco1+PrF7uoTnVucP4u6mqsBfcI3ACL5tdo/pBubwsH/gf6P6stF/SkbDFs70xcC19R6I/mC37uS1BUDsHQ+MK+YG/OOzR6rCOdbScRDdiM43vYaLboMjR8FMZQsDi4HLgmuB64Cqiy2cE+QMZ4UGfOyeDLYAvmCLyfYt3Ga2xDoDU9+iDWJ0DN7/AONJSunn1eVfTGGDtXFBiuDkNnFD0eyQvPIGDBrtFOsrBDtwbLgyuAa4BaKbc6WEhgkdtUuB/HvkYb/F8ZDtJuWn/wFfDbYHt75xZ0XW3cBF7V3Wr/dtpOy/KdodsJ6Z0h8zgzDzLcix16r8mMBUoI35r9Mwbp2pIaRUDJsQ0Ne8mwbSafNsOGk8EFhm1Lqz93BD5ATt0Q3Hp8Ire4VsCwIqB74blpTM2oG3onoSBgx/mg7pN1hXqeylqobQR0EdGbbbhJbd0YXcMfxvUl+UOqx3+himHArldBjWdo4dJZVbSxtSk1AhuJQi9QWYZt3ywsVbRQ6Qgcxx9wz0pbaDCOXFuK4uvBRQ3VbVF1IzBetx7rVNe+1jJDBHatYychP7D7YVAv+v2Nwa+2qLoR+JA6Cj1haKEeEdiHP9qJ9TA13kp82J5azXlpoR4RWLntKOrRULLyOv5gP6mPucmWdn3RFOgWqh+B5dRRtJOUqt9QsrBxZ2A6i+/gV/tURK1bbVhOg5lTsHFCte0ceete4U+lGZGNA/JvLpyaBmoafgvVjMB9uqKYu5q2tVaFInBXaL9Ru3SAerS7W6Ocap4zc+qK4g38aqdIV7txH+APpcfYjQXy8DGc0xORFqoXgRd1RaHVgy1UOwLv4Y+0cLVNzG1dYwZqc0eiegLmUEehxWAtVD8C/1V9E3NZ2M6tyBW+Qplf0q3HVFQsXaiaVriPCGiV4dLcgjziQ1gVZZCLD2GXZm+2UK0IPKYrin9Xy6bWmpgIqK3+yp9J26bCtU11rOZ+Pa+k00tNWqhHBDSLdiqdRVMfJbYvwqlmHj6qjsLnh36q6WazrNKl+fN0Fus2y62ON5V4SW0D45rXpbvajiJvCIfDPytqr6azuARs0kQsH29lGk6LNFvr3eoormq2j432biO809etbgCbsHRbrz1soXoRuC14Z+aj2LZ49exrLcoQgd/CcwBPR6Zm4E1koTNSviwLLgnehI5nEhkcKpE9J+SapdlCtSKg28HZdUUhuGzGpv1tQAS2w4cp/PEC0NvKvw9uCOqWJRGgGQuuD34TvBIM3iI9HUY9or0b/Bv4NHV3sPUFsruF6kXgck4IbwVXFPpS92nVs7G1qAYRGEsiaRlALqDT0S3wermEtMxFROAg2vfQoKMYi4aXwHbNRxGhbq7MJ0ii3GMjdBL6BsbfmxumWns2iTa+v9MxsPM6jXU27mxTEZd0mXszeAWoeR56hKvl8HrO/jr4GrgAqG8O6J75M+DGYAvlRkBt4gOO9iGkojL0GYVzwL+AejetFr/pvl8naeXwwuASoL5jow5zbVBL76sA16iTkCGdKwrt0FF8ks352i8Z3kLfZPAojLo9r278+CAyTgc14NZCsRE4kDb7fh4VtJdOTr/LI6NivJpi/2Xikvu/RGz0gGFf8IvgMB6DfwU/fobudzoKHWDYXWz0pa6iQZ3D/uBPMERXD94BX/SK+DPALb0LbwUGEZhA+z0YHLhuaaP54HkcnM2Vt4L0J2GTXnxcSD7LX+K1B5ujwNRBadHnhFfhnwd/dAXf+65HIPOIYKegrR6nrYpyfe/yx0UGFdlvgVuhT5dx+kxbC34j8Avim7mT6JryZ7Z17yR0S6F8/gJYWCeheCH/Z6DGEzXf5DmVFQi6wu90EtLRu/XQAT2Wjp8G1dP7hs1RfJ5vobby8E2XcD+ypW/pEiOgJNWXyTI/7aA9/hcZX0rUUv3KLYjBucMykxjuhO5TCtCvDm8BfOstGA3mUXR0USEC3RL4BA1Ejkf20DoJOYN+XS1NAvV0p4V8EdiZeObpJI5DfZ07CV1JzUkMhtZJqPnQfyqb+cFHdewRdDXR6yQkt++KIlBET3UH+ysGxzm3y6P0npwyvLHjm1Ze3glO8CZ0tAR9ifY8PqvLxF/32Htl5a8AnyYgfagCdvRMIKZ6+qeJcD5AJ1JdTejJYg/6rih6pTPNtHdoP++usTPKKzQrPwHQ9zAnwn95VhkjzKenHHk6iROIXZ07iV/if6U6iW4uxv2Ps6TqfvjY10lISOyfmF7qNOp3yKIpwvMQx8ugXM+OKwX4+AsM2rVSRlXXmF1ow1OymEectY7jVnBCFv6K8Gj9zOEVsaVnBrEdw8EU0Md0gJvxUQOlA5DUUegSfRroY/LH9Riw9oD2ChQQ6P0w44cVMKWqJujs8l7aL9PtI/HdCP6Lwdhco67qsC3+61F75YD43oBR7/NkmE7oD5hkxV6ywKDnqDubmDKUrYVDZ2XgK5wFP/UkZIvCFdVTwV8xew5ilLWT0GDbJWBdO4np2L4W/le1kzgH+3x1Evvip7GTQEc68Ac/DvQFR6drHA4FDi4LvuLL0ZrLeQH7V8naEvBuX3P/Zf40UE8UKgnY5vN/eWmak1Y9PUbdiKA10oRZ1u9Pz1XJS3381P2eLuVWs/SlaWSaMfs52kfjU85A/JaB6VpwQWfmajFcQAw+Xi2T3rGGOH+Do8PeKcm1p0mQi+PvwACms1QMmxf0ebat9AAivv4EHCV4A2e3dk6MLgO8S4F3NiRgGrOqLBDj3TzH2dc0iBkxw7jVPRv4vcq2Bobh6wbgm559rpo4/blXyNoO8Grs6amqOZXRHr1SUPMRKgvYpxcQ+YT/LMRZLNzMp5XI+nUhhnoSin2zgHrLU5NArxQ4ALS67TSFEt7twNfApoBesVBpINC/8RzsrxfqMMZ+ybPBVxdqsAfh+LutZ5/LFvcyCvcBtaI2E8C7Cngr2CR4G2c2zRSQkpiwT1/zu9Zz0H2NbyRHAaP39mz4VORp3kZlQfaB13n2u0hx1yA81yxC+BcCzyvSyCHK/hO6Y6cHVCERsW8c+KDnGP28VN8w/mueHdBHbXzMLis0Dtj4AdDnwK6vMN6NoJ3BzFcNChz8HwSvB5sKz+LY8oUmiQfh2LgkqMfUPuEoD6a5i8CDr/r0oitLy8ErD9j6wwJ8dxX5GAwT8wQLfl016Jm8nnw0HfRYsfJAI+xbQEOUc7sRF10c2rIAp25DZqVvRRQPbJwV1CXssGCduHYxlWPkzKAGpGVz7zX87DcdTsPBzIO3plgWUYaNur29vYDGqMbJF8fWAH0nngaaPlZEg/iWiZ1zgcO4XP90nC/YMw+oTvy3oJ50jCJcgtOVP+GoDbHz4wU10GZxOeJS7q2XxcnFUHw36GMRWdiHc5g19plwQVX3uzG4EPsyT3929G0y9NL38S4u4sjfVPLrcew/yBvNOqw8kDfnYuTmng3Vam29dvIuH3K9dRQyBoc1iqzHnb5Xir6KzA/jdOUfpWKn4jCOjd4s/Skdt1BaBBTznciTzG/fKs1SFJEnunXUylrli0/Q4i51Ei/7Eur18RCGvQ3Ked8DJ7p8vIrA3gtWfh0BMXgF1DtC1RFXcl2LrwSqiJzvKNbAdmDlOwlyeAFQK3KvAX13EicRAy0X99ZJqI29XlFIYAAEYkP2LwW9dkZd+Vqyvg3BeLt7XPkN8dBy4DPBCZU3th4G3oeZW5EDt9TD3M4VhP5vWrL+2YJsVjwKmWVaxJ+4EwMMvoIdXQncWEBQtkKmBk+/WoDsQkQSj3+AExGumB8M1qaTKyQg2YRqdes3wJmJ5bJgnToJ5aravIhOQp3mXMSjkE4C2eUAf+g9wKLgJQSvX44nfrVgt55MHA/qCU8L5ggoNj8H5/Yb/XKkYfc6oHK0KDigHE9K0kKU9Ke4r6hoIVeLlDIvlS4pDLFqsF3P0A8HR2HiE24mgmKgWNTi0aapUbF9C/BVsCjQZDs9aWwm4NxORUUuJLcaE0wyNiF+zAmeHfJnVHbPxFHfg3sZWyEbG/bvBRZ9hbhHNutqxkUgx4KXg0XDz1BQ2DhM0WHH9oXBaUUHqQLy9cdaveh4FiUf27XC85gS4ngDOoZylVXYUw+bRsFpLQLT3IilbOhz0FwA7/YM9jyTQ8ZQWImR3tv4GDjbUAwoR2mlPhJl6zJto3GT08HNbHky0k2DbwPy996M/LnZhnq2xfFHwHfjhQYjX8ntTbwATQV/mobVVOZafYCm27n9IN612tcciY+Z3vI9LM/Jod1B5etzYJGdxGvI34T4LAIOrZNQnIfaUcgAAUG4GhzP7m6dguJ+9Ln4o2hkgQZWfb0wuDiLZ0jWxJymwmV1cIxcWRnsvBcUe48Hi74F2J3/xOygPncwdKhERxFEgaDok226Hfp5UFbgVm+MvpHGF2h14RwF6soretG8AirMX9nHnuSEXhxzIqjve9wGrlBCHI/WfwD4RQm66q+CttESbv2BywQNqikxFqhSBLHnljKDULKuv1Us1loJfCRY9ouV9cRHV7wtZI0AATwIHAboxbqrZrXbBx/6O2e0YThfos79fcQqqwz8nAReUKK/YVWapduCzwgQ3a3AIiexhBswuv8QBaUtd0eXzmx6gc+owEk+cyVNFkH9KKhFhsMAvex48zQb2/qcESDI7wOHOb9Atyhngd6f/SNzKfBacBRBT6W2z5keRnbkTgA1XV4zeIcFOtmsZDSwLSwuAgR9CfAfw2r1iF69Xi7TezjgWwssYwJaxORKH16GdctnzR7xgqeAZY81oHIArqBkvqy+tHweI0BDfAWs0ivf/oY9G0VdpGwMuD1YlQ4OUyoPenP2d8ElovEMjqlbDdSAYNHTp1FhBbq92CWwr+7boc7MLCJ4NM7iyP01+KEi5Lcy2wikROB86vWWrWdT6GpV3biOIhx9Oo21ONYU20nh8na/jYDnCNyEvB3oHO7wLLcy4io14cp3VGi460G94EQd4pbg4751tPJGNgJT8FzTqwVrgI3tJNTCjb6iiEthrjQ2oe4EULMzW2gjYBuBGyHclU7hn7YMTaFr9Jqm8tYAAAGiSURBVBVFXCPR0BeDk0B1lJqW++c42rZ8pCOgqdu6dV1KuQK8Dxy5TkIZMJJXFHLcBFxpaArtnqBmy81romnLGh+Bh/FQ7+X8DZ2COooWiEDbUSSkAR3HQlRrerHeKFTrNy8luDnqVU8TgB+Bx9ExvDTqwYjzv+0o4iJjKKfjWJhivU1ZHUelFo4ZzG2LzBF4kOKjQa1UfsFM0pZGI9B2FNGIOBzTcWiMR+s/1HFsDLbxJAgVAn1W71xQL8e5qkJ21c6UNrE9N1l3nEMLfnYDNwVn8ayiFWeOwCsUnwnqSuFyM0lbmjUCbUeRNXKOfHQgmn6szwlsB2oiWBt7gpABXofnQvAM8I90Cs9lkNGyOEagTVbHgPkmpwPRFce64H+AHwW1InUMOMrwKs5fCf5FSGdw+ygHowq+tx1FFVohwYZuR6KX56wJvjeEdR1M1ePHW7t4M9tr6Aimsm2hwhFoO4oKN04W0+hY1KaLgBNBLZBb0IDqZPSO0NkMOJYyDQLqEv+N7lb7Qp3p/w3qkWIYn+H4CXAq+CB//EYtiMKnkYf/D5Zz/GegqBoWAAAAAElFTkSuQmCC" alt=""></div>
<img class="npu" id="npu" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJAAAABrCAYAAACYEwtiAAAAAXNSR0IB2cksfwAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAAuIwAALiMBeKU/dgAAAAd0SU1FB+oJGgsIGnBR210AAAIhSURBVHja7d1NdgIhEEVhG12D63Hprsc9eMwgw0TF5kegvjs3Cl5eFS2cHA4AAADx2D59weV2fJi2Nbme71szgYhDpN0CkYdEuwQiDt6JtJEHJRIl04PquzDpg9wU2siDEomUMNQrYdIHn6aQBEIRBAKBQCAQCAQCCAQCgUAgEEAgEAgEAoEAAoFAIBDW4bT3hbkXz0pOOb57j0/+9p5ruzXGUPqZWs5fjbGdWht6Pd+32Y/Kvvoioh8DTt/+Ambner5vK49PD0SkNQSKMrnRJJJAJJpHoMi9gm384ruy3M+UuwhW2H0qYV8UTQlTyrqlFYH0QxIIStlQAuVMsBQiEIkIBAws0Kop1OOoBIE0nBLItl7fNoRAq5SyHicxZ+JkDUmVaUpYlG19pJ4vjTi5M0sUbcMw7HOgGSWKuNtMJrrOeKI+qtBEWwhzCnS5HR+zlCmiDJpAI0lEksWaaMyxaJKVv+bYeyV7Wn0iZ2f0PlEJW1CintINI1DUFGpxH63nfHsOFLCc1VysacbVqJnWA5HoS+Ou/T6a6CAStfq9LkVejaOOvfb4W86nJnrwNNrbOPdahP5vPIp2gnogaKJBIBAIBAIIBAKBQCAQQCAQCAQCgQACgUAgEAgEEAgEAoFAIBAIIBAIhLn4c+vR5UI8479bshIIdRNICiE3fZ4KRCLkyKOEoU0Jk0LISZ+3AhGJOEUJRCLyVBOISMQBAADALz884wi8+uZL4AAAAABJRU5ErkJggg==" alt="NPU 正在工作">
<svg class="nav-status" id="nav-status" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round" aria-hidden="true">
<path d="M12 2L20 21L12 16.5L4 21Z"/>
<path id="nav-slash" d="M3 3L21 21" stroke="#d25a5a" hidden/>
</svg>
<div class="nav-card" id="nav-card">
<div class="nav-primary">
<svg class="maneuver" viewBox="0 0 42 42" fill="none" stroke="currentColor" stroke-width="5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path id="maneuver-path" d="M12 35V18Q12 12 19 12H34M25 3L34 12L25 21"/>
<path id="maneuver-slash" d="M7 35L35 7" stroke="#d25a5a" hidden/>
</svg>
<span class="distance" id="distance">350 <small>m</small></span>
<span class="phrase" id="phrase" hidden></span>
</div>
<div class="nav-summary" id="nav-summary"><span class="remaining-time">18 min</span><span class="remaining-distance">12.4 km</span></div>
</div>
<div class="alert" id="alert" hidden><strong>请握住方向盘</strong><span>保持注意,准备接管</span></div>
</div>
<div class="border"></div>
</div>
</div>
</div>
<p class="caption">C3XL · 2160 × 1080 · 2:1 · 按窗口等比缩放<br>行车默认收起左侧栏,保留完整摄像画面</p>
<div class="controls" role="group" aria-label="演示导航状态">
<button type="button" data-state="turn" aria-pressed="true">正常转弯</button>
<button type="button" data-state="rerouting" aria-pressed="false">重新规划</button>
<button type="button" data-state="lost" aria-pressed="false">定位失效</button>
<button type="button" data-state="arrived" aria-pressed="false">已到达</button>
<button type="button" data-state="warning" aria-pressed="false">警告让位</button>
</div>
<p id="description" role="status" aria-live="polite" aria-atomic="true"></p>
<details><summary>查看当前示例状态</summary><pre id="state-output"></pre></details>
<p class="footnote">一次性 HTML 原型 · 示意行车背景与演示数据 · 到达画面定格供审阅</p>
</main>
<script>
const scenarios = {
turn: { status: 'navigating', label: '350 米后右转', description: '350 米后右转。卡片显示剩余 18 分钟、12.4 公里;NPU 上方绿色图标表示导航有效。' },
rerouting: { status: 'rerouting', phrase: '重新规划', label: '正在重新规划路线', description: '重新规划时收起旧转弯与路线进度,改为短状态卡;导航状态仍位于 NPU 上方。' },
lost: { status: 'positionLost', phrase: '定位失效', label: '手机定位失效', description: '定位失效时隐藏旧指引,用灰箭头和红斜线标记导航状态。NPU 标识独立保留。' },
arrived: { status: 'arrived', phrase: '已到达', label: '已到达目的地', description: '到达时显示短卡并收起导航状态图标;现有 NPU 与行车 HUD 保持原位。' },
warning: { status: 'navigating', warning: true, label: '请握住方向盘,准备接管', description: '沿用现有底部警告区域,导航卡完全让位,保留车速与巡航 HUD。点击正常转弯可恢复演示。' }
};
const element = id => document.getElementById(id);
function showScenario(key) {
const scenario = scenarios[key];
const short = Boolean(scenario.phrase);
const lost = key === 'lost';
element('nav-card').className = `nav-card${short ? ' short' : ''}${lost ? ' lost' : ''}${key === 'arrived' ? ' arrived' : ''}`;
element('nav-card').hidden = Boolean(scenario.warning);
element('distance').hidden = short;
element('phrase').hidden = !short;
element('phrase').textContent = scenario.phrase || '';
element('nav-summary').hidden = short;
element('maneuver-path').setAttribute('d', key === 'arrived' ? 'M7 22L17 32L35 11' : short ? 'M21 35V6M10 17L21 6L32 17' : 'M12 35V18Q12 12 19 12H34M25 3L34 12L25 21');
element('maneuver-path').style.color = short && key !== 'arrived' ? '#5c6870' : '#9be6b9';
element('maneuver-slash').toggleAttribute('hidden', !lost);
element('nav-status').classList.toggle('lost', lost);
element('nav-status').toggleAttribute('hidden', key === 'arrived');
element('nav-slash').toggleAttribute('hidden', !lost);
element('alert').hidden = !scenario.warning;
element('mode').hidden = Boolean(scenario.warning);
element('screen').setAttribute('aria-label', `C3XL 2160×1080 行车画面:${scenario.label},导航状态位于 NPU 上方`);
element('description').textContent = scenario.description;
document.querySelectorAll('[data-state]').forEach(button => button.setAttribute('aria-pressed', String(button.dataset.state === key)));
element('state-output').textContent = JSON.stringify({
navStateSP: {
hasNavState: true,
phoneLocationOk: !lost,
rerouting: key === 'rerouting',
navState: {
status: scenario.status,
maneuverType: short ? 255 : 10,
distanceToManeuverM: short ? 4294967295 : 350,
routeRemainingM: short ? 4294967295 : 12400,
routeRemainingSeconds: short ? 4294967295 : 1080,
ageMs: 50
}
},
ui: { started: true, secondsSinceReceived: 0.05, alertVisible: Boolean(scenario.warning) }
}, null, 2);
}
document.querySelectorAll('[data-state]').forEach(button => button.addEventListener('click', () => showScenario(button.dataset.state)));
new ResizeObserver(() => { element('screen').style.transform = `scale(${element('viewport').clientWidth / 2160})`; }).observe(element('viewport'));
showScenario('turn');
</script>
</html>