@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap";:root{--bg-main: #FAFAFA;--bg-main-rgb: 250, 250, 250;--bg-card: #FFFFFF;--bg-card-hover: #F5F5F5;--bg-input: #FFFFFF;--bg-modal: #FFFFFF;--text-primary: #171717;--text-secondary: #525252;--text-muted: #737373;--primary: #171717;--primary-content: #FFFFFF;--primary-hover: #262626;--primary-light: rgba(23, 23, 23, .08);--accent: #7C3AED;--accent-content: #FFFFFF;--accent-hover: #6D28D9;--destructive: #DC2626;--destructive-hover: #B91C1C;--border-color: #E2E8F0;--border-focus: #1E3A5F;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);--shadow-md: 0 4px 6px -1px rgba(15, 23, 42, .05), 0 2px 4px -1px rgba(15, 23, 42, .03);--shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, .05), 0 4px 6px -2px rgba(15, 23, 42, .02);--radius: 16px;--radius-lg: 24px;--radius-full: 9999px;--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;--transition: all .2s cubic-bezier(.34, 1.56, .64, 1)}[data-theme=dark]{--bg-main: #0A0A0A;--bg-main-rgb: 10, 10, 10;--bg-card: #171717;--bg-card-hover: #262626;--bg-input: #171717;--bg-modal: #171717;--text-primary: #FAFAFA;--text-secondary: #A3A3A3;--text-muted: #737373;--primary: #FAFAFA;--primary-content: #171717;--primary-hover: #E5E5E5;--primary-light: rgba(250, 250, 250, .15);--accent: #A78BFA;--accent-content: #171717;--accent-hover: #C4B5FD;--destructive: #F87171;--destructive-hover: #EF4444;--border-color: #1E293B;--border-focus: #38BDF8;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .5);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .6), 0 2px 4px -1px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .6), 0 4px 6px -2px rgba(0, 0, 0, .4)}*{box-sizing:border-box;margin:0;padding:0}body,input,button,select,textarea{font-family:var(--font-sans)}body{background-color:var(--bg-main);color:var(--text-primary);min-height:100vh;display:flex;flex-direction:column;transition:background-color .3s ease,color .3s ease;overflow-x:hidden}.app-container{max-width:840px;width:100%;margin:0 auto;padding:2rem 1.25rem;flex:1}.app-header{display:flex;justify-content:space-between;align-items:center;padding:2rem 0 1rem;margin-bottom:0}.brand-logo{display:flex;align-items:center;gap:.75rem;font-size:1.5rem;font-weight:700;letter-spacing:-.025em;color:var(--text-primary)}.brand-icon{width:44px;height:44px;background:var(--accent);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:var(--accent-content);box-shadow:0 4px 12px #7c3aed40}.header-actions{display:flex;gap:.5rem}.glass-panel{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:2.5rem 2rem;transition:var(--transition)}.lock-wrapper{max-width:420px;margin:3rem auto 0;text-align:left;border-radius:var(--radius-lg)}.lock-shield-icon{width:64px;height:64px;background:var(--primary-light);color:var(--primary);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem}.lock-title{font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.lock-subtitle{color:var(--text-secondary);font-size:.925rem;line-height:1.5;margin-bottom:1.75rem}.input-wrapper{position:relative;margin-bottom:1.25rem}.input-control{width:100%;height:44px;padding:0 1.25rem;border-radius:var(--radius);border:1px solid var(--border-color);background:var(--bg-input);color:var(--text-primary);font-size:1rem;font-family:var(--font-sans);outline:none;transition:var(--transition)}.input-control:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--primary-light)}.input-icon-end{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:var(--text-muted);cursor:pointer;background:none;border:none;display:flex;align-items:center}.btn-primary{background:var(--accent);color:var(--accent-content);border:none;border-radius:var(--radius);height:44px;padding:0 1.5rem;font-weight:600;font-size:.95rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;transition:var(--transition);box-shadow:0 4px 14px #7c3aed33}.btn-primary:active{transform:scale(.96)}.btn-primary:hover{background:var(--accent-hover);box-shadow:0 6px 20px #7c3aed4d}.btn-icon-only{width:44px;height:44px;border-radius:var(--radius);border:1px solid var(--border-color);background:var(--bg-card);color:var(--text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition)}.btn-icon-only:active{transform:scale(.92)}.btn-icon-only:hover{color:var(--text-primary);border-color:var(--primary);background:var(--bg-card-hover)}.btn-ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--radius);height:44px;padding:0 1.25rem;font-weight:500;font-size:.9rem;cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;transition:var(--transition)}.btn-ghost:active{transform:scale(.96)}.btn-ghost:hover{color:var(--text-primary);background:var(--bg-card-hover)}.sticky-glass-header{position:sticky;top:0;z-index:100;background:rgba(var(--bg-main-rgb),.7);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);margin:0 -1.25rem 1rem;padding:1rem 1.25rem}.toolbar{display:flex;gap:.75rem;flex-wrap:wrap}.search-box{flex:1;min-width:240px;position:relative}.search-box input{padding-left:2.75rem}.search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none}.search-kbd{position:absolute;right:.875rem;top:50%;transform:translateY(-50%);background:var(--border-color);color:var(--text-secondary);font-size:.75rem;font-family:var(--font-mono);padding:.15rem .4rem;border-radius:4px}.accounts-grid{display:grid;grid-template-columns:1fr;gap:1rem}.account-card-pro{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius);padding:1.25rem 1.5rem;display:flex;align-items:center;justify-content:space-between;transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease,transform .2s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden;box-sizing:border-box}.account-card-pro:active{transform:scale(.98)}.account-card-pro:hover{border-color:var(--primary);background:var(--bg-card-hover);box-shadow:var(--shadow-md)}.account-card-pro.pinned{border-left:4px solid var(--accent)}.account-info{display:flex;align-items:center;gap:1rem;min-width:0;flex:1}.service-avatar{width:44px;height:44px;border-radius:var(--radius);background:var(--primary-light);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;flex-shrink:0}.account-details{min-width:0}.account-details .issuer-name{font-weight:600;font-size:1.05rem;color:var(--text-primary);display:flex;align-items:center;gap:.4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.account-details .account-handle{font-size:.85rem;color:var(--text-secondary);margin-top:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.totp-section{display:flex;align-items:center;gap:1.5rem;flex-shrink:0}.totp-code-display{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:1.85rem;font-weight:700;letter-spacing:.1em;color:var(--primary);user-select:all;cursor:pointer;padding:.25rem .5rem;border-radius:var(--radius);transition:background-color .2s ease,transform .1s ease;min-width:140px;text-align:center}.totp-code-display:active{transform:scale(.96)}.totp-code-display:hover{background:var(--primary-light)}.delete-account-btn,.edit-account-btn{width:36px;height:36px;border-radius:var(--radius);border:none;background:transparent;color:var(--text-muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition);opacity:.6}.account-card-pro:hover .delete-account-btn,.account-card-pro:hover .edit-account-btn{opacity:1}.delete-account-btn:hover{background:#ef444426;color:var(--destructive)}.edit-account-btn:hover{background:#10b98126;color:var(--accent)}.timer-ring-wrapper{width:36px;height:36px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.timer-ring-svg{transform:rotate(-90deg);width:36px;height:36px}.timer-ring-bg{stroke:var(--border-color);stroke-width:3;fill:none}.timer-ring-circle{stroke:var(--accent);stroke-width:3;stroke-dasharray:88;stroke-dashoffset:0;stroke-linecap:round;fill:none;transition:stroke-dashoffset 1s linear,stroke .3s ease}.timer-ring-circle.warning{stroke:var(--destructive)}.timer-ring-text{position:absolute;font-size:.75rem;font-weight:600;font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-secondary)}.empty-state{text-align:center;padding:4rem 2rem;color:var(--text-secondary)}.empty-state-icon{width:64px;height:64px;margin:0 auto 1rem;color:var(--text-muted)}.modal-backdrop{position:fixed;inset:0;background:#0f172a99;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:1.5rem;opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:1000}.modal-backdrop.active{opacity:1;pointer-events:auto}.modal-content{background:var(--bg-modal);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:0 25px 50px -12px #00000040;max-width:480px;width:100%;padding:2.5rem;transform:translateY(100px) scale(.95);opacity:0;transition:transform .4s cubic-bezier(.34,1.56,.64,1),opacity .3s ease}.modal-backdrop.active .modal-content{transform:translateY(0) scale(1);opacity:1}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.modal-title{font-size:1.25rem;font-weight:700}.modal-actions{display:flex;gap:.75rem;justify-content:flex-end;margin-top:1.5rem}.help-modal-content{max-width:520px}.help-badge-icon{width:36px;height:36px;background:var(--primary-light);color:var(--accent);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;flex-shrink:0}.help-body{max-height:60vh;overflow-y:auto;padding-right:.25rem;display:flex;flex-direction:column;gap:1rem}.help-section{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius);padding:1rem 1.25rem}.help-section h4{font-size:.95rem;font-weight:600;color:var(--text-primary);margin-bottom:.35rem}.help-section p{font-size:.875rem;line-height:1.55;color:var(--text-secondary);margin:0}.help-section p+p{margin-top:.45rem}.help-section code{font-family:var(--font-mono);font-size:.8rem;background:var(--primary-light);color:var(--text-primary);padding:.15rem .4rem;border-radius:4px}.toast-banner{position:fixed;bottom:2rem;left:50%;transform:translate(-50%) translateY(100px);background:var(--text-primary);color:var(--bg-main);padding:.75rem 1.5rem;border-radius:var(--radius-full);font-size:.9rem;font-weight:600;box-shadow:var(--shadow-lg);opacity:0;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),opacity .3s ease;z-index:2000;display:flex;align-items:center;gap:.5rem}.toast-banner.show{transform:translate(-50%) translateY(0);opacity:1}@media (max-width: 640px){.totp-section{flex-direction:column;align-items:flex-end;gap:.5rem}.totp-code-display{font-size:1.4rem;min-width:auto}}
