:root{--sp-bg-primary:#fff;--sp-bg-secondary:#f8fafc;--sp-bg-tertiary:#f1f5f9;--sp-text-primary:#1e293b;--sp-text-secondary:#475569;--sp-text-muted:#64748b;--sp-border:#e2e8f0;--sp-border-light:#f1f5f9;--sp-brand:#2563eb;--sp-brand-hover:#1d4ed8;--sp-brand-light:#eef2ff;--sp-shadow:#0000000d;--sp-shadow-md:#0000001a}@media (prefers-color-scheme:dark){:root{--sp-bg-primary:#1e293b;--sp-bg-secondary:#0f172a;--sp-bg-tertiary:#334155;--sp-text-primary:#f1f5f9;--sp-text-secondary:#cbd5e1;--sp-text-muted:#94a3b8;--sp-border:#334155;--sp-border-light:#1e293b;--sp-brand:#3b82f6;--sp-brand-hover:#60a5fa;--sp-brand-light:#1e3a5f;--sp-shadow:#0003;--sp-shadow-md:#0000004d}}.dark-mode{--sp-bg-primary:#1e293b;--sp-bg-secondary:#0f172a;--sp-bg-tertiary:#334155;--sp-text-primary:#f1f5f9;--sp-text-secondary:#cbd5e1;--sp-text-muted:#94a3b8;--sp-border:#334155;--sp-border-light:#1e293b;--sp-brand:#3b82f6;--sp-brand-hover:#60a5fa;--sp-brand-light:#1e3a5f;--sp-shadow:#0003;--sp-shadow-md:#0000004d}.light-mode{--sp-bg-primary:#fff;--sp-bg-secondary:#f8fafc;--sp-bg-tertiary:#f1f5f9;--sp-text-primary:#1e293b;--sp-text-secondary:#475569;--sp-text-muted:#64748b;--sp-border:#e2e8f0;--sp-border-light:#f1f5f9;--sp-brand:#2563eb;--sp-brand-hover:#1d4ed8;--sp-brand-light:#eef2ff;--sp-shadow:#0000000d;--sp-shadow-md:#0000001a}.settings-page{background:var(--sp-bg-secondary);flex-direction:column;min-height:calc(100vh - 120px);padding:0;display:flex}.settings-sidebar{background:var(--sp-bg-primary);border-right:1px solid var(--sp-border);background-color:var(--sp-bg-tertiary);flex-direction:column;justify-content:center;align-items:center;width:100%;margin-bottom:1rem;padding:1rem 0;display:flex}.settings-title{color:var(--sp-text-primary);margin-bottom:1rem;font-size:1.2rem}.settings-nav{background-color:var(--sp-bg-tertiary);flex-flow:wrap;gap:.4rem;padding:0;display:flex}.settings-nav button{text-align:left;cursor:pointer;color:var(--sp-text-secondary);background:0 0;border:none;border-radius:8px;padding:.6rem .7rem;font-size:.95rem;transition:all .2s}.settings-nav button:hover{background:var(--sp-bg-secondary);color:var(--sp-text-primary)}.settings-nav button.active{background:var(--sp-brand);color:#fff}.settings-content{flex:1;padding:0}.settings-placeholder{background:var(--sp-bg-primary);border:1px dashed var(--sp-border);text-align:center;border-radius:12px;padding:2rem}.settings-placeholder h3{color:var(--sp-text-primary);margin-bottom:.5rem}.settings-placeholder p{color:var(--sp-text-muted);font-size:.95rem}@media (max-width:768px){.settings-page{flex-direction:column}.settings-sidebar{border-right:none;border-bottom:1px solid var(--sp-border);width:100%}.settings-nav{background-color:var(--sp-bg-tertiary);border-radius:8px;flex-direction:row;justify-content:center;gap:.4rem;padding:.5rem;display:flex}.settings-nav button{white-space:nowrap}}@media (max-width:480px){.settings-page{padding:0}.settings-nav{flex-wrap:wrap}.settings-nav button{padding:.5rem .6rem;font-size:.85rem}.settings-placeholder{padding:1rem}.settings-placeholder h3{font-size:1rem}}