/* Scoped vault layout: readable at 320px without shrinking the whole page. */
html[data-manage-view="vault"] .app{max-width:1080px;min-width:0}
html[data-manage-view="vault"] .card{min-width:0}
html[data-manage-view="vault"] h1{font:750 clamp(23px,3vw,30px)/1.25 var(--display);letter-spacing:-.035em;margin:0;overflow-wrap:anywhere}
html[data-manage-view="vault"] .card h2{font-size:21px;overflow-wrap:anywhere}
.vault-unlock-card{max-width:620px;margin:14px auto;padding:32px}
.vault-heading{display:flex;align-items:center;gap:15px;margin-bottom:22px}
.vault-heading>div{min-width:0}
.vault-symbol{display:grid;place-items:center;width:50px;height:50px;flex:none;border-radius:15px;background:var(--grad);color:#fff;box-shadow:0 8px 25px #8b7bff22}
.vault-symbol svg{width:27px;height:27px}
.vault-eyebrow{font-size:10px;font-weight:750;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin:0 0 6px}
.vault-unlock-card .lead{font-size:14px;line-height:1.7;margin-bottom:24px}
#vault-unlock>.btn{width:100%;min-height:48px}
#vault-unlock-status:empty{display:none}
#vault-unlock-status,#vault-recovery-status,#vault-rekey-status{overflow-wrap:anywhere;font-size:13px}
.vault-recovery-hint{border-top:1px solid var(--line);padding-top:20px;margin:22px 0 16px;line-height:1.7}
.vault-security-details{margin-top:20px;border-top:1px solid var(--line);padding-top:15px}
.vault-security-details summary{font-size:12px;font-weight:650;color:var(--muted);cursor:pointer;padding:6px 0;min-height:32px}
.vault-security-details p{line-height:1.8;overflow-wrap:anywhere}
.vault-open-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.vault-open-heading>div{min-width:0}.vault-open-heading>.btn{flex:none;min-height:44px}
.vault-open-heading h1{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.vault-open-heading p.small{margin:9px 0 0;font-size:12px}
.vault-count{display:inline-block;font:650 11px/1.4 var(--font);letter-spacing:0;padding:4px 9px;border-radius:20px;border:1px solid var(--line);background:var(--card-hi);color:var(--muted)}
#vault-master-check{padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--card-hi);font-size:12px;line-height:1.6;margin:20px 0}
.vault-toolbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:0 0 20px}
.vault-toolbar .btn{width:100%;min-height:44px;font-size:12px;line-height:1.4;padding:10px}
.vault-search-field{margin:0 0 18px}.vault-search-field .input{min-height:46px}
.vault-entry{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:14px;align-items:start;border:1px solid var(--line);border-radius:15px;padding:18px;margin:10px 0;background:var(--card-hi);min-width:0}
.vault-entry-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--bg2);font-size:22px;color:var(--acc);overflow:hidden}
.vault-entry-icon img{object-fit:contain;max-width:32px;max-height:32px}
.vault-entry-main{min-width:0}.vault-entry-main h3{margin:0;font-size:16px;line-height:1.4;overflow-wrap:anywhere}
.vault-entry-main p{font-size:12px;margin:5px 0;line-height:1.6;overflow-wrap:anywhere}.vault-entry-main a{font-size:12px;overflow-wrap:anywhere}
.vault-entry-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px;max-width:285px;justify-content:flex-end}
.vault-entry-actions .btn{min-height:40px;font-size:12px;padding:9px 12px;white-space:normal}
.vault-risk{border-color:#e66c8666;background:color-mix(in srgb,var(--card) 96%,#f15f7e)}
.vault-warning{color:var(--muted)!important;font-weight:450}.vault-risk .vault-warning{color:#e3486a!important;font-weight:650}
:root:not([data-theme="light"]) .vault-risk .vault-warning{color:#ff8fa8!important}
#vault-recovery{max-width:760px;margin:0 auto}#vault-recovery>h1{margin-bottom:20px}
#vault-recovery-stage{margin-top:22px}#vault-recovery-verify{margin-top:22px;padding-top:22px;border-top:1px solid var(--line)}
#vault-email-code{max-width:260px;font:650 22px/1.4 var(--mono);letter-spacing:.22em}
#vault-rekey>button{margin:0 0 10px;max-width:100%;white-space:normal}#vault-rekey details,#vault-edit-form details{margin:16px 0}
#vault-edit-form .row{align-items:stretch}#vault-edit-form .row>.btn{flex:1;min-height:44px;white-space:normal}
#vault-edit-form details summary,#vault-rekey details summary{font-size:13px;line-height:1.6;cursor:pointer;margin-bottom:16px}
#vault-edit-form .field,#vault-rekey .field{min-width:0}
.dialog:has(#vault-edit-form){width:min(620px,100%);max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;min-width:0}
#vault-edit-form>.row:last-of-type{position:sticky;bottom:-26px;margin-top:16px;padding:14px 0;background:var(--card-solid);border-top:1px solid var(--line);z-index:2}
@media(max-width:900px){.vault-entry{grid-template-columns:42px minmax(0,1fr)}.vault-entry-actions{grid-column:2;max-width:none;justify-content:flex-start}.vault-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){
  html[data-manage-view="vault"] .app{padding:14px 12px calc(88px + env(safe-area-inset-bottom))}
  html[data-manage-view="vault"] .card{padding:20px;border-radius:18px}
  .vault-unlock-card{margin:0 auto}.vault-heading{gap:12px;margin-bottom:18px}.vault-symbol{width:44px;height:44px;border-radius:13px}.vault-symbol svg{width:25px;height:25px}
  html[data-manage-view="vault"] .vault-heading h1{font-size:24px}.vault-eyebrow{font-size:9px;letter-spacing:.11em}
  .vault-unlock-card .lead{font-size:13px;margin-bottom:20px}.vault-recovery-hint{font-size:12px;padding-top:17px;margin-top:20px}
  .vault-open-heading{gap:10px}.vault-open-heading h1{font-size:25px!important;gap:8px}.vault-open-heading p.small{font-size:11px;line-height:1.6}
  #vault-master-check{font-size:11px;margin:17px 0;padding:10px 12px}.vault-toolbar{gap:8px;margin-bottom:18px}.vault-toolbar .btn{font-size:12px;min-height:46px;padding:10px 8px}
  .vault-entry{padding:14px;gap:11px;grid-template-columns:36px minmax(0,1fr);border-radius:13px}.vault-entry-icon{width:36px;height:36px;font-size:20px}.vault-entry-icon img{max-width:28px;max-height:28px}
  .vault-entry-main h3{font-size:15px}.vault-entry-main p,.vault-entry-main a{font-size:12px}.vault-entry-actions{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;padding-top:9px;border-top:1px solid var(--line);gap:6px}.vault-entry-actions .btn{width:100%;min-height:44px;font-size:12px;padding:9px 3px}
  html[data-manage-view="vault"] .input{font-size:16px;min-width:0;min-height:46px;padding:11px 12px}
  html[data-manage-view="vault"] .field>span{font-size:12px;line-height:1.6}
  #vault-recovery .btn,#vault-rekey>.btn,#vault-recovery-verify>.btn{min-height:46px;max-width:100%;white-space:normal;line-height:1.5;font-size:13px}
  #vault-send-code,#vault-rekey>button[type=submit],#vault-recovery-verify>.btn{width:100%}
  .dialog:has(#vault-edit-form){padding:20px 16px;max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
  #vault-edit-form>.row:last-of-type{bottom:-20px}
  #vault-edit-form .input{font-size:16px;min-height:46px}#vault-edit-form .btn{font-size:12px}#vault-edit-form .grid{gap:12px}
  #vault-edit-form .row>.btn{flex-basis:100%}#vault-recovery .note{font-size:12px;padding:14px;line-height:1.7}
}
@media(max-width:360px){html[data-manage-view="vault"] .app{padding-left:8px;padding-right:8px}html[data-manage-view="vault"] .card{padding:16px}.vault-heading{align-items:flex-start}.vault-symbol{width:36px;height:36px}.vault-heading h1{font-size:22px!important}.vault-entry{padding:11px;gap:9px}.vault-entry-actions .btn{font-size:11px}.vault-count{font-size:10px}.vault-toolbar .btn{font-size:11px}}
