/* 비밀번호 점검 · 생성기 — 앱 전용 스타일(공통은 css/site.css 사본) */
:root { --accent: #b45309; --accent-soft: #fef3c7; }
.pw-two { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }
.pw-in { display: flex; gap: 8px; }
.pw-in input { flex: 1; min-width: 0; font-family: var(--mono); font-size: 1.05rem; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius); }
.pw-in input:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.meter { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; margin: 12px 0 6px; }
.meter .bar { height: 10px; }
.meter .bar > i { transition: width .25s, background .25s; }
.meter b { min-width: 72px; text-align: right; }
.s0 > i { background: #dc2626; } .s1 > i { background: #f97316; } .s2 > i { background: #eab308; } .s3 > i { background: #16a34a; } .s4 > i { background: #047857; }
h3 { font-size: .95rem; margin: 14px 0 6px; color: var(--muted); }
.tips, .guide { margin: 0; padding-left: 1.2em; font-size: .92rem; }
.tips li, .guide li { margin: 4px 0; }
.tips li.ok { color: #047857; list-style: '✓ '; }
.tips li.bad { list-style: '• '; }
.leak { margin: 10px 0 0; padding: 10px 12px; border-radius: var(--radius); font-weight: 600; font-size: .92rem; }
.leak.bad { background: #fee2e2; color: #991b1b; } .leak.ok { background: #dcfce7; color: #166534; } .leak.err { background: var(--soft); color: var(--muted); }
.g-opts { display: grid; gap: 8px; margin-top: 12px; }
.rng { display: grid; grid-template-columns: 90px 1fr 40px; align-items: center; gap: 10px; font-size: .9rem; }
.rng output { text-align: right; font-family: var(--mono); font-weight: 600; }
.rng select { width: auto; justify-self: start; }
.chk { display: flex; gap: 8px; align-items: center; font-size: .92rem; }
.gen-out { display: block; font-family: var(--mono); font-size: 1.15rem; word-break: break-all; padding: 14px; background: var(--soft); border-radius: var(--radius); min-height: 3.2em; line-height: 1.5; user-select: all; }
@media (max-width: 900px) { .pw-two { grid-template-columns: 1fr; } }