.password-section { max-width: 980px; margin-inline: auto; }
.password-heading { max-width: 760px; }
.password-card { padding: clamp(1.25rem, 4vw, 2.4rem); overflow: hidden; }
.password-output-shell { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; }
.password-output { width: 100%; min-width: 0; padding: 1rem 1.1rem; border: 1px solid rgba(96, 229, 255, .32); border-radius: 14px; background: rgba(5, 12, 28, .9); color: #f4f5ff; box-shadow: inset 0 0 20px rgba(66, 114, 255, .06), 0 0 24px rgba(108, 92, 255, .06); font: 600 clamp(.98rem, 2.2vw, 1.25rem)/1.4 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .035em; }
.password-output:focus { outline: 2px solid rgba(96, 229, 255, .38); outline-offset: 2px; }
.password-copy { min-width: 108px; }
.strength-row { display: grid; grid-template-columns: minmax(140px, 1fr) auto auto; align-items: center; gap: .8rem; margin: 1rem 0 1.5rem; color: #9ca7bc; font-size: .82rem; }
.strength-row strong { color: #6df59a; text-transform: uppercase; letter-spacing: .12em; }
.strength-track { height: 5px; overflow: hidden; border-radius: 999px; background: rgba(117, 132, 174, .16); }
.strength-track span { display: block; height: 100%; width: 75%; border-radius: inherit; background: linear-gradient(90deg, #48db8b, #67f6ba); box-shadow: 0 0 14px rgba(72, 219, 139, .65); transition: width .2s ease, background .2s ease; }
.password-controls { display: grid; grid-template-columns: minmax(210px, .8fr) minmax(280px, 1.2fr); gap: 1.25rem; margin: 1.2rem 0; }
.length-control, .password-options label { border: 1px solid rgba(184, 176, 255, .12); border-radius: 14px; background: rgba(8, 15, 31, .66); }
.length-control { display: grid; grid-template-columns: 1fr auto; align-content: center; gap: 1.2rem; padding: 1.1rem; color: #dce2f4; }
.length-control strong { color: #66f3ae; font-size: 1.35rem; }
.length-control input { grid-column: 1 / -1; width: 100%; accent-color: #70a5ff; }
.password-options { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.password-options label { display: flex; align-items: center; gap: .6rem; padding: .85rem .95rem; color: #dce2f4; cursor: pointer; }
.password-options input { width: 18px; height: 18px; accent-color: #65ed9c; }
.password-option-wide { grid-column: 1 / -1; }
.password-feedback { min-height: 1.4em; margin: 0 0 .65rem; color: #ffbd69; }
.password-generate { width: 100%; }
.password-privacy { margin: 1rem 0 0; color: #8d98ad; text-align: center; font-size: .8rem; }
.password-privacy span { color: #5cf39b; margin-right: .4rem; }
@media (max-width: 700px) {
  .password-output-shell { grid-template-columns: 1fr; }
  .password-copy { width: 100%; }
  .password-controls { grid-template-columns: 1fr; }
  .strength-row { grid-template-columns: 1fr auto; }
  .strength-track { grid-column: 1 / -1; }
}
