:root{color-scheme:light;--accent: #4f56d6;--accent-hover: #434ac0;--accent-active: #3a40a8;--accent-soft: rgba(79, 86, 214, .1);--accent-ring: rgba(79, 86, 214, .35);--on-accent: #ffffff;--bg: #f6f6f7;--surface: #fcfcfd;--surface-hover: #f1f1f3;--surface-active: #ebebee;--elevated: #ffffff;--border: #e5e5e8;--border-strong: #d6d6da;--text: #1b1b1f;--text-secondary: #55555d;--text-muted: #86868f;--text-faint: #a8a8b0;--danger: #d1483b;--danger-hover: #b93a2f;--danger-soft: rgba(209, 72, 59, .1);--warn: #9a6a00;--success: #2f9461;--r-sm: 6px;--r-md: 8px;--r-lg: 10px;--r-full: 999px;--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 20px;--s6: 24px;--s8: 32px;--fs-xs: 12px;--fs-sm: 13px;--fs-base: 14px;--fs-md: 15px;--fs-lg: 16px;--fs-xl: 20px;--fs-2xl: 24px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--t: .16s cubic-bezier(.2, 0, 0, 1);--shadow-overlay: 0 16px 48px -12px rgba(20, 20, 30, .3), 0 4px 12px -6px rgba(20, 20, 30, .18)}@media (prefers-color-scheme: dark){:root{color-scheme:dark;--accent: #6c73e8;--accent-hover: #7c84f0;--accent-active: #8890f4;--accent-soft: rgba(108, 115, 232, .16);--accent-ring: rgba(108, 115, 232, .45);--on-accent: #ffffff;--bg: #161619;--surface: #1c1c20;--surface-hover: #26262b;--surface-active: #2d2d33;--elevated: #232328;--border: #2b2b31;--border-strong: #3a3a42;--text: #e7e7ea;--text-secondary: #b0b0b8;--text-muted: #83838d;--text-faint: #63636d;--danger: #e0685c;--danger-hover: #ec7a6f;--danger-soft: rgba(224, 104, 92, .14);--warn: #d0a24a;--success: #4bbd85;--shadow-overlay: 0 20px 56px -12px rgba(0, 0, 0, .6), 0 4px 12px -6px rgba(0, 0, 0, .5)}}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:var(--font);font-size:var(--fs-base);line-height:1.5;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}::selection{background:var(--accent-soft)}*{scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:var(--r-full);border:3px solid transparent;background-clip:content-box}*::-webkit-scrollbar-thumb:hover{background:var(--text-faint);background-clip:content-box}h1{font-size:var(--fs-2xl);font-weight:600;letter-spacing:-.01em;margin:0 0 var(--s2)}h2{font-size:var(--fs-xl);font-weight:600;letter-spacing:-.01em;margin:0 0 var(--s2)}h3{font-size:var(--fs-lg);font-weight:600;margin:0 0 var(--s2)}h4{font-size:var(--fs-md);font-weight:600;margin:0 0 var(--s1)}p{margin:0}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}hr{border:none;border-top:1px solid var(--border);margin:var(--s3) 0}code,kbd,pre{font-family:var(--font-mono)}.muted{color:var(--text-muted);font-size:var(--fs-sm)}.error{color:var(--danger);font-size:var(--fs-sm)}.warn{color:var(--warn);font-size:var(--fs-xs)}button{font:inherit;font-size:var(--fs-base);font-weight:500;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);padding:7px 12px;border-radius:var(--r-sm);border:1px solid var(--border-strong);background:var(--surface);color:var(--text);transition:background var(--t),border-color var(--t),color var(--t),opacity var(--t);white-space:nowrap;-webkit-user-select:none;user-select:none}button:hover{background:var(--surface-hover)}button:active{background:var(--surface-active)}button:disabled{opacity:.5;cursor:not-allowed}button[type=submit],button.primary{background:var(--accent);border-color:transparent;color:var(--on-accent)}button[type=submit]:hover,button.primary:hover{background:var(--accent-hover)}button[type=submit]:active,button.primary:active{background:var(--accent-active)}button.danger{background:transparent;border-color:var(--border-strong);color:var(--danger)}button.danger:hover{background:var(--danger-soft);border-color:var(--danger)}button.link{background:none;border:none;color:var(--accent);text-decoration:none;padding:4px 6px;font-weight:500}button.link:hover{background:var(--accent-soft);text-decoration:none}input,textarea,select{font:inherit;font-size:var(--fs-base);color:var(--text);background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--r-sm);padding:7px 10px;transition:border-color var(--t),box-shadow var(--t),background var(--t);width:100%}input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--accent)}textarea{resize:vertical;min-height:72px;line-height:1.55}input::placeholder,textarea::placeholder{color:var(--text-muted)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}:focus-visible{outline:none}button:focus-visible{box-shadow:0 0 0 3px var(--accent-ring)}label{font-size:var(--fs-sm);color:var(--text-secondary);display:inline-flex;align-items:center;gap:var(--s2)}.center{max-width:380px;margin:10vh auto;display:flex;flex-direction:column;gap:var(--s3);padding:var(--s6);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg)}.center h1{margin-bottom:var(--s1)}.center label{margin-top:var(--s1)}.center button{width:100%;padding:9px 12px}.center button.link{width:auto;align-self:flex-start;padding:4px 6px}.vault{display:grid;grid-template-columns:15rem 20rem 1fr;height:100vh;background:var(--bg)}.sidebar{border-right:1px solid var(--border);padding:var(--s3);display:flex;flex-direction:column;gap:var(--s1);overflow-y:auto;background:var(--surface)}.sidebar>button{justify-content:flex-start;width:100%;padding:7px var(--s2);border:none;background:none;color:var(--text-secondary);font-weight:500;border-radius:var(--r-sm)}.sidebar>button:hover{background:var(--surface-hover);color:var(--text)}.sidebar>button:active{background:var(--surface-active)}.sidebar>button .icon{color:var(--text-muted);flex:none}.sidebar>button:hover .icon{color:var(--text-secondary)}.sidebar>input{margin-top:var(--s3)}.sidebar>label{margin:var(--s2) var(--s1);font-size:var(--fs-sm)}.tags{list-style:none;padding:0;margin:var(--s2) 0 0;display:flex;flex-direction:column;gap:1px}.tags button{width:100%;justify-content:flex-start;border:none;background:none;color:var(--text-secondary);padding:5px var(--s2);font-size:var(--fs-sm);font-weight:400;border-radius:var(--r-sm)}.tags button:hover{background:var(--surface-hover);color:var(--text)}.tags button.active{background:var(--accent-soft);color:var(--accent);font-weight:500}.item-list{border-right:1px solid var(--border);margin:0;padding:var(--s2);list-style:none;overflow-y:auto;background:var(--bg);display:flex;flex-direction:column;gap:1px}.item-list li button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;padding:var(--s2) var(--s3);border:none;border-radius:var(--r-sm);background:none;font-weight:400;position:relative}.item-list li button:hover{background:var(--surface-hover)}.item-list li button.selected{background:var(--accent-soft)}.item-list li button.selected:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:2px;background:var(--accent);border-radius:var(--r-full)}.item-list .title{font-size:var(--fs-base);font-weight:500;color:var(--text)}.item-list li button.selected .title{color:var(--accent)}.item-list .subtitle{font-size:var(--fs-xs);color:var(--text-muted)}.item-list.empty{display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:var(--fs-sm)}.item-detail{padding:var(--s6);overflow-y:auto;display:flex;flex-direction:column;gap:var(--s4);background:var(--bg)}.item-detail.empty{align-items:center;justify-content:center;color:var(--text-muted);font-size:var(--fs-sm)}.item-detail h2,.item-detail h3{margin:0}.item-detail .field{display:flex;gap:var(--s3);align-items:baseline;padding:var(--s2) 0;border-bottom:1px solid var(--border)}.item-detail .field:last-of-type{border-bottom:none}.item-detail .field .label{width:5rem;flex:none;color:var(--text-muted);font-size:var(--fs-sm)}.item-detail .field .value,.item-detail .notes{font-size:var(--fs-md);word-break:break-word}.item-detail .notes{white-space:pre-wrap;color:var(--text-secondary)}.section{margin-top:var(--s2)}.section h4{color:var(--text-muted);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.04em}.url-row,.field-row{display:flex;gap:var(--s2);align-items:center}.attachments{display:flex;flex-direction:column;gap:var(--s2)}body:has(.dialog):before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#12121873;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:fade var(--t)}.dialog{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;z-index:50;height:max-content;max-height:86vh;width:calc(100% - 2rem);max-width:26rem;background:var(--elevated);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s6);display:flex;flex-direction:column;gap:var(--s3);overflow-y:auto;box-shadow:var(--shadow-overlay);animation:pop var(--t)}.dialog h3{margin-bottom:var(--s1)}.dialog.import-wizard,.dialog.audit,.version-history{max-width:40rem}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes pop{0%{opacity:0;transform:translateY(4px) scale(.99)}to{opacity:1;transform:none}}.recovery-key{font-family:var(--font-mono);font-size:var(--fs-md);line-height:1.7;padding:var(--s4);background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);word-break:break-all;-webkit-user-select:all;user-select:all;color:var(--text)}.totp code{font-family:var(--font-mono);font-size:var(--fs-lg);letter-spacing:.12em;color:var(--text)}.totp-countdown{margin-left:var(--s2);color:var(--text-muted);font-size:var(--fs-sm);font-variant-numeric:tabular-nums}.strength,.score{font-variant-numeric:tabular-nums}.generator{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s3);background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md)}.preview{border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden}.item-editor{display:flex;flex-direction:column;gap:var(--s3)}@media (max-width: 52rem){.vault{grid-template-columns:1fr;grid-auto-rows:min-content;height:auto;min-height:100vh}.sidebar{flex-direction:row;flex-wrap:wrap;border-right:none;border-bottom:1px solid var(--border)}}
