!veo3 text-shadow: 0 0 15px #00ffff; paddin…

!veo3 text-shadow: 0 0 15px #00ffff;
padding: 15px;
background: rgba(0, 40, 60, 0.4);
border: 2px solid #00ffff;
border-radius: 12px;
backdrop-filter: blur(15px);
min-width: 200px;
}
.gesture-hint {
margin: 3px 0;
opacity: 0.9;
font-weight: 500;
}
.title {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: rgba(255, 255, 255, 0.1);
font-size: 48px;
font-weight: bold;
z-index: 1;
pointer-events: none;
text-align: center;
letter-spacing: 3px;
}
</style>
<div class="title">NEURAL MATRIX</div>
<div id="info">
<div class="gesture-hint">👉 Point with index finger: Neural Pulse</div>
<div class="gesture-hint">🙌 Both hands visible: Navigate Matrix</div>
</div>
<div id="gesture-status">Initializing neural interface...</div>
<video id="video" autoplay playsinline muted></video>
<canvas id="heatmap-canvas" width="180" height="135"></canvas>
<div id="canvas-container"></div>
<script type="importmap">
{
"imports": {