.group span { pointer-events: none; }
        ::-webkit-scrollbar { display: none; }
        body { -ms-overflow-style: none; scrollbar-width: none; }
        .panel-scroll { scrollbar-width: none; }
        .panel-scroll.scroll-show { scrollbar-width: thin; }
        .panel-scroll::-webkit-scrollbar { width: 0; }
        .panel-scroll.scroll-show::-webkit-scrollbar { width: 3px; }
        .panel-scroll::-webkit-scrollbar-track { background: transparent; }
        .panel-scroll::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 2px; }
        .scrollbar-thin::-webkit-scrollbar { width: 6px; }
        .scrollbar-thin::-webkit-scrollbar-track { background: transparent; }
        .scrollbar-thin::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 3px; }
        .scrollbar-thin::-webkit-scrollbar-thumb:hover { background: #a1a1aa; }
        .edit-scroll::-webkit-scrollbar { width: 6px; }
        .edit-scroll::-webkit-scrollbar-track { background: transparent; }
        .edit-scroll::-webkit-scrollbar-thumb { background: #c4b5fd; border-radius: 3px; }
        .edit-scroll::-webkit-scrollbar-thumb:hover { background: #a78bfa; }
        @keyframes fadeIn { from { opacity:0; transform:scale(0.95) } to { opacity:1; transform:scale(1) } }
        .animate-fadeIn { animation: fadeIn 0.2s ease-out; }
        @keyframes slideUp { from { transform:translateY(100%) } to { transform:translateY(0) } }
        .animate-slideUp { animation: slideUp 0.3s cubic-bezier(0.32,0.72,0,1); }
        .reflow-trigger { animation: reflow 0.01s; }
        @keyframes reflow { from { opacity:0.99 } to { opacity:1 } }
        :root { --p: #9333ea; --p1: #f3e8ff; --p5: #faf5ff; }
        .theme-blue { --p: #2563eb; --p1: #dbeafe; --p5: #eff6ff; }
        .theme-green { --p: #059669; --p1: #d1fae5; --p5: #ecfdf5; }
        .theme-orange { --p: #ea580c; --p1: #ffedd5; --p5: #fff7ed; }
        .theme-pink { --p: #db2777; --p1: #fce7f3; --p5: #fdf2f8; }
        .theme-blue .bg-purple-600 { background-color: var(--p) !important; }
        .theme-blue .text-purple-600 { color: var(--p) !important; }
        .theme-blue .text-purple-500 { color: var(--p) !important; }
        .theme-blue .border-purple-500, .theme-blue .border-purple-400, .theme-blue .border-purple-300, .theme-blue .border-purple-200 { border-color: color-mix(in srgb, var(--p) 30%, transparent) !important; }
        .theme-blue .focus\\:border-purple-500 { border-color: var(--p) !important; }
        .theme-blue .ring-purple-500, .theme-blue .focus\\:ring-purple-500\\/20 { --tw-ring-color: color-mix(in srgb, var(--p) 20%, transparent) !important; }
        .theme-blue .bg-purple-100, .theme-blue .bg-purple-50 { background-color: var(--p1) !important; }
        .theme-blue .hover\\:bg-purple-50:hover { background-color: var(--p5) !important; }
        .theme-blue .hover\\:bg-purple-700:hover { background-color: var(--p) !important; }
        .theme-blue .hover\\:bg-purple-100:hover { background-color: var(--p1) !important; }
        .theme-green .bg-purple-600 { background-color: var(--p) !important; }
        .theme-green .text-purple-600 { color: var(--p) !important; }
        .theme-green .text-purple-500 { color: var(--p) !important; }
        .theme-green .border-purple-500, .theme-green .focus\\:border-purple-500 { border-color: var(--p) !important; }
        .theme-green .ring-purple-500, .theme-green .focus\\:ring-purple-500\\/20 { --tw-ring-color: color-mix(in srgb, var(--p) 20%, transparent) !important; }
        .theme-green .bg-purple-100, .theme-green .bg-purple-50 { background-color: var(--p1) !important; }
        .theme-green .hover\\:bg-purple-50:hover { background-color: var(--p5) !important; }
        .theme-green .hover\\:bg-purple-700:hover { background-color: var(--p) !important; }
        .theme-orange .bg-purple-600 { background-color: var(--p) !important; }
        .theme-orange .text-purple-600 { color: var(--p) !important; }
        .theme-orange .text-purple-500 { color: var(--p) !important; }
        .theme-orange .border-purple-500, .theme-orange .focus\\:border-purple-500 { border-color: var(--p) !important; }
        .theme-orange .ring-purple-500, .theme-orange .focus\\:ring-purple-500\\/20 { --tw-ring-color: color-mix(in srgb, var(--p) 20%, transparent) !important; }
        .theme-orange .bg-purple-100, .theme-orange .bg-purple-50 { background-color: var(--p1) !important; }
        .theme-orange .hover\\:bg-purple-50:hover { background-color: var(--p5) !important; }
        .theme-orange .hover\\:bg-purple-700:hover { background-color: var(--p) !important; }
        .theme-pink .bg-purple-600 { background-color: var(--p) !important; }
        .theme-pink .text-purple-600 { color: var(--p) !important; }
        .theme-pink .text-purple-500 { color: var(--p) !important; }
        .theme-pink .border-purple-500, .theme-pink .focus\\:border-purple-500 { border-color: var(--p) !important; }
        .theme-pink .ring-purple-500, .theme-pink .focus\\:ring-purple-500\\/20 { --tw-ring-color: color-mix(in srgb, var(--p) 20%, transparent) !important; }
        .theme-pink .bg-purple-100, .theme-pink .bg-purple-50 { background-color: var(--p1) !important; }
        .theme-pink .hover\\:bg-purple-50:hover { background-color: var(--p5) !important; }
        .theme-pink .hover\\:bg-purple-700:hover { background-color: var(--p) !important; }
        .theme-blue .dark\\:border-purple-600, .theme-blue .dark\\:text-purple-400 { border-color: var(--p) !important; color: var(--p) !important; }
        .theme-green .dark\\:border-purple-600, .theme-green .dark\\:text-purple-400 { border-color: var(--p) !important; color: var(--p) !important; }
        .theme-orange .dark\\:border-purple-600, .theme-orange .dark\\:text-purple-400 { border-color: var(--p) !important; color: var(--p) !important; }
        .theme-pink .dark\\:border-purple-600, .theme-pink .dark\\:text-purple-400 { border-color: var(--p) !important; color: var(--p) !important; }
        .theme-blue .dark\\:hover\\:bg-purple-900\\/30:hover { background-color: color-mix(in srgb, var(--p) 30%, black) !important; }
        .theme-green .dark\\:hover\\:bg-purple-900\\/30:hover { background-color: color-mix(in srgb, var(--p) 30%, black) !important; }
        .theme-orange .dark\\:hover\\:bg-purple-900\\/30:hover { background-color: color-mix(in srgb, var(--p) 30%, black) !important; }
        .theme-pink .dark\\:hover\\:bg-purple-900\\/30:hover { background-color: color-mix(in srgb, var(--p) 30%, black) !important; }
        .theme-blue .dark\\:bg-purple-900\\/20 { background-color: color-mix(in srgb, var(--p) 20%, black) !important; }
        .theme-green .dark\\:bg-purple-900\\/20 { background-color: color-mix(in srgb, var(--p) 20%, black) !important; }
        .theme-orange .dark\\:bg-purple-900\\/20 { background-color: color-mix(in srgb, var(--p) 20%, black) !important; }
        .theme-pink .dark\\:bg-purple-900\\/20 { background-color: color-mix(in srgb, var(--p) 20%, black) !important; }
        .theme-blue .hover\\:border-purple-500:hover, .theme-blue .hover\\:border-purple-400:hover { border-color: var(--p) !important; }
        .theme-green .hover\\:border-purple-500:hover, .theme-green .hover\\:border-purple-400:hover { border-color: var(--p) !important; }
        .theme-orange .hover\\:border-purple-500:hover, .theme-orange .hover\\:border-purple-400:hover { border-color: var(--p) !important; }
        .theme-pink .hover\\:border-purple-500:hover, .theme-pink .hover\\:border-purple-400:hover { border-color: var(--p) !important; }
        .theme-blue .ring-1.ring-purple-500 { --tw-ring-color: var(--p) !important; }
        .theme-green .ring-1.ring-purple-500 { --tw-ring-color: var(--p) !important; }
        .theme-orange .ring-1.ring-purple-500 { --tw-ring-color: var(--p) !important; }
        .theme-pink .ring-1.ring-purple-500 { --tw-ring-color: var(--p) !important; }
        .theme-blue .shadow-purple-500\\/20, .theme-blue .shadow-purple-500\\/30 { --tw-shadow-color: color-mix(in srgb, var(--p) 20%, transparent) !important; }
        .theme-green .shadow-purple-500\\/20, .theme-green .shadow-purple-500\\/30 { --tw-shadow-color: color-mix(in srgb, var(--p) 20%, transparent) !important; }
        .theme-orange .shadow-purple-500\\/20, .theme-orange .shadow-purple-500\\/30 { --tw-shadow-color: color-mix(in srgb, var(--p) 20%, transparent) !important; }
        .theme-pink .shadow-purple-500\\/20, .theme-pink .shadow-purple-500\\/30 { --tw-shadow-color: color-mix(in srgb, var(--p) 20%, transparent) !important; }
        .theme-blue .hover\\:bg-purple-600 { background-color: var(--p) !important; }
        .theme-green .hover\\:bg-purple-600 { background-color: var(--p) !important; }
        .theme-orange .hover\\:bg-purple-600 { background-color: var(--p) !important; }
        .theme-pink .hover\\:bg-purple-600 { background-color: var(--p) !important; }
        .theme-blue .dark\\:bg-purple-900, .theme-blue .dark\\:bg-purple-900\\/50, .theme-blue .dark\\:bg-purple-900\\/20 { background-color: color-mix(in srgb, var(--p) 80%, black) !important; }
        .theme-green .dark\\:bg-purple-900, .theme-green .dark\\:bg-purple-900\\/50, .theme-green .dark\\:bg-purple-900\\/20 { background-color: color-mix(in srgb, var(--p) 80%, black) !important; }
        .theme-orange .dark\\:bg-purple-900, .theme-orange .dark\\:bg-purple-900\\/50, .theme-orange .dark\\:bg-purple-900\\/20 { background-color: color-mix(in srgb, var(--p) 80%, black) !important; }
        .theme-pink .dark\\:bg-purple-900, .theme-pink .dark\\:bg-purple-900\\/50, .theme-pink .dark\\:bg-purple-900\\/20 { background-color: color-mix(in srgb, var(--p) 80%, black) !important; }
        
        @keyframes gradientShift {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
        }
        @keyframes fadeInUp {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }
        @keyframes float {
            0%, 100% { transform: translateY(0px); }
            50% { transform: translateY(-10px); }
        }
        @keyframes glow {
            0%, 100% { opacity: 0.6; }
            50% { opacity: 1; }
        }