@import "https://fonts.googleapis.com/css2?family=VT323&display=swap";
:root{--phosphor:#40ff6b;--phosphor-dim:#1f8a3a}*{box-sizing:border-box}html,body{background:#000;height:100%;margin:0;overflow:hidden}.screen{background:#000;position:fixed;inset:0}.screen.center{place-items:center;display:grid}.canvas{position:absolute;inset:0}.canvas canvas{width:100%;height:100%;display:block}.hud-text{color:var(--phosphor);letter-spacing:.08em;text-shadow:0 0 6px #40ff6bb3;font-family:VT323,ui-monospace,monospace;font-size:22px;line-height:1.15}.hud{pointer-events:none;position:absolute}.tl{top:28px;left:36px}.tr{text-align:right;top:28px;right:36px}.bl{bottom:28px;left:36px}.dim{color:var(--phosphor-dim);text-shadow:none}.keys{margin-top:8px;font-size:16px}.blink{animation:1s steps(2,end) infinite blink}@keyframes blink{50%{opacity:0}}.attribution{color:#ffffffbf;align-items:center;gap:8px;max-width:60vw;font:11px/1.2 system-ui,sans-serif;display:flex;position:absolute;bottom:8px;right:12px}.attribution img{height:16px}.panel{border:1px solid var(--phosphor-dim);background:#000a00d9;flex-direction:column;gap:6px;width:300px;padding:14px;font-size:18px;display:flex;position:absolute;top:120px;right:36px}.panel label{grid-template-columns:1fr;display:grid}.panel label em{color:var(--phosphor-dim);font-size:15px;font-style:normal}.panel label.check{grid-template-columns:auto 1fr;align-items:center;gap:8px}.panel input[type=range]{accent-color:var(--phosphor);width:100%}.panel input[type=checkbox]{accent-color:var(--phosphor)}.panel button{font:inherit;color:var(--phosphor);border:1px solid var(--phosphor-dim);cursor:pointer;background:0 0;padding:4px}@media (max-width:600px){.hud-text{font-size:16px}.tl,.bl{left:16px}.tr{right:16px}.panel{width:auto;left:16px;right:16px}}.hud-button{pointer-events:auto;font:inherit;letter-spacing:inherit;color:inherit;text-shadow:inherit;cursor:pointer;text-align:left;background:0 0;border:none;padding:0;display:block}.hud-button:hover{color:#b8ffc8}.city-menu{border:1px solid var(--phosphor-dim);background:#000a00e0;flex-direction:column;gap:4px;width:340px;max-height:calc(100vh - 220px);padding:14px;display:flex;position:absolute;top:120px;left:36px;overflow-y:auto}.city-menu .row{width:100%;padding:2px 6px}.city-menu .row.active{background:#40ff6b26}.city-menu .result{flex-direction:column;font-size:18px;display:flex}.city-menu .result .dim{font-size:14px}.city-menu .search{margin:8px 0 4px}.city-menu .search input{width:100%;font:inherit;letter-spacing:inherit;color:var(--phosphor);border:1px solid var(--phosphor-dim);background:0 0;outline:none;padding:4px 6px}.city-menu .search input::placeholder{color:var(--phosphor-dim)}.city-menu .credit{color:#fff9;text-shadow:none;margin-top:8px;font:11px/1.2 system-ui,sans-serif}@media (max-width:600px){.city-menu{width:auto;left:16px;right:16px}}.city-menu .landmark{padding-left:26px;font-size:19px}.reticle{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.reticle line{stroke:#4ec8e8;stroke-width:2px;filter:drop-shadow(0 0 3px #4ec8e8cc)}.target-dot{pointer-events:none;background:#ff3b1f;border-radius:50%;width:12px;height:12px;animation:.9s steps(2,end) infinite target-blink;display:none;position:absolute;top:-6px;left:-6px;box-shadow:0 0 6px 2px #ff461ed9}@keyframes target-blink{50%{opacity:.15}}.attribution a{color:inherit}
