*{box-sizing:border-box;margin:0;padding:0}:root{--primary-color:#007bff;--primary-hover:#0056b3;--success-color:#28a745;--error-color:#dc3545;--warning-color:#ffc107;--bg-color:#f8f9fa;--surface-color:#fff;--border-color:#dee2e6;--text-color:#212529;--text-muted:#6c757d;--shadow:0 2px 4px #0000001a;--shadow-lg:0 4px 6px #0000001a;--radius:8px;--spacing:1rem}body{background-color:var(--bg-color);color:var(--text-color);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.6}.app{padding:var(--spacing);min-height:100vh}.container{background:var(--surface-color);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:calc(var(--spacing)*2);max-width:900px;margin:0 auto}.app-header{margin-bottom:calc(var(--spacing)*2);padding-bottom:var(--spacing);border-bottom:2px solid var(--border-color);display:flex;justify-content:space-between;align-items: center;gap:var(--spacing);flex-wrap:wrap}.app-header h1{color:var(--text-color);font-size:2rem;font-weight:600}.status-indicator{display:flex;border-radius:var(--radius);align-items: center;gap:.5rem;padding:.5rem 1rem;font-size:.9rem;font-weight:500}.status-indicator.loading{background-color:var(--bg-color);color:var(--text-muted)}.status-indicator.running{color:#155724;background-color:#d4edda}.status-indicator.stopped{color:#721c24;background-color:#f8d7da}.status-dot{animation:pulse 2s infinite;background-color:currentColor;border-radius:50%;width:10px;height:10px}.status-indicator.loading .status-dot{background-color:var(--text-muted)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.alert{border-radius:var(--radius);margin-bottom:var(--spacing);border-left:4px solid;padding:1rem}.alert-error{color:#721c24;border-color:var(--error-color);background-color:#f8d7da}.alert-success{color:#155724;border-color:var(--success-color);background-color:#d4edda}.alert-warning{color:#856404;border-color:var(--warning-color);background-color:#fff3cd}.settings-section{margin-bottom:calc(var(--spacing)*2)}.settings-section h2{margin-bottom:var(--spacing);color:var(--text-color);border-bottom:1px solid var(--border-color);padding-bottom:.5rem;font-size:1.5rem;font-weight:600}.settings-group{display:flex;gap:calc(var(--spacing)*1.5);flex-direction:column}.form-field{display:flex;flex-direction:column;gap:.5rem}label{display:flex;color:var(--text-color);flex-direction:column;gap:.25rem;font-weight:500}.label-text{font-size:.95rem}.label-description{color:var(--text-muted);font-size:.85rem;font-weight:400}.required-badge{display:inline-block;background-color:var(--error-color);color:#fff;border-radius:4px;margin-left:.5rem;padding:.125rem .5rem;font-size:.75rem;font-weight:600}.text-input{border:1px solid var(--border-color);border-radius:var(--radius);background-color:var(--surface-color);color:var(--text-color);padding:.75rem;transition:border-color .2s,box-shadow .2s;font-family:inherit;font-size:1rem}.text-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #007bff1a}.text-input.error{border-color:var(--error-color)}.text-input[type=password]{letter-spacing:.1em;font-family:monospace}.input-with-button{display:flex;align-items:stretch;gap:.5rem}.input-with-button .text-input{flex:1}.generate-button{background-color:var(--success-color);color:#fff;border-radius:var(--radius);cursor:pointer;white-space:nowrap;border:none;flex-shrink:0;padding:.75rem 1.5rem;transition:background-color .2s;font-size:.9rem;font-weight:500}.generate-button:hover{background-color:#218838}.generate-button:active{background-color:#1e7e34}.reset-button{background-color:var(--warning-color);color:#212529;border-radius:var(--radius);cursor:pointer;white-space:nowrap;border:none;flex-shrink:0;padding:.75rem 1.5rem;transition:background-color .2s;font-size:.9rem;font-weight:500}.reset-button:hover{background-color:#e0a800}.reset-button:active{background-color:#d39e00}.error-message{color:var(--error-color);margin-top:.25rem;font-size:.85rem}.pubkey-display{background-color:var(--bg-color);border-radius:var(--radius);border:1px solid var(--border-color);margin-top:1rem;padding:1rem}.pubkey-label{display:flex;color:var(--text-color);flex-direction:column;gap:.25rem;margin-bottom:.75rem;font-weight:500}.pubkey-value-container{display:flex;align-items:stretch;gap:.5rem}.pubkey-input{border:1px solid var(--border-color);border-radius:var(--radius);background-color:var(--surface-color);color:var(--text-color);cursor:text;flex:1;padding:.75rem;transition:border-color .2s,box-shadow .2s;font-family:monospace;font-size:.9rem}.pubkey-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #007bff1a}.copy-button{background-color:var(--primary-color);color:#fff;border-radius:var(--radius);cursor:pointer;white-space:nowrap;border:none;flex-shrink:0;padding:.75rem 1.5rem;transition:background-color .2s;font-size:.9rem;font-weight:500}.copy-button:hover{background-color:var(--primary-hover)}.pubkey-deriving{color:var(--text-muted);margin-top:.5rem;padding:.5rem;font-size:.85rem}.webapp-link-container{display:flex;flex-direction:column;align-items: flex-start;gap:.5rem;margin-top:1rem}.webapp-button{color:#fff;border-radius:var(--radius);cursor:pointer;display:flex;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;align-items: center;gap:.5rem;padding:.75rem 1.5rem;transition:all .2s;font-size:.95rem;font-weight:600;box-shadow:0 2px 4px #667eea4d}.webapp-button:hover{background:linear-gradient(135deg,#5568d3 0%,#6a3f8f 100%);transform:translateY(-2px);box-shadow:0 4px 8px #667eea66}.webapp-button:active{transform:translateY(0);box-shadow:0 2px 4px #667eea4d}.relay-list-input{display:flex;flex-direction:column;gap:.5rem}.relay-list-container{display:flex;flex-direction:column;gap:.75rem}.relay-list{list-style:none;display:flex;flex-direction:column;gap:.5rem}.relay-item{display:flex;background-color:var(--bg-color);border-radius:var(--radius);border:1px solid var(--border-color);align-items: center;gap:.5rem;padding:.5rem}.relay-url{color:var(--text-color);word-break:break-all;flex:1;font-family:monospace;font-size:.9rem}.remove-button{background-color:var(--error-color);color:#fff;display:flex;cursor:pointer;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items: center;width:24px;height:24px;transition:background-color .2s;font-size:1.2rem;line-height:1}.remove-button:hover{background-color:#c82333}.relay-add{display:flex;gap:.5rem}.relay-input{border:1px solid var(--border-color);border-radius:var(--radius);flex:1;padding:.75rem;transition:border-color .2s,box-shadow .2s;font-family:monospace;font-size:1rem}.relay-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #007bff1a}.add-button{background-color:var(--primary-color);color:#fff;border-radius:var(--radius);cursor:pointer;white-space:nowrap;border:none;padding:.75rem 1.5rem;transition:background-color .2s;font-size:1rem;font-weight:500}.add-button:hover:not(:disabled){background-color:var(--primary-hover)}.add-button:disabled{opacity:.6;cursor:not-allowed}.form-actions{margin-top:calc(var(--spacing)*2);padding-top:var(--spacing);border-top:2px solid var(--border-color);display:flex;justify-content:flex-end}.save-button{background-color:var(--primary-color);color:#fff;border-radius:var(--radius);cursor:pointer;border:none;padding:.75rem 2rem;transition:background-color .2s,transform .1s;font-size:1rem;font-weight:600}.save-button:hover:not(:disabled){background-color:var(--primary-hover);transform:translateY(-1px)}.save-button:active:not(:disabled){transform:translateY(0)}.save-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.loading-state{text-align:center;padding:calc(var(--spacing)*3);color:var(--text-muted);font-size:1.1rem}.error-console{margin-top:calc(var(--spacing)*2);border:1px solid var(--error-color);border-radius:var(--radius);overflow-y:auto;background-color:#1e1e1e;max-height:200px;padding:1rem}.error-console pre{color:#f48771;white-space:pre-wrap;word-break:break-word;margin:0;font-family:Courier New,Courier,monospace;font-size:.85rem}.error-console::-webkit-scrollbar{width:8px}.error-console::-webkit-scrollbar-track{background:#1e1e1e}.error-console::-webkit-scrollbar-thumb{background:#555;border-radius:4px}.error-console::-webkit-scrollbar-thumb:hover{background:#666}@media (width<=768px){.app{padding:.5rem}.container{padding:var(--spacing)}.app-header{flex-direction:column;align-items: flex-start}.app-header h1{font-size:1.5rem}.relay-add{flex-direction:column}.add-button{width:100%}.form-actions{justify-content:stretch}.save-button{width:100%}.pubkey-value-container{flex-direction:column}.copy-button{width:100%}.input-with-button{flex-direction:column}.generate-button,.reset-button{width:100%}.webapp-button{justify-content:center;width:100%}}