<a-entity 
  class="status-gauge" 
  gauge-click-toggle 
  position="0 {{ offset_y|default:'3' }} 0" 
  scale="0.3 0.3 0.3">

  <!-- Glass core -->
  <a-circle
    radius="0.6"
    class="glass-core"
    color="{{ ring_color|default:'#00FFFF' }}"
    material="shader: standard; transparent: true; opacity: 0.3; metalness: 0.8; roughness: 0.1; side: double"
    rotation="0 90 0">
  </a-circle>

  <!-- Animated outer ring -->
  <a-ring
    class="gauge-ring"
    radius-inner="0.7"
    radius-outer="0.9"
    color="{{ ring_color|default:'#00FFFF' }}"
    material="shader: flat; opacity: 0.8; side: double"
    rotation="0 90 0"
    animation="property: rotation; to: 0 90 0; loop: true; dur: 2000; easing: linear">
  </a-ring>

  <!-- Dynamic Text -->
  <a-text 
    class="gauge-label"
    value="ID: {{ id }}\n{{ status }}"
    align="center"
    color="#FFFFFF"
    width="2"
    side="double"
    position="0 0 0.02"
    rotation="0 90 0">
  </a-text>
</a-entity>
