.meter{
height:10px;
border-radius:999px;
background:#0e1326;
border:1px solid rgba(255,255,255,.08);
overflow:hidden
}

.bar{
height:100%;
width:0%;
transition:width .3s ease
}

.bar.bad{
background:#ef4444
}

.bar.warn{
background:#f59e0b
}

.bar.ok{
background:#22c55e
}

.bar.great{
background:#60a5fa
}

.hidden{
  display:none;
}

.toast{

position:fixed;

bottom:30px;
left:50%;

transform:
translateX(-50%);

background:#111827;
color:#fff;

padding:14px 22px;

border-radius:14px;

font-size:15px;
font-weight:600;

box-shadow:
0 12px 40px rgba(0,0,0,.35);

z-index:9999;

opacity:1;

transition:
opacity .25s ease,
transform .25s ease;

}

.toast.hidden{

opacity:0;

transform:
translateX(-50%)
translateY(20px);

pointer-events:none;

}

#seo-block h3{

  margin-top:28px;

  margin-bottom:10px;

}

#seo-block h3:first-of-type{

  margin-top:0;

}

.history-item{

  margin-top:8px;

  padding:10px;

  border-radius:8px;

  background:rgba(255,255,255,.04);

  font-family:monospace;

  word-break:break-all;

  cursor:pointer;

}

.multi-passwords{

  margin-top:20px;

}

#generatedPasswords{

  display:none;

}

.copied-badge{

  margin-left:10px;

  font-size:.9rem;

  font-weight:600;

  color:#22c55e;

}

.history-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.history-box{
  margin-top: 32px;
}

.settings-card{

  margin-top:24px;

  padding:24px;

  border:1px solid rgba(
    255,255,255,.08
  );

  border-radius:16px;

  background:rgba(
    255,255,255,.02
  );

}

.batch-actions{

  display:flex;

  gap:12px;

  margin-top:16px;

}
