/* security.css — 密码输入、两步验证、安全概览、后台用户详情 */
.pw-wrap { position: relative; }
.pw-wrap input { width: 100%; padding-right: 36px; }
.pw-eye { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); border: 0; background: transparent; color: var(--faint);
  width: 28px; height: 28px; border-radius: var(--radius-sm); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.pw-eye:hover, .pw-eye.on { color: var(--acc); }
.pw-rules { list-style: none; padding: 0; margin: 0 0 14px; font-size: 12px; color: var(--faint); display: grid; gap: 3px; }
.pw-rules li { display: flex; align-items: center; gap: 6px; }
.pw-rules li.ok { color: var(--green); }
.pw-rules li.bad { color: var(--danger); }
.pw-match { margin: -6px 0 12px; min-height: 16px; }
.pw-match.ok { color: var(--green); } .pw-match.bad { color: var(--danger); }
.pw-meter.s0 i { background: var(--border); }

.otp-input { font-family: var(--mono, ui-monospace, monospace); font-size: 22px; letter-spacing: 8px; text-align: center; max-width: 200px; }
.auth-card .otp-input { max-width: none; width: 100%; }
.otp-ic { display: inline-flex; width: 56px; height: 56px; border-radius: 50%; align-items: center; justify-content: center; background: var(--acc-soft); color: var(--acc); }

.sec-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 4px 0 4px; }
@media (max-width: 760px) { .sec-overview { grid-template-columns: 1fr; } }
.sec-tile { display: flex; gap: 12px; align-items: center; border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; background: #fff; }
.sec-tile > .icon, .sec-tile > span:first-child { color: var(--faint); }
.sec-tile.ok > span:first-child { color: var(--green); }
.sec-tile.warn > span:first-child { color: #c27c0e; }
.sec-tile b { font-size: 14px; }

.tfa-setup { display: flex; gap: 24px; align-items: flex-start; flex-wrap: wrap; }
.tfa-qr { flex: none; width: 196px; height: 196px; border: 1px solid var(--border); border-radius: var(--radius); background: #fff;
  display: flex; align-items: center; justify-content: center; padding: 8px; }
.tfa-qr img { width: 180px; height: 180px; image-rendering: pixelated; }
.tfa-steps { margin: 0 0 14px; padding-left: 20px; font-size: 13.5px; display: grid; gap: 8px; }
.tfa-steps .token-val { margin: 6px 0 0; }
.rc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; background: #fff; border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 12px 16px; }
.rc-grid code { font-size: 14px; letter-spacing: .5px; }

.adm-user-head { display: flex; gap: 16px; align-items: center; }
.adm-user-head .avatar { width: 64px; height: 64px; font-size: 26px; }
.adm-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.adm-actions .btn { justify-content: flex-start; }
tr.row-bad td { background: var(--danger-soft); }