/* Mengatur font Inter */
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
      body {
            font-family: 'Inter', sans-serif;
        background-color: #f7f9fc;
      }
      /* Style untuk skematik, agar terlihat seperti panel kontrol */
      .scada-container {
        position: relative;
        background-color: #ffffff;
        border: 1px solid #e0e7ff;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
        border-radius: 12px;
        padding: 20px;
      }
      /* Warna untuk indikator status */
        .status-running { animation: pulse-green 1s infinite; }
        .status-trip { animation: pulse-red 0.5s infinite; }
      @keyframes pulse-green {
            0%, 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7); }
            50% { box-shadow: 0 0 0 10px rgba(34, 197, 94, 0); }
      }
      @keyframes pulse-red {
            0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); }
            50% { box-shadow: 0 0 0 10px rgba(239, 68, 68, 0); }
      }
      /* Animation for slider snap-back feedback */
      .slider-snap-feedback {
            animation: snap-highlight 1s ease-out;
      }
      @keyframes snap-highlight {
            0% { background-color: #fbbf24; transform: scale(1.1); }
            100% { background-color: transparent; transform: scale(1); }
      }
      /* Pump image styling */
      .pump-image {
        transition: all 0.3s ease;
      }
      .pump-image.status-running {
        animation: pump-running 2s infinite;
      }
      .pump-image.status-trip {
        animation: pump-trip 0.5s infinite;
      }
      @keyframes pump-running {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.05); }
      }
      @keyframes pump-trip {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.1); }
      }