/* Hosted platform additions to app.css (copied from app-local unchanged):
   account menu, sign-in pages, security and admin. Same palette. */
.topbar .account { display: flex; align-items: center; gap: 14px; }
.topbar .org { color: var(--ink); font-weight: 500; text-decoration: none; }
.menu { position: relative; }
.menu summary { cursor: pointer; list-style: none; color: var(--mute); padding: 6px 10px; border-radius: 7px; }
.menu summary::-webkit-details-marker { display: none; }
.menu summary:hover { background: #f4f5f7; color: var(--ink); }
.menu-body { position: absolute; right: 0; top: 36px; min-width: 180px; padding: 8px; display: flex; flex-direction: column; gap: 4px; z-index: 5; }
.menu-body a, .menu-body .link { padding: 6px 8px; font-size: 14px; text-align: left; text-decoration: none; }
.menu-body form { margin: 0; }
.narrow-page { max-width: 620px; margin: 0 auto; }
.narrow-page .form { grid-template-columns: 180px 1fr; }
.pad { padding: 16px 20px; margin-bottom: 16px; }
.card + .card, .card + form, form + .card { margin-top: 16px; }
.pad h2 { margin-bottom: 8px; }
h2.section { margin: 24px 0 10px; }
.secret { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 18px; letter-spacing: .06em; background: #f4f5f7; padding: 10px 14px; border-radius: 6px; word-break: break-all; }
.qr { background: #fff; display: inline-block; padding: 8px; border: 1px solid #e3e5e8; border-radius: 6px; margin: 4px 0 12px; }
.qr svg { display: block; }
.codes { columns: 2; font-family: ui-monospace, "SF Mono", Menlo, monospace; padding-left: 20px; }
input[type=password] { border: 1px solid var(--line); border-radius: 6px; padding: 7px 10px; background: #fff; color: var(--ink); line-height: 1.3; }
.form input[type=password] { width: 100%; max-width: 440px; }
@media (max-width: 720px) {
  .topbar { flex-wrap: wrap; gap: 10px; padding: 10px 16px; }
  .topbar nav { overflow-x: auto; max-width: 100%; }
  .page { padding: 16px; }
  .form, .narrow-page .form { grid-template-columns: 1fr; }
}
tr.changed td { background: #fff8ea; }
/* Password meter (password_meter.js): weak red, OK amber, strong green. */
.password-meter { display: flex; align-items: center; gap: 10px; margin-top: 6px; min-height: 18px; font-size: 13px; color: var(--mute); }
.password-meter .bar { display: inline-flex; gap: 4px; }
.password-meter .bar span { width: 38px; height: 6px; border-radius: 3px; background: var(--line); }
.password-meter[data-level="weak"] .bar span:nth-child(1) { background: var(--fail); }
.password-meter[data-level="ok"] .bar span:nth-child(-n+2) { background: var(--warn); }
.password-meter[data-level="good"] .bar span { background: var(--ok); }
.password-meter[data-level="weak"] .label { color: var(--fail); }
.password-meter[data-level="ok"] .label { color: var(--warn); }
.password-meter[data-level="good"] .label { color: var(--ok); }
.password-match { margin-top: 6px; min-height: 18px; font-size: 13px; }
.password-match[data-state="match"] { color: var(--ok); }
.password-match[data-state="differ"] { color: var(--fail); }
button:disabled, .btn:disabled { opacity: .5; cursor: not-allowed; }