*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

/* BODY */
body{
  background:#000;
  color:#00ff88;
  font-family:'Share Tech Mono', monospace;

  width:100%;
  min-height:100vh;
  overflow-y:auto;
  overflow-x:hidden;

  padding:20px;
  padding-top:20px;
}

/* TERMINAL */
.terminal{
  width:100%;

  /* REMOVE A ALTURA FIXA */
  height:auto;

  min-height:100vh;
}


/* =========================
   CÓDIGO DE BARRAS
========================= */

.barcode-box{

    position:relative;

    width:96%;
    max-width:1200px;

    margin:18px auto 40px auto;

    padding:10px 18px 4px;

    border-radius:12px;

    background:#050505;

    overflow:hidden;
}

/* BARRAS */
#barcode{

    width:100%;
    height:95px;

    display:flex;

    align-items:flex-end;

    justify-content:center;

    gap:2px;
}

/* LINHAS */
.bar{

    background:#00ff88;

    border-radius:1px;

    animation:pulseBar 2s infinite ease-in-out;
}

/* TEXTO */
.barcode-text{

    margin-top:6px;

    text-align:center;

    color:#00ff88;

    font-size:2.2rem;

    letter-spacing:5px;

    text-shadow:
    0 0 5px #00ff88;
}

/* ANIMAÇÃO */
@keyframes pulseBar{

    0%{
        opacity:0.6;
    }

    50%{
        opacity:1;
    }

    100%{
        opacity:0.6;
    }
}

/* MOBILE */
@media(max-width:700px){

    .barcode-box{
        width:100%;
        padding:8px 10px 2px;
    }

    #barcode{
        height:70px;
        gap:1px;
    }

    .barcode-text{

        font-size:1.3rem;

        letter-spacing:2px;
    }
}

/* BODY */
body{
  padding-top:20px;
}
  padding-top:45px;
}