/* Overlay */
.overlay {
    position: fixed;
    inset: 0;                           /* top:0 right:0 bottom:0 left:0 */
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.7);  /* translucent white */
    backdrop-filter: blur(4px);         /* frosted-glass effect */
    z-index: 9999;
    visibility: hidden;                 /* start hidden */
  }
  
  /* showSpinner() toggles this class */
  .overlay.active { visibility: visible; }
  
  /* Circular spinner */
  .spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #1976d2;          /* pick any colour you like */
    border-top-color: transparent;      /* “gap” */
    border-radius: 50%;
    animation: spin 1s linear infinite;
  }
  
  @keyframes spin { to { transform: rotate(360deg); } }