/* sassi/shared/lock-cards.css - the look of the app-lock cards (shared/php/lock_cards.php), one file for every assistant
 * (owner 2026-09-15). tasks' component rules, scoped to the cards and their sheets so an app's own .row / .badge / .ibtn list
 * styles never change them; loaded after app.css. Canonical in sassi/shared, byte-identical in every public_html/assets/. */
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .ibtn{width:34px;height:34px;padding:0;border-radius:50%;background:transparent;color:var(--dim);display:inline-flex;align-items:center;justify-content:center;font-size:14px}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .ibtn:hover{background:var(--hover);color:var(--txt)}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .ibtn.danger:hover{background:rgba(248,113,113,.12);color:var(--bad)}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .row{display:flex;align-items:center;gap:.6rem;padding:10px 0;border-bottom:1px solid var(--line)}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .row .grow{flex:1;min-width:0}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .row .ttl{font-size:14.5px;font-weight:500;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .row .meta{font-size:12px;color:var(--dim);font-weight:300;display:flex;flex-wrap:wrap;gap:.25rem .7rem;margin-top:.15rem}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .row .meta>span,:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .row .meta .num{font:inherit;font-size:12px;max-height:999999px;-webkit-text-size-adjust:none;text-size-adjust:none}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .hint{color:var(--dim);font-size:12px;font-weight:300;margin:.5rem 0 0}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .badge{display:inline-block;font-size:12px;font-weight:400;line-height:1.4;padding:.1rem .55rem;border-radius:var(--r-pill);background:var(--hover);color:var(--dim);white-space:nowrap;font-family:inherit}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .frm.narrow{max-width:440px}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .grow{flex:1;min-width:0}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .help{width:18px;height:18px;padding:0;border-radius:50%;font-size:11px;font-weight:700;line-height:18px;text-align:center;background:var(--hover);color:var(--dim);vertical-align:middle;display:inline-block;flex:none}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .help:hover,:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) .help.on{background:var(--acSoft);color:var(--acText)}
:is(#s-lock,#s-codes,#s-vault,#pin-sheet,#bio-sheet,#codes-sheet) button.danger{background:rgba(248,113,113,.15);color:var(--bad)}
/* the vault: its card (shared/php/vault_card.php) and the locked-item plate / toggle / meter in the item views */
.vault-mark{color:var(--dim);font-size:.85em}
.vault-plate{display:flex;align-items:center;padding:.6rem 0}
.vault-plate button{display:inline-flex;align-items:center;gap:6px}
.vault-plain{white-space:pre-wrap}
.vault-toggle{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px;font-size:13.5px}
.vault-toggle .hint{margin:0}
form.vault-locked .dropzone,form.vault-locked .att-add,form.vault-locked .att-thumbs{display:none}
.vault-skip{margin:.2rem 0 .6rem}
.vault-h{margin:0 0 .4rem;font-size:17px}
.vault-row{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-start}
.vault-link{background:none;border:0;padding:0;color:var(--dim);text-decoration:underline;align-self:flex-start;font-size:13px}
.vault-ack{display:flex;flex-direction:row;align-items:center;gap:6px}
.vault-key{padding:.6rem .7rem;background:var(--card);border-radius:8px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:15px;text-align:center;word-break:break-all;unicode-bidi:isolate}
.vault-meter{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--dim);margin-top:-2px}
.vault-meter i{flex:1;height:5px;border-radius:3px;background:var(--card);position:relative;overflow:hidden}
.vault-meter i::after{content:"";position:absolute;inset-block:0;inset-inline-start:0;width:calc(var(--s,0) * 25%);background:#ef4444}
.vault-meter[data-s="2"] i::after{background:#f59e0b}
.vault-meter[data-s="3"] i::after,.vault-meter[data-s="4"] i::after{background:#10b981}
#vault-phrase-ov input{margin:.6rem 0}
.vault-user{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;border:0;padding:0;margin:0} /* the password manager's username, never seen */