.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-6)}.page-header-content{flex:1}.page-title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--text-primary);margin-bottom:var(--space-1)}.page-subtitle{font-size:var(--text-md);color:var(--text-secondary);line-height:var(--leading-relaxed)}.section{margin-bottom:var(--space-10)}.section-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-5)}.section-title{font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--text-primary);display:flex;align-items:center;gap:var(--space-3)}.section-title-icon{width:32px;height:32px;background:var(--accent-primary-soft);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:var(--accent-primary)}.section-title-icon svg{width:18px;height:18px}.section-count{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--text-secondary);border:1px solid var(--border-light);transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);font-weight:var(--font-medium);color:var(--text-tertiary);background:var(--bg-surface);padding:4px 10px;border-radius:var(--radius-full)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:10px 18px;font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-semibold);border-radius:var(--radius-md);border:none;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.btn svg{width:16px;height:16px;flex-shrink:0}.btn:active{transform:scale(.98)}.btn-primary{background:var(--accent-primary);color:#fff;box-shadow:var(--shadow-sm)}.btn-primary:hover{background:var(--accent-primary-hover);color:#fff;box-shadow:var(--shadow-accent);transform:translateY(-1px)}.btn-primary:active{transform:scale(.98) translateY(0);box-shadow:var(--shadow-sm)}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-default)}.btn-secondary:hover{background:var(--bg-surface);border-color:var(--border-strong)}.btn-ghost{background:var(--bg-surface);color:var(--text-secondary);border:1px solid var(--border-light)}.btn-ghost:hover{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-default)}.btn-danger{background:var(--status-error-soft);color:var(--status-error);border:1px solid transparent}.btn-danger:hover{background:var(--status-error);color:#fff}.dark .btn-danger{background:#c94a4a26;color:var(--status-error);border-color:#c94a4a4d}.dark .btn-danger:hover{background:var(--status-error);color:#fff;border-color:var(--status-error)}.btn-sm{padding:6px 12px;font-size:var(--text-xs)}.connection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--space-4);justify-content:start}.connection-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.connection-card:hover{border-color:var(--border-default);box-shadow:var(--shadow-sm)}.connection-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3)}.connection-card-provider{display:flex;align-items:center;gap:var(--space-3)}.connection-card-icon{width:48px;height:48px;background:var(--bg-surface);border:1px solid var(--border-light);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--text-secondary);flex-shrink:0}.connection-card-icon.google,.connection-card-icon.reddit,.connection-card-icon.notion,.connection-card-icon.linear,.connection-card-icon.spotify,.connection-card-icon.slack,.connection-card-icon.discord,.connection-card-icon.calendly,.connection-card-icon.jira,.connection-card-icon.dropbox,.connection-card-icon.figma,.connection-card-icon.gitlab{background:#fff;border-color:var(--border-light)}.connection-card-icon.github{background:#24292e;color:#fff;border-color:#24292e}.connection-card-icon.x-twitter{background:#000;color:#fff;border-color:#000}.connection-card-icon.telegram{background:#08c;color:#fff;border-color:#08c}.connection-card-icon.zoom{background:#2d8cff;color:#fff;border-color:#2d8cff}.connection-card-icon.asana{background:#f06a6a;color:#fff;border-color:#f06a6a}.connection-card-icon.twitch{background:#9146ff;color:#fff;border-color:#9146ff}.connection-card-icon.microsoft{background:#00a4ef;color:#fff;border-color:#00a4ef}.connection-card-icon.airtable{background:#18bfff;color:#fff;border-color:#18bfff}.connection-card-icon.mongodb{background:#00ed64;color:#fff;border-color:#00ed64}.connection-card-icon.supabase{background:#3ecf8e;color:#1a1a1a;border-color:#3ecf8e}.connection-card-icon.railway{background:#0f0a19;color:#fff;border-color:#0f0a19}.connection-card-icon.elevenlabs{background:#000;color:#fff;border-color:#000}.connection-card-icon.typefully{background:#1999f5;color:#fff;border-color:#1999f5}.connection-card-name{font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--text-primary)}.connection-card-status{display:flex;align-items:center;gap:var(--space-1);font-size:var(--text-xs);font-weight:var(--font-medium);padding:4px 10px;border-radius:var(--radius-full)}.connection-card-status svg{flex-shrink:0}.connection-card-status.connected{background:var(--status-success-soft);color:var(--status-success);font-weight:var(--font-semibold)}.connection-card-status.Disconnected{background:var(--bg-surface);color:var(--text-tertiary)}.connection-card-status-dot{width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0;animation:pulse 2s ease-in-out infinite}.connection-card-status.connected .connection-card-status-dot{background:var(--status-success);box-shadow:0 0 0 0 var(--status-success-soft);animation:pulseconnected 2s ease-in-out infinite}@keyframes pulseconnected{0%,to{box-shadow:0 0 0 0 var(--status-success-soft);opacity:1}50%{box-shadow:0 0 0 4px transparent;opacity:.8}}.connection-card-body{flex:1}.connection-card-info{display:flex;flex-direction:column;gap:var(--space-2)}.connection-card-email,.connection-card-username,.connection-card-status-text{font-size:var(--text-sm);color:var(--text-secondary);display:flex;align-items:center;gap:var(--space-2)}.connection-card-email svg,.connection-card-username svg,.connection-card-status-text svg{width:14px;height:14px;color:var(--text-tertiary);flex-shrink:0}.connection-card-username{color:var(--text-primary);font-weight:var(--font-medium)}.connection-card-status-text{color:var(--status-success);font-weight:var(--font-medium)}.connection-card-status-text svg{color:var(--status-success)}.connection-card-prompt{font-size:var(--text-sm);color:var(--text-tertiary);line-height:var(--leading-relaxed);margin:0}.connection-card-scopes{display:flex;flex-wrap:wrap;gap:var(--space-1);margin-top:var(--space-2);padding-top:var(--space-2);border-top:1px solid var(--border-light);width:100%;min-width:0;max-height:50px;overflow:hidden;align-content:flex-start}.connection-card-scope{font-size:var(--text-xs);color:var(--text-secondary);background:var(--bg-surface);padding:3px 8px;border-radius:var(--radius-sm);border:1px solid var(--border-light);font-weight:var(--font-medium);flex-shrink:0;white-space:nowrap;max-width:100%;display:inline-block;line-height:1.4}.connection-card-footer{padding-top:var(--space-3)}.connection-card-footer .btn{width:100%;justify-content:center}.avatar-group{display:flex;align-items:center;padding-left:12px;flex-shrink:0}.avatar{width:44px;height:44px;border-radius:50%;border:3px solid var(--bg-card);margin-left:-12px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;background:var(--bg-surface);position:relative;transition:transform var(--duration-fast) var(--ease-out);cursor:default;flex-shrink:0;box-shadow:var(--shadow-sm);overflow:hidden}.avatar img,.avatar svg{width:100%;height:100%;object-fit:cover}.avatar.google,.avatar.reddit,.avatar.notion,.avatar.linear,.avatar.spotify,.avatar.slack,.avatar.discord,.avatar.calendly,.avatar.jira,.avatar.dropbox,.avatar.figma,.avatar.gitlab{background:#fff;border-color:var(--border-light)}.avatar.github{background:#24292e;color:#fff}.avatar.github svg{width:32px;height:32px}.avatar.x-twitter{background:#000;color:#fff}.avatar.x-twitter svg{width:32px;height:32px}.avatar.telegram{background:#08c;color:#fff}.avatar.telegram svg{width:32px;height:32px}.avatar.zoom{background:#2d8cff;color:#fff}.avatar.zoom svg{width:32px;height:32px}.avatar.asana{background:#f06a6a;color:#fff}.avatar.asana svg{width:32px;height:32px}.avatar.twitch{background:#9146ff;color:#fff}.avatar.twitch svg{width:32px;height:32px}.avatar.microsoft{background:#00a4ef;color:#fff}.avatar.microsoft svg{width:32px;height:32px}.avatar.airtable{background:#18bfff;color:#fff}.avatar.airtable svg{width:32px;height:32px}.avatar.mongodb{background:#00ed64}.avatar.mongodb svg{width:32px;height:32px}.avatar.supabase{background:#3ecf8e;color:#1a1a1a}.avatar.supabase svg{width:32px;height:32px}.avatar.railway{background:#0f0a19}.avatar.railway svg{width:32px;height:32px}.avatar.elevenlabs{background:#000}.avatar.elevenlabs svg{width:32px;height:32px}.avatar.typefully{background:#1999f5}.avatar.typefully svg{width:32px;height:32px}.avatar.google img{width:32px;height:32px}.avatar.avatar-more{background:#2a2a2a!important;color:#fff!important;border-color:var(--bg-card)!important;font-weight:var(--font-bold)}.dark .avatar.avatar-more{background:#3d3d3d!important;color:#fff!important}.key-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--space-4)}.key-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg);padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.key-card:hover{border-color:var(--border-default);box-shadow:var(--shadow-sm)}.key-card-info{flex:1}.key-card-name{font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--text-primary);margin-bottom:var(--space-1)}.key-card-name a{color:inherit;text-decoration:none}.key-card-name a:hover{color:var(--accent-primary)}.key-card-meta{display:flex;flex-direction:column;gap:var(--space-1)}.key-card-date{font-size:var(--text-sm);color:var(--text-tertiary)}.key-card-actions{display:flex;gap:var(--space-2);padding-top:var(--space-3);margin-top:var(--space-2);border-top:1px solid var(--border-light);flex-wrap:wrap}.key-card-actions .btn{justify-content:center;min-width:0;white-space:nowrap}.key-card-actions .key-action-primary{flex:1 1 calc(50% - var(--space-1));min-width:0}.key-card-actions .key-action-danger{flex:1 1 100%;width:100%}.connection-card-icon{width:48px;height:48px;background:var(--bg-surface);border:1px solid var(--border-light);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.connection-card-icon img,.connection-card-icon svg{width:32px;height:32px}.empty-state{background:var(--bg-card);border:1px dashed var(--border-default);border-radius:var(--radius-xl);padding:var(--space-12) var(--space-6);text-align:center}.empty-state-icon{width:64px;height:64px;margin:0 auto var(--space-5);background:var(--bg-surface);border-radius:var(--radius-xl);display:flex;align-items:center;justify-content:center;color:var(--text-tertiary)}.empty-state-icon svg{width:28px;height:28px}.empty-state-title{font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--text-primary);margin-bottom:var(--space-2)}.empty-state-text{font-size:var(--text-md);color:var(--text-secondary);max-width:320px;margin:0 auto var(--space-5);line-height:var(--leading-relaxed)}.form-group{margin-bottom:var(--space-5)}.form-label{display:block;font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--text-primary);margin-bottom:var(--space-2)}.form-input,.form-textarea{width:100%;padding:12px 14px;font-family:var(--font-body);font-size:var(--text-md);color:var(--text-primary);background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-md);transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-tertiary)}.form-input:hover,.form-textarea:hover{border-color:var(--border-strong)}.form-input:focus,.form-textarea:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-primary-soft)}.form-hint{font-size:var(--text-sm);color:var(--text-tertiary);margin-top:var(--space-2)}.checkbox-group{display:flex;flex-direction:column;gap:var(--space-2)}.checkbox-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--bg-surface);border:1px solid var(--border-light);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out)}.checkbox-item:hover{background:var(--bg-elevated);border-color:var(--border-default)}.checkbox-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent-primary);cursor:pointer}.checkbox-item-label{font-weight:var(--font-semibold);color:var(--text-primary)}.checkbox-item-desc{font-size:var(--text-sm);color:var(--text-secondary);margin-left:auto}.secret-box{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:var(--space-4)}.secret-warning{display:flex;align-items:center;gap:var(--space-2);color:var(--status-warning);font-size:var(--text-sm);font-weight:var(--font-semibold);margin-bottom:var(--space-3)}.secret-warning svg{width:18px;height:18px;flex-shrink:0}.secret-value{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-primary);background:var(--bg-card);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);border:1px solid var(--border-light);word-break:break-all;display:block}.modal-backdrop{display:none;position:fixed;inset:0;background:#0f0f0fbf;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:var(--z-modal);align-items:center;justify-content:center;padding:var(--space-4)}.modal-backdrop.active{display:flex}.modal{background:var(--bg-card);border-radius:var(--radius-2xl);box-shadow:var(--shadow-xl);width:100%;max-width:480px;max-height:90vh;overflow:auto}.modal-header{padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--border-light)}.modal-title{font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--text-primary)}.modal-body{padding:var(--space-6)}.modal-footer{display:flex;justify-content:flex-end;gap:var(--space-3);padding:var(--space-4) var(--space-6);background:var(--bg-surface);border-top:1px solid var(--border-light);border-radius:0 0 var(--radius-2xl) var(--radius-2xl)}.modal-footer-stacked{flex-direction:column-reverse;gap:var(--space-2)}.modal-footer-stacked .btn{width:100%;justify-content:center}@media(max-width:768px){.page-header{flex-direction:column;gap:var(--space-4)}.connection-grid{grid-template-columns:1fr}.key-card{flex-direction:column;align-items:stretch}.key-card-actions{justify-content:flex-end}.modal-footer{flex-direction:column-reverse}.modal-footer .btn{width:100%}}