:root{--bg: #eef2f5;--ink: #14202b;--muted: #43525f;--card: #fff;--primary: #0b5d5e;--primary-ink: #fff;--line: #b9c6d0;--focus: #c25a00;--weak: #b3261e;--ok: #b86e00;--good: #2e7d32;--great: #0b5d5e}*{box-sizing:border-box}html{font-size:20px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Verdana,Atkinson Hyperlegible,system-ui,sans-serif;line-height:1.6}main{max-width:46rem;margin:0 auto;padding:1.5rem 1rem 3rem}h1{font-size:2.2rem;margin:0 0 .5rem;line-height:1.2}h2{font-size:1.5rem;margin:0 0 1rem}h3{font-size:1.2rem;margin:0 0 .5rem}.lead{font-size:1.1rem;color:var(--muted);margin:0 0 2rem}section{background:var(--card);border:2px solid var(--line);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}fieldset{border:0;padding:0;margin:0 0 1.25rem}legend{font-weight:700;margin-bottom:.6rem;padding:0}button{font:inherit;cursor:pointer;border-radius:10px;min-height:3.2rem;padding:.6rem 1.2rem;border:2px solid var(--primary);background:#fff;color:var(--ink)}button:hover{background:#e3f0f0}:focus-visible{outline:4px solid var(--focus);outline-offset:3px}.choice{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.choice.three{grid-template-columns:repeat(3,1fr)}.choice button{display:flex;flex-direction:column;gap:.2rem;text-align:left}.choice.three button{text-align:center}.choice span{font-size:.8rem;color:var(--muted)}.choice button.on{background:var(--primary);color:var(--primary-ink)}.choice button.on span{color:#dcefef}.check{display:flex;gap:.75rem;align-items:flex-start;margin-bottom:1.25rem}.check input{width:1.6rem;height:1.6rem;flex:none;margin-top:.15rem;accent-color:var(--primary)}.result{border:3px solid var(--primary);border-radius:12px;padding:1.25rem;background:#f7fbfb}.label{margin:0;color:var(--muted)}.pw{font-family:Courier New,ui-monospace,monospace;font-size:1.7rem;font-weight:700;word-break:break-all;margin:.4rem 0 1rem;letter-spacing:.03em}.meter{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.25rem}.bar{flex:1 1 8rem;height:1rem;background:#d9e2e8;border-radius:99px;overflow:hidden}.bar div{height:100%;transition:width .3s}.weak{background:var(--weak)}.ok{background:var(--ok)}.good{background:var(--good)}.great{background:var(--great)}.actions{display:flex;gap:.75rem;flex-wrap:wrap}.actions button{flex:1 1 12rem;font-weight:700}button.primary{background:var(--primary);color:var(--primary-ink)}button.primary:hover{background:#084a4b}.hint{font-size:.85rem;color:var(--muted);margin:.9rem 0 0}.tip{background:#fff8e6;border:2px solid #e0b64a;border-radius:12px;padding:1.25rem}.tip p{margin:0 0 1rem}.tipnav{display:flex;justify-content:space-between;align-items:center;gap:.5rem;flex-wrap:wrap}.tipnav span{font-size:.85rem;color:var(--muted)}.warn{background:#fdeceb;border-left:6px solid var(--weak);padding:.75rem 1rem;border-radius:6px}.links{list-style:none;padding:0;margin:1rem 0 0;display:grid;gap:.9rem}.links li{border:2px solid var(--line);border-radius:10px;padding:.9rem 1rem}.links a{color:var(--primary);font-weight:700;font-size:1.05rem}.links p{margin:.3rem 0 0;font-size:.9rem;color:var(--muted)}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}footer{text-align:center;font-size:.8rem;color:var(--muted)}.fade-enter-active,.fade-leave-active{transition:opacity .25s}.fade-enter-from,.fade-leave-to{opacity:0}@media (max-width: 480px){.choice{grid-template-columns:1fr}.pw{font-size:1.4rem}}@media (prefers-reduced-motion: reduce){*{transition:none!important}}