:root{color-scheme:light dark;font-family:system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}.center{max-width:22rem;margin:4rem auto;display:flex;flex-direction:column;gap:.5rem;padding:1rem}.error{color:#c0392b}.warn{color:#b8860b;font-size:.85rem}input,textarea,select,button{font:inherit;padding:.4rem}button{cursor:pointer}button.link{background:none;border:none;color:#3498db;text-decoration:underline}button.danger{color:#c0392b}.recovery-key{font-family:monospace;font-size:1.1rem;padding:1rem;background:#7f7f7f26;word-break:break-all;-webkit-user-select:all;user-select:all}.vault{display:grid;grid-template-columns:14rem 18rem 1fr;height:100vh}.sidebar{border-right:1px solid rgba(127,127,127,.3);padding:.75rem;display:flex;flex-direction:column;gap:.5rem;overflow-y:auto}.item-list{border-right:1px solid rgba(127,127,127,.3);margin:0;padding:0;list-style:none;overflow-y:auto}.item-list li button{display:flex;flex-direction:column;align-items:flex-start;width:100%;text-align:left;padding:.6rem;border:none;border-bottom:1px solid rgba(127,127,127,.15);background:none}.item-list li button.selected{background:#3498db26}.item-list .subtitle{font-size:.8rem;opacity:.7}.item-detail{padding:1rem;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem}.item-detail .field{display:flex;gap:.5rem;align-items:center}.item-detail .field .label{width:4rem;opacity:.6;font-size:.85rem}.dialog{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;height:max-content;max-width:24rem;background:Canvas;border:1px solid rgba(127,127,127,.4);padding:1.5rem;display:flex;flex-direction:column;gap:.5rem;box-shadow:0 8px 40px #0000004d}.tags{list-style:none;padding:0;margin:0}.tags button.active{font-weight:700}.totp code{font-size:1.2rem;letter-spacing:.1em}.totp-countdown{margin-left:.5rem;opacity:.6}@media (max-width: 40rem){.vault{grid-template-columns:1fr}}