body { padding: 0; margin: 0; font-family: Arial, sans-serif; background: #f5f5f5; }

/* VR Instructions Styling */
#vr-instructions { 
  position: fixed; 
  top: 20px; 
  left: 50%; 
  transform: translateX(-50%); 
  z-index: 1000; 
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
  max-width: 500px;
  width: 90%;
}

#vr-instructions-content h3 {
  margin: 0 0 15px 0;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

.instruction-item {
  display: flex;
  align-items: center;
  margin: 10px 0;
  padding: 8px 0;
}

.instruction-number {
  background: rgba(255,255,255,0.2);
  color: white;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  margin-right: 12px;
  flex-shrink: 0;
}

.instruction-text {
  flex: 1;
  line-height: 1.4;
}

.instruction-text strong {
  background: rgba(255,255,255,0.2);
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: bold;
}

#unity-container { position: absolute }
#unity-container { left: 50%; top: 50%; transform: translate(-50%, -50%) }
#unity-canvas { background: #231F20 }
#unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none }
#unity-logo { width: 154px; height: 130px; background: url('unity-logo-dark.png') no-repeat center }
#unity-progress-bar-empty { width: 141px; height: 18px; margin-top: 10px; margin-left: 6.5px; background: url('progress-bar-empty-dark.png') no-repeat center }
#unity-progress-bar-full { width: 0%; height: 18px; margin-top: 10px; background: url('progress-bar-full-dark.png') no-repeat center }
#unity-footer { position: relative }
#unity-webgl-logo { float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center }
#unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
#unity-fullscreen-button { cursor:pointer; float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }
#unity-webxr-link { float: left; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
#entervr:enabled { float: right; width: 38px; height: 38px; background-color: #1eaed3; display: inline-block; border: 0; }
#enterar:enabled { float: right; width: 38px; height: 38px; background-color: #1eaed3; display: inline-block; border: 0; }
#entervr:disabled { float: right; width: 38px; height: 38px; background-color: #dddddd; display: inline-block; border: 0; }
#enterar:disabled { float: right; width: 38px; height: 38px; background-color: #dddddd; display: inline-block; border: 0; }