/* Imported scanner styles scoped to its section. */
#all-in-one .card-scanner-container {
          position: relative;
          width: 100%;
          height: 100vh;
          display: flex;
          align-items: center;
          justify-content: center;
          background: #000000;
          overflow: hidden;
        }#all-in-one .card-stream {
          position: absolute;
          width: 100%;
          height: 180px;
          display: flex;
          align-items: center;
          overflow: visible;
        }#all-in-one .card-line {
          display: flex;
          align-items: center;
          gap: 60px;
          white-space: nowrap;
          cursor: grab;
          user-select: none;
          will-change: transform;
        }#all-in-one .card-line:active {
          cursor: grabbing;
        }#all-in-one .card-line.dragging {
          cursor: grabbing;
        }#all-in-one .card-wrapper {
          position: relative;
          width: 400px;
          height: 250px;
          flex-shrink: 0;
        }#all-in-one .card {
          position: absolute;
          top: 0;
          left: 0;
          width: 400px;
          height: 250px;
          border-radius: 15px;
          overflow: hidden;
        }#all-in-one .card-normal {
          background: transparent;
          box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          padding: 0;
          color: white;
          z-index: 2;
          position: relative;
          overflow: hidden;
          clip-path: inset(0 0 0 var(--clip-right, 0%));
        }#all-in-one .card-image {
          width: 100%;
          height: 100%;
          object-fit: cover;
          border-radius: 15px;
          transition: all 0.3s ease;
          filter: brightness(1.1) contrast(1.1);
          box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.1);
        }#all-in-one .card-image:hover {
          filter: brightness(1.2) contrast(1.2);
        }#all-in-one .card-ascii {
          background: transparent;
          z-index: 1;
          position: absolute;
          top: 0;
          left: 0;
          width: 400px;
          height: 250px;
          border-radius: 15px;
          overflow: hidden;
          clip-path: inset(0 calc(100% - var(--clip-left, 0%)) 0 0);
        }#all-in-one .ascii-content {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          color: rgba(220, 210, 255, 0.6);
          font-family: 'Courier New', monospace;
          font-size: 11px;
          line-height: 13px;
          overflow: hidden;
          white-space: pre;
          animation: glitch 0.1s infinite linear alternate-reverse;
          margin: 0;
          padding: 0;
          text-align: left;
          vertical-align: top;
          box-sizing: border-box;
          -webkit-mask-image: linear-gradient(
            to right,
            rgba(0, 0, 0, 1) 0%,
            rgba(0, 0, 0, 0.8) 30%,
            rgba(0, 0, 0, 0.6) 50%,
            rgba(0, 0, 0, 0.4) 80%,
            rgba(0, 0, 0, 0.2) 100%
          );
          mask-image: linear-gradient(
            to right,
            rgba(0, 0, 0, 1) 0%,
            rgba(0, 0, 0, 0.8) 30%,
            rgba(0, 0, 0, 0.6) 50%,
            rgba(0, 0, 0, 0.4) 80%,
            rgba(0, 0, 0, 0.2) 100%
          );
        }

        @keyframes glitch {
          0% {
            opacity: 1;
          }
          15% {
            opacity: 0.9;
          }
          16% {
            opacity: 1;
          }
          49% {
            opacity: 0.8;
          }
          50% {
            opacity: 1;
          }
          99% {
            opacity: 0.9;
          }
          100% {
            opacity: 1;
          }
        }#all-in-one .scan-effect {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, 
    transparent, 
    rgba(135, 206, 250, 0.1) 40%, 
    rgba(135, 206, 250, 0.7) 50%, 
    rgba(135, 206, 250, 0.1) 60%, 
    transparent
  );
  /* Animação um pouco mais rápida */
  animation: scanEffect 0.5s ease-in-out;
  pointer-events: none;
  z-index: 5;
}

@keyframes scanEffect {
  0% {
    /* Começa inclinado e fora da tela */
    transform: translateX(-110%) skewX(-30deg);
    opacity: 0;
  }
  40% {
    /* Aparece e se move rapidamente para o início do cartão */
    transform: translateX(-30%) skewX(-30deg);
    opacity: 1;
  }
  60% {
    /* Passa pelo cartão */
    transform: translateX(30%) skewX(-30deg);
    opacity: 1;
  }
  100% {
    /* Desaparece inclinado do outro lado */
    transform: translateX(110%) skewX(-30deg);
    opacity: 0;
  }
}#all-in-one #particleCanvas {
          position: absolute;
          top: 50%;
          left: 0;
          transform: translateY(-50%);
          width: 100%;
          height: 250px;
          z-index: 0;
          pointer-events: none;
        }#all-in-one #scannerCanvas {
          position: absolute;
          top: 50%;
          left: -3px;
          transform: translateY(-50%);
          width: 100%;
          height: 300px;
          z-index: 15;
          pointer-events: none;
        }