body { font-family: 'Noto Sans KR', sans-serif; }
        
        .glass-panel {
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(229, 231, 235, 0.5);
        }
        
        .gradient-text {
            background: linear-gradient(135deg, #7C3AED 0%, #DB2777 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        /* Sidebar & Menu Styles */
        .sidebar-item {
            position: relative;
            overflow: hidden;
            transition: all 0.3s ease;
        }
        .sidebar-item::before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            width: 4px;
            background: #7C3AED;
            transform: scaleY(0);
            transition: transform 0.3s ease;
        }
        .sidebar-item.active::before {
            transform: scaleY(1);
        }
        .sidebar-item.active {
            background: #F3F4F6;
            color: #7C3AED;
        }

        /* Card Interactions */
        .template-card {
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .template-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 12px 24px -10px rgba(124, 58, 237, 0.15);
            border-color: #d8b4fe;
        }

        /* Category Filter Pills */
        .filter-pill {
            transition: all 0.2s ease;
        }
        .filter-pill.active {
            background-color: #7C3AED;
            color: white;
            border-color: #7C3AED;
        }
        .filter-pill:not(.active):hover {
            background-color: #F3F4F6;
        }

        /* Custom Scrollbar */
        ::-webkit-scrollbar { width: 6px; }
        ::-webkit-scrollbar-track { background: transparent; }
        ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }
        ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

        /* Animation for fade in */
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }
        .animate-fade-in {
            animation: fadeIn 0.4s ease-out forwards;
        }