:root{--bg:#fff;--bg-secondary:#f5f5f5;--surface:#fafafa;--surface-hover:#f0f0f0;--border:#e0e0e0;--border-dark:#d0d0d0;--text:#111;--text-secondary:#666;--text-muted:#999;--accent:#06f;--accent-hover:#0052cc;--accent-light:#e6f0ff;--danger:#dc2626;--danger-light:#fef2f2;--success:#16a34a;--success-light:#f0fdf4}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}input,select,textarea{font-family:inherit;font-size:1rem}.container{max-width:960px;margin:0 auto;padding:0 24px}.container-sm{max-width:400px;margin:0 auto;padding:0 24px}.header{z-index:100;background:var(--bg);border-bottom:1px solid var(--border);height:64px;position:fixed;top:0;left:0;right:0}.header-inner{justify-content:space-between;align-items:center;max-width:960px;height:100%;margin:0 auto;padding:0 24px;display:flex}.logo{color:var(--text);align-items:center;gap:12px;font-size:1.125rem;font-weight:600;display:flex}.logo-icon{background:var(--text);border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.logo-icon svg{width:20px;height:20px;color:var(--bg)}.header-nav{align-items:center;gap:8px;display:flex}.header-nav a{color:var(--text-secondary);border-radius:8px;padding:10px 18px;font-size:.9375rem;font-weight:500;transition:all .15s}.header-nav a:hover{color:var(--text);background:var(--surface-hover)}.header-nav a.primary{background:var(--accent);color:#fff}.header-nav a.primary:hover{background:var(--accent-hover)}.main{min-height:100vh;padding-top:64px}.hero{text-align:center;padding:120px 24px}.hero h1{letter-spacing:-.02em;color:var(--text);margin-bottom:20px;font-size:clamp(2.5rem,5vw,3.5rem);font-weight:700;line-height:1.1}.hero h1 span{color:var(--text-secondary);font-weight:500}.hero p{color:var(--text-secondary);max-width:480px;margin:0 auto 40px;font-size:1.25rem;line-height:1.6}.hero-buttons{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.btn{white-space:nowrap;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:14px 28px;font-size:1rem;font-weight:600;transition:all .15s;display:inline-flex}.btn-primary{background:var(--text);color:var(--bg)}.btn-primary:hover{background:#333}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:var(--surface-hover);border-color:var(--border-dark)}.btn-accent{background:var(--accent);color:#fff}.btn-accent:hover{background:var(--accent-hover)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#b91c1c}.btn-sm{border-radius:8px;padding:8px 16px;font-size:.875rem}.btn svg{width:18px;height:18px}.features{background:var(--bg-secondary);padding:100px 24px}.features h2{text-align:center;margin-bottom:12px;font-size:2rem;font-weight:700}.features>p{text-align:center;color:var(--text-secondary);margin-bottom:56px;font-size:1.125rem}.features-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;max-width:960px;margin:0 auto;display:grid}.feature-card{background:var(--bg);border:1px solid var(--border);text-align:left;border-radius:16px;padding:32px}.feature-card h3{margin-bottom:8px;font-size:1.125rem;font-weight:600}.feature-card p{color:var(--text-secondary);font-size:.9375rem;line-height:1.6}.stats{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:80px 24px}.stats-grid{text-align:center;grid-template-columns:repeat(4,1fr);gap:32px;max-width:960px;margin:0 auto;display:grid}.stat-value{margin-bottom:4px;font-size:2.25rem;font-weight:700}.stat-label{color:var(--text-secondary);font-size:.9375rem}.cta{text-align:center;padding:100px 24px}.cta h2{margin-bottom:12px;font-size:2rem;font-weight:700}.cta p{color:var(--text-secondary);margin-bottom:32px;font-size:1.125rem}.footer{border-top:1px solid var(--border);padding:40px 24px}.footer-inner{justify-content:space-between;align-items:center;max-width:960px;margin:0 auto;display:flex}.footer-brand{align-items:center;gap:10px;font-weight:600;display:flex}.footer-brand .logo-icon{border-radius:6px;width:28px;height:28px}.footer-brand .logo-icon svg{width:14px;height:14px}.footer-text{color:var(--text-muted);font-size:.875rem}.auth-page{justify-content:center;align-items:center;min-height:calc(100vh - 64px);padding:60px 24px;display:flex}.auth-card{width:100%;max-width:380px}.auth-header{text-align:center;margin-bottom:32px}.auth-header h1{margin-bottom:8px;font-size:1.75rem;font-weight:700}.auth-header p{color:var(--text-secondary);font-size:1rem}.auth-form{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:32px}.form-group{margin-bottom:20px}.form-group label{color:var(--text);margin-bottom:8px;font-size:.875rem;font-weight:600;display:block}.form-group input,.form-group select,.form-group textarea{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);border-radius:10px;padding:14px 16px;font-size:1rem;transition:border-color .15s,box-shadow .15s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light);outline:none}.form-group input::placeholder{color:var(--text-muted)}.auth-form .btn{width:100%;margin-top:8px;padding:16px;font-size:1rem}.auth-footer{text-align:center;color:var(--text-secondary);margin-top:24px;font-size:.9375rem}.auth-footer a{color:var(--accent);font-weight:500}.auth-footer a:hover{text-decoration:underline}.error{background:var(--danger-light);color:var(--danger);border:1px solid #fecaca;border-radius:10px;margin-bottom:20px;padding:14px 16px;font-size:.875rem}.dashboard{padding:40px 0}.dashboard-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:40px;display:flex}.dashboard-header h1{font-size:1.75rem;font-weight:700}.dashboard-header p{color:var(--text-secondary);margin-top:4px;font-size:.9375rem}.dashboard-tabs{background:var(--surface);border:1px solid var(--border);border-radius:12px;gap:4px;padding:4px;display:flex}.dashboard-tabs a{color:var(--text-secondary);border-radius:8px;padding:12px 24px;font-size:.9375rem;font-weight:500;transition:all .15s}.dashboard-tabs a:hover{color:var(--text)}.dashboard-tabs a.active{background:var(--bg);color:var(--text);box-shadow:0 1px 3px #0000001a}.section-title{margin-bottom:20px;font-size:1.25rem;font-weight:600}.card{background:var(--bg);border:1px solid var(--border);border-radius:16px;margin-bottom:16px;padding:24px}.card-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.card-category{background:var(--surface);text-transform:capitalize;border-radius:8px;padding:6px 12px;font-size:.8125rem;font-weight:600;display:inline-block}.card-date{color:var(--text-muted);font-size:.8125rem}.card-content{white-space:pre-wrap;color:var(--text);font-size:.9375rem;line-height:1.7}.card-tags{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.card-tag{background:var(--surface);color:var(--text-secondary);border-radius:6px;padding:4px 10px;font-size:.75rem}.card-actions{border-top:1px solid var(--border);gap:8px;margin-top:16px;padding-top:16px;display:flex}.card-actions button{color:var(--text-secondary);background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:10px 18px;font-size:.875rem;font-weight:500;transition:all .15s}.card-actions button:hover{background:var(--surface-hover);color:var(--text)}.card-actions button.danger{background:var(--danger-light);color:var(--danger);border-color:#fecaca}.card-actions button.danger:hover{background:var(--danger);color:#fff}.card-form{flex-direction:column;gap:16px;display:flex}.card-form textarea{background:var(--surface);border:1px solid var(--border);width:100%;color:var(--text);resize:vertical;border-radius:10px;min-height:100px;padding:14px 16px;font-size:.9375rem}.card-form textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light);outline:none}.card-form-row{flex-wrap:wrap;gap:12px;display:flex}.card-form select,.card-form input[type=text]{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:10px;padding:12px 16px;font-size:.875rem}.card-form select:focus,.card-form input[type=text]:focus{border-color:var(--accent);outline:none}.card-form select{min-width:140px}.card-form input[type=text]{flex:1;min-width:140px}.search-box{gap:12px;margin-bottom:24px;display:flex}.search-box input{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:10px;flex:1;padding:14px 18px;font-size:.9375rem}.search-box input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light);outline:none}.search-box input::placeholder{color:var(--text-muted)}.empty{text-align:center;padding:80px 24px}.empty-icon{background:var(--surface);border:1px solid var(--border);border-radius:20px;justify-content:center;align-items:center;width:72px;height:72px;margin:0 auto 20px;display:flex}.empty-icon svg{width:32px;height:32px;color:var(--text-muted)}.empty p{color:var(--text-secondary);font-size:1rem}.keys-list{flex-direction:column;gap:12px;display:flex}.key-item{background:var(--bg);border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;gap:16px;padding:20px;display:flex}.key-info{flex:1;min-width:0}.key-name{margin-bottom:4px;font-size:.9375rem;font-weight:600}.key-preview{color:var(--text-muted);background:var(--surface);text-overflow:ellipsis;white-space:nowrap;border-radius:6px;max-width:300px;padding:6px 10px;font-family:monospace;font-size:.8125rem;display:inline-block;overflow:hidden}.key-date{color:var(--text-muted);margin-top:8px;font-size:.8125rem}.key-actions{flex-shrink:0;gap:8px;display:flex}.key-actions button{background:var(--surface);border:1px solid var(--border);color:var(--text-secondary);border-radius:8px;padding:10px 16px;font-size:.875rem;font-weight:500;transition:all .15s}.key-actions button:hover{background:var(--surface-hover);color:var(--text)}.key-actions button.danger{background:var(--danger-light);color:var(--danger);border-color:#fecaca}.key-actions button.danger:hover{background:var(--danger);color:#fff}.generate-form{background:var(--surface);border:1px solid var(--border);border-radius:16px;margin-bottom:24px;padding:24px}.generate-form h3{margin-bottom:16px;font-size:1rem;font-weight:600}.generate-form input{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);border-radius:10px;margin-bottom:16px;padding:14px 16px;font-size:.9375rem}.generate-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light);outline:none}.settings-section{background:var(--bg);border:1px solid var(--border);border-radius:16px;margin-bottom:24px;padding:32px}.settings-section h2{border-bottom:1px solid var(--border);margin-bottom:24px;padding-bottom:16px;font-size:1.125rem;font-weight:600}.settings-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px 0;display:flex}.settings-row:last-child{border-bottom:none;padding-bottom:0}.settings-row:first-of-type{padding-top:0}.settings-label{font-size:.9375rem;font-weight:500}.settings-desc{color:var(--text-secondary);margin-top:4px;font-size:.8125rem}.settings-value{color:var(--text-secondary);font-size:.9375rem}.lang-select{background:var(--surface);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:8px;padding:10px 14px;font-size:.875rem}.lang-select:focus{border-color:var(--accent);outline:none}.success{background:var(--success-light);color:var(--success);border:1px solid #bbf7d0;border-radius:10px;align-items:center;gap:10px;margin-bottom:20px;padding:14px 16px;font-size:.875rem;display:flex}.success svg{flex-shrink:0;width:18px;height:18px}.copy-btn{position:relative}.copy-btn.copied:after{content:"✓";color:var(--success);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mobile-nav-toggle{cursor:pointer;color:var(--text);background:0 0;border:none;padding:10px;display:none}@media (max-width:768px){html{font-size:15px}.header{height:56px}.header-inner{padding:0 16px}.header-nav{gap:4px}.header-nav a:not(.primary){display:none}.header-nav .mobile-nav-toggle{display:flex}.main{padding-top:56px}.hero{padding:60px 16px}.hero h1{letter-spacing:-.01em;font-size:1.875rem}.hero p{font-size:1rem}.hero-buttons{flex-direction:column;align-items:stretch}.hero-buttons .btn{justify-content:center;width:100%}.features{padding:48px 16px}.features h2{font-size:1.5rem}.features>p{margin-bottom:32px;font-size:1rem}.features-grid{grid-template-columns:1fr;gap:12px}.feature-card{padding:24px}.stats{padding:48px 16px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:24px}.stat-value{font-size:1.75rem}.stat-label{font-size:.8125rem}.cta{padding:60px 16px}.cta h2{font-size:1.5rem}.cta p{font-size:1rem}.footer{padding:32px 16px}.footer-inner{text-align:center;flex-direction:column;gap:20px}.footer-links{flex-direction:column;align-items:center;gap:12px;display:flex}.footer-links a{margin-right:0!important}.auth-page{align-items:flex-start;padding:80px 16px 40px}.auth-card{max-width:100%}.auth-form{padding:24px}.dashboard{padding:24px 0}.dashboard-header{flex-direction:column;align-items:flex-start;margin-bottom:24px}.dashboard-header h1{font-size:1.5rem}.dashboard-tabs{-webkit-overflow-scrolling:touch;scrollbar-width:none;width:100%;overflow-x:auto}.dashboard-tabs::-webkit-scrollbar{display:none}.dashboard-tabs a{white-space:nowrap;padding:10px 14px;font-size:.875rem}.card{margin-bottom:12px;padding:20px}.card-form textarea{min-height:80px}.card-form-row{flex-direction:column}.card-form select,.card-form input[type=text]{width:100%;min-width:unset}.search-box{flex-direction:column;gap:8px}.search-box input{padding:12px 14px}.key-item{flex-direction:column;align-items:flex-start;gap:12px;padding:16px}.key-preview{text-overflow:ellipsis;width:100%;max-width:100%;display:block;overflow:hidden}.key-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;width:100%}.key-actions button{flex:1;justify-content:center;min-width:70px;padding:10px 12px}.generate-form{margin-bottom:16px;padding:20px}.generate-form input{margin-bottom:12px;padding:12px 14px}.settings-section{margin-bottom:16px;padding:24px 20px}.settings-section h2{margin-bottom:16px;padding-bottom:12px;font-size:1rem}.settings-row{flex-direction:column;align-items:flex-start;gap:8px;padding:12px 0}.settings-row:last-child{padding-bottom:0}.empty{padding:48px 16px}.empty-icon{border-radius:16px;width:56px;height:56px}.empty-icon svg{width:24px;height:24px}.section-title{margin-bottom:16px;font-size:1.125rem}.btn{padding:12px 20px;font-size:.9375rem}.btn-sm{padding:8px 14px;font-size:.8125rem}}@media (max-width:380px){.hero h1{font-size:1.625rem}.stats-grid{grid-template-columns:1fr 1fr;gap:16px}.stat-value{font-size:1.5rem}}.docs-nav{background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-wrap:wrap;gap:8px;margin-bottom:32px;padding:16px;display:flex}.docs-nav a{color:var(--text-secondary);border-radius:8px;padding:8px 16px;font-size:.875rem;transition:all .15s}.docs-nav a:hover{background:var(--surface-hover);color:var(--text)}.docs-section{background:var(--bg);border:1px solid var(--border);border-radius:16px;margin-bottom:24px;padding:32px}.docs-section h2{border-bottom:1px solid var(--border);margin-bottom:16px;padding-bottom:16px;font-size:1.5rem;font-weight:700}.docs-section h3{color:var(--text);margin:24px 0 12px;font-size:1.125rem;font-weight:600}.docs-section p{color:var(--text-secondary);margin-bottom:16px;line-height:1.7}.docs-code{background:var(--surface);border:1px solid var(--border);border-radius:10px;margin:12px 0;padding:16px;overflow-x:auto}.docs-code code,.docs-code pre{color:var(--text);white-space:pre-wrap;word-break:break-all;font-family:SF Mono,Monaco,Consolas,monospace;font-size:.875rem}.docs-code pre{margin:0}.docs-method{background:var(--accent);color:#fff;border-radius:6px;margin-right:12px;padding:4px 8px;font-size:.75rem;font-weight:600;display:inline-block}.docs-body{margin-top:-8px}.docs-badges{flex-wrap:wrap;gap:8px;margin:16px 0;display:flex}.docs-badge{background:var(--surface);border:1px solid var(--border);color:var(--text-secondary);border-radius:8px;padding:6px 12px;font-size:.8125rem;font-weight:500}.docs-badge-link{color:var(--accent);text-decoration:none}.docs-badge-link:hover{text-decoration:underline}.docs-table{border:1px solid var(--border);border-radius:10px;margin:16px 0;overflow:hidden}.docs-table-row{border-bottom:1px solid var(--border);grid-template-columns:180px 1fr;align-items:center;gap:16px;padding:14px 16px;display:grid}.docs-table-row:last-child{border-bottom:none}.docs-table-header{background:var(--surface);font-size:.875rem;font-weight:600}.docs-table-row code{color:var(--accent);font-family:SF Mono,Monaco,Consolas,monospace;font-size:.8125rem}.docs-table-row span{color:var(--text-secondary);font-size:.875rem}.docs-architecture{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:24px 0;display:grid}.docs-arch-item{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px}.docs-arch-item h4{margin-bottom:8px;font-size:1rem;font-weight:600}.docs-arch-item p{margin-bottom:12px;font-size:.8125rem}.docs-arch-item code,.docs-link{color:var(--accent);font-size:.8125rem}.docs-footer{background:var(--surface);border:1px solid var(--border);border-radius:16px;margin-top:32px;padding:32px}.docs-footer h3{margin-bottom:20px;font-size:1.125rem;font-weight:600}.docs-repos{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;display:grid}.docs-repo-card{background:var(--bg);border:1px solid var(--border);border-radius:12px;gap:16px;padding:20px;text-decoration:none;transition:all .15s;display:flex}.docs-repo-card:hover{border-color:var(--accent);transform:translateY(-2px)}.docs-repo-icon{background:var(--surface);width:40px;height:40px;color:var(--text);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.docs-repo-card strong{color:var(--text);margin-bottom:4px;font-size:1rem;display:block}.docs-repo-card p{color:var(--text-secondary);margin:0;font-size:.8125rem}@media (max-width:768px){.docs-section{padding:24px 20px}.docs-section h2{font-size:1.25rem}.docs-table-row{grid-template-columns:1fr;gap:4px}.docs-table-header{display:none}.docs-architecture,.docs-repos{grid-template-columns:1fr}}