.style-popup{border-radius:var(--radius-md);border:1px solid var(--border-2);background:var(--surface-2);width:min(340px,100vw - 24px);box-shadow:var(--shadow-xl);z-index:4100;animation:stylePopupIn var(--t-slow) ease;padding:16px 18px 14px;position:fixed;bottom:20px;right:20px}.style-popup p{color:var(--muted);margin:6px 0 14px;font-size:12px;line-height:1.5}.style-popup-close{border-radius:var(--radius-sm);border:1px solid var(--border-2);background:var(--surface-3);width:26px;height:26px;color:var(--muted);cursor:pointer;transition:background var(--t-fast), border-color var(--t-fast), color var(--t-fast);place-items:center;font-size:14px;line-height:1;display:grid;position:absolute;top:10px;right:10px}.style-popup-close:hover{background:var(--surface-4);border-color:var(--border-3);color:var(--text)}.style-popup-ok{min-width:80px;font-size:13px;font-weight:600}.nav-mode-picker{gap:var(--sp-1);flex-wrap:wrap;justify-content:flex-end;display:inline-flex}.nav-mode-option{border:1px solid var(--border-2);background:var(--surface-3);color:var(--text-2);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--t-fast), border-color var(--t-fast), color var(--t-fast), box-shadow var(--t-fast);padding:6px 12px;font-size:12px;font-weight:600}.nav-mode-option:hover{background:var(--surface-4);border-color:var(--border-3);color:var(--text)}.nav-mode-option.active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 4px 12px var(--accent-glow)}.style-popup-close,.style-popup-ok,.settings-tabs button,.upload-pill,.danger-btn,.suggestion-item{transition:background var(--t-fast), border-color var(--t-fast), color var(--t-fast), box-shadow var(--t-fast), opacity var(--t-fast)}.style-popup-close:focus-visible,.style-popup-ok:focus-visible,.settings-tabs button:focus-visible,.upload-pill:focus-visible,.danger-btn:focus-visible,.suggestion-item:focus-visible{box-shadow:0 0 0 3px var(--accent-dim);outline:none}.style-popup-close:active,.style-popup-ok:active,.settings-tabs button:active,.upload-pill:active,.danger-btn:active,.suggestion-item:active{opacity:.82}.settings-window{background:var(--surface);border:1px solid var(--border-2);border-radius:var(--radius-lg);width:min(680px,92vw);max-height:86vh;box-shadow:var(--shadow-xl);z-index:1000;animation:fadeIn var(--t-slow) ease;color:var(--text);-webkit-backdrop-filter:blur(16px);flex-direction:column;display:flex;position:fixed;top:7%;right:6%;overflow:hidden}.settings-backdrop{-webkit-backdrop-filter:blur(4px);z-index:-1;background:#00000085;position:fixed;inset:0}.settings-header{border-bottom:1px solid var(--border);background:var(--surface-2);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.settings-tabs{gap:var(--sp-1);background:var(--surface-3);border:1px solid var(--border);border-radius:var(--radius-sm);flex-wrap:wrap;padding:3px;display:inline-flex}.settings-tabs button{border-radius:var(--radius-xs);cursor:pointer;color:var(--muted);letter-spacing:.01em;background:0 0;border:none;padding:5px 14px;font-size:12px;font-weight:600}.settings-tabs button:hover{background:var(--surface-4);color:var(--text)}.settings-tabs button.active{background:var(--accent);color:#fff}.settings-header .close-btn{background:var(--danger-dim);border:1px solid color-mix(in srgb, var(--danger) 35%, var(--border));color:var(--danger);border-radius:var(--radius-sm);cursor:pointer;width:28px;height:28px;transition:background var(--t-fast), border-color var(--t-fast), color var(--t-fast);place-items:center;font-size:14px;display:grid}.settings-header .close-btn:hover{background:color-mix(in srgb, var(--danger) 22%, var(--surface-3));border-color:color-mix(in srgb, var(--danger) 55%, var(--border))}.settings-content{flex:1;min-height:0;padding:16px;overflow:auto}.tab-content{gap:14px;margin-top:8px;display:grid}.settings-warning{border:1px solid color-mix(in srgb, var(--accent) 35%, var(--border));background:var(--accent-dim);border-radius:var(--radius-sm);justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;font-size:13px;font-weight:500;display:flex}.save-status{border:1px solid var(--border-2);background:var(--surface-3);color:var(--muted);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;align-items:center;padding:3px 10px;font-size:11px;font-weight:700;display:inline-flex}.save-status.success{border-color:color-mix(in srgb, var(--success) 45%, var(--border));color:var(--success);background:var(--success-dim)}.save-status.error{border-color:color-mix(in srgb, var(--danger) 45%, var(--border));color:var(--danger);background:var(--danger-dim)}.tab-content label{color:var(--text-2);letter-spacing:.01em;margin-bottom:6px;font-size:12px;font-weight:600;display:block}.tab-content input,.tab-content textarea{border:1px solid var(--border-2);border-radius:var(--radius-sm);background:var(--surface-3);width:100%;color:var(--text);font-size:13px;font-family:var(--font-sans);transition:border-color var(--t-fast), box-shadow var(--t-fast);outline:none;margin-bottom:10px;padding:8px 10px}.tab-content input:focus,.tab-content textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.tab-content select{border:1px solid var(--border-2);border-radius:var(--radius-sm);background:var(--surface-3);width:100%;color:var(--text);font-size:13px;font-family:var(--font-sans);cursor:pointer;transition:border-color var(--t-fast), box-shadow var(--t-fast);outline:none;padding:8px 10px}.tab-content select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.tab-content button{background:var(--accent);color:#fff;border:1px solid var(--accent);border-radius:var(--radius-sm);cursor:pointer;letter-spacing:.01em;transition:background var(--t-fast), box-shadow var(--t-fast);padding:8px 18px;font-size:13px;font-weight:600}.tab-content button:hover{background:var(--accent-2);box-shadow:0 4px 14px var(--accent-glow)}.settings-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;display:grid}.settings-card{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);transition:border-color var(--t-fast);gap:8px;padding:12px;display:grid}.settings-card:hover{border-color:var(--border-2)}.settings-label{color:var(--muted);letter-spacing:.03em;margin:0;font-size:11px;font-weight:600}.upload-pill{border:1px dashed color-mix(in srgb, var(--accent) 45%, var(--border));background:var(--accent-dim);color:var(--text);border-radius:var(--radius-sm);cursor:pointer;width:fit-content;transition:background var(--t-fast), border-color var(--t-fast);align-items:center;gap:6px;padding:7px 14px;font-size:12px;font-weight:600;display:inline-flex}.upload-pill:hover{background:color-mix(in srgb, var(--accent) 18%, transparent);border-color:color-mix(in srgb, var(--accent) 65%, var(--border))}.upload-pill input{display:none}.color-input{border-radius:var(--radius-sm);border:1px solid var(--border-2);background:var(--surface-3);cursor:pointer;width:100%;height:36px;transition:border-color var(--t-fast);padding:2px}.color-input:hover{border-color:var(--border-3)}.badge-row{grid-template-columns:120px 1fr;gap:10px;display:grid}.danger-zone h3{color:var(--danger);text-transform:uppercase;letter-spacing:.06em;margin:0 0 4px;font-size:12px;font-weight:700}.danger-card{border:1px solid color-mix(in srgb, var(--danger) 25%, var(--border));border-radius:var(--radius-sm);background:var(--danger-dim);transition:border-color var(--t-fast);justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.danger-card:hover{border-color:color-mix(in srgb, var(--danger) 40%, var(--border))}.danger-btn{border:1px solid color-mix(in srgb, var(--danger) 45%, var(--border));background:var(--danger-dim);color:var(--danger);border-radius:var(--radius-sm);cursor:pointer;letter-spacing:.03em;transition:background var(--t-fast), border-color var(--t-fast), box-shadow var(--t-fast);white-space:nowrap;padding:7px 14px;font-size:12px;font-weight:700}.danger-btn:hover{background:color-mix(in srgb, var(--danger) 22%, var(--surface-3));border-color:color-mix(in srgb, var(--danger) 60%, var(--border));box-shadow:0 4px 12px color-mix(in srgb, var(--danger) 20%, transparent)}.danger-btn.danger-solid{background:var(--danger);border-color:var(--danger);color:#fff}.danger-btn.danger-solid:hover{background:color-mix(in srgb, var(--danger) 85%, #000);box-shadow:0 4px 14px color-mix(in srgb, var(--danger) 35%, transparent)}.settings-switch{cursor:pointer;align-items:center;gap:8px;display:inline-flex}.settings-switch input{opacity:0;pointer-events:none;position:absolute}.settings-switch-track{border:1px solid var(--border-2);background:var(--surface-4);width:44px;height:24px;transition:background var(--t-normal), border-color var(--t-normal);border-radius:999px;align-items:center;padding:2px;display:flex}.settings-switch-thumb{background:var(--muted);width:18px;height:18px;transition:transform var(--t-normal), background var(--t-normal);border-radius:50%;transform:translate(0);box-shadow:0 1px 4px #00000059}.settings-switch input:checked+.settings-switch-track{background:var(--accent);border-color:var(--accent-glow)}.settings-switch input:checked+.settings-switch-track .settings-switch-thumb{background:#fff;transform:translate(20px)}.connection-list{gap:8px;display:grid}.connection-card{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);transition:border-color var(--t-fast), background var(--t-fast);justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.connection-card:hover{background:var(--surface-3);border-color:var(--border-2)}.search-suggestions{background:var(--surface-2);border:1px solid var(--border-2);border-radius:var(--radius-md);z-index:20;box-shadow:var(--shadow-lg);gap:2px;padding:6px;animation:.15s fadeIn;display:grid;position:absolute;top:calc(100% + 6px);left:0;right:0}.suggestion-item{text-align:left;color:var(--text);border-radius:var(--radius-xs);cursor:pointer;background:0 0;border:1px solid #0000;padding:8px 10px;font-size:13px;font-weight:400}.suggestion-item:hover{background:var(--accent-dim);border-color:var(--accent-glow);color:var(--text)}@media (max-width:700px){.style-popup{width:auto;bottom:12px;left:12px;right:12px}.settings-window{width:auto;max-height:90vh;top:4%;left:4%;right:4%}.settings-header{flex-wrap:wrap;align-items:flex-start;gap:10px}.badge-row{grid-template-columns:1fr}.danger-card,.connection-card{flex-direction:column;align-items:flex-start}}.appearance-theme-options{flex-wrap:wrap;gap:8px;display:flex}.appearance-theme-btn{border-radius:var(--radius-sm);border:2px solid var(--border-2);background:var(--surface-3);cursor:pointer;transition:all var(--t-fast);padding:10px 20px;font-size:13px;font-weight:600}.appearance-theme-btn:hover{border-color:var(--border-3);transform:translateY(-1px)}.appearance-theme-btn.active{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.text-size-slider{align-items:center;gap:12px;display:flex}.text-size-slider input[type=range]{-webkit-appearance:none;background:var(--surface-4);cursor:pointer;border-radius:3px;flex:1;height:6px}.text-size-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);cursor:pointer;border-radius:50%;width:16px;height:16px}.text-size-value{min-width:40px;color:var(--text-2);font-size:12px;font-weight:600}.appearance-option{background:var(--surface-3);border:1px solid var(--border);border-radius:var(--radius-sm);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}@keyframes stylePopupIn{0%{opacity:0;transform:translateY(18px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}