:root{--theme-primary: #667eea;--theme-secondary: #764ba2;--theme-accent: #4f46e5;--theme-background: #f8fafc;--theme-surface: #ffffff;--theme-text: #1f2937;--theme-text-secondary: #6b7280;--theme-border: #e5e7eb;--theme-success: #10b981;--theme-warning: #f59e0b;--theme-error: #ef4444;--theme-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%)}body{background-color:var(--theme-background);color:var(--theme-text);transition:background-color .3s ease,color .3s ease}.themed-surface{background-color:var(--theme-surface);color:var(--theme-text);border:1px solid var(--theme-border)}.themed-primary{background:var(--theme-gradient);color:#fff}.themed-button{background:var(--theme-gradient);color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;transition:all .3s ease}.themed-button:hover{opacity:.9;transform:translateY(-1px)}.themed-input{background-color:var(--theme-surface);color:var(--theme-text);border:2px solid var(--theme-border);border-radius:6px;padding:.5rem;transition:border-color .3s ease}.themed-input:focus{border-color:var(--theme-primary);outline:none;box-shadow:0 0 0 3px rgba(var(--theme-primary),.1)}.themed-text-primary{color:var(--theme-primary)}.themed-text-secondary{color:var(--theme-text-secondary)}.themed-border{border-color:var(--theme-border)}.themed-success{color:var(--theme-success)}.themed-warning{color:var(--theme-warning)}.themed-error{color:var(--theme-error)}*{transition:background-color .3s ease,color .3s ease,border-color .3s ease}.theme-selector{position:relative;display:inline-block}.theme-dropdown{position:absolute;top:100%;right:0;background:var(--theme-surface);border:1px solid var(--theme-border);border-radius:8px;box-shadow:0 4px 12px #00000026;z-index:1000;min-width:200px;max-height:300px;overflow-y:auto}.theme-option{padding:12px 16px;cursor:pointer;display:flex;align-items:center;gap:12px;transition:background-color .2s ease}.theme-option:hover{background-color:var(--theme-border)}.theme-option.active{background:var(--theme-gradient);color:#fff}.theme-preview{width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.3)}.theme-name{font-weight:500}*{box-sizing:border-box}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6}