Design grok violet by Aurekin

/* ==UserStyle==
@name           Grok violet style
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    Style for grok website
@author         Aurélien Bessonnet
==/UserStyle== */
@-moz-document domain("grok.com") {
     body {
        background-color: #bd7ef8 !important; 
    }
    
    .message-bubble {
        font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
        color: #ffebba !important;
    }
    
    p.break-words {
        font-family: "Merriweather", serif;
        color: #242423 !important;
    }

    .break-words a {
        color: #9020ac !important;
    }
    .action-buttons {
        opacity: 0.3 !important; 
        background-color: #705f1c;
        
    }
    .action-buttons button {
        color: #050402;
    }
    span.text-secondary {
        color: #fff;   
    }
    
    .flex.items-center.bg-background {
        background-color: transparent !important; 
    }

    svg.text-primary {
        opacity: 1 !important; 
    }
    .bg-gradient-to-t, 
    .bg-gradient-to-b {
        background: none !important;  
    }
    .overflow-visible .bg-gradient-to-t {
        background: linear-gradient(to top, #ffffffa8, transparent) !important;
    }

    .overflow-visible .bg-gradient-to-b {
        background: linear-gradient(to bottom, #ffffffa8, transparent) !important;
    }
    
    /* code */
    .dark\:text-dawn:is(.dark *){
        color: #e7d33fc4;
        font-weight: 600;
    }
    
    /* Input */
    .bg-background .ring-1 {
        font-family: "Merriweather", serif;
        opacity: 0.6; /* Opacité affaiblie */
        background: linear-gradient(135deg, rgba(255, 223, 100, 0.6), rgba(255, 236, 150, 0.5));
    }

    /* Conteneur principal avec bordures partielles et coins arrondis en haut */
    .bg-background.rounded-t-\[40px\] {
        background: linear-gradient(135deg, rgba(255, 223, 100, 0.6), rgba(255, 219, 90, .4), rgba(255, 236, 160, 0.5));  
        opacity: 0.7; /* Ajustée pour un rendu plus lumineux */

        /* Coins supérieurs arrondis */
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;

        /* Légère ombre pour donner du relief */
        box-shadow: 0px -3px 10px rgba(255, 223, 80, 0.3);
    }
    
    textarea.text-primary.px-2{
        color: #403d38 !important;
    }
    .text-secondary {
        color: black;
    }
    .text-xs {
        color: #d8bee5; 
    }
    .text-primary.text-xs {
        color: #998325;
    }
    
    .lucide {
        color: #d5b83f !important;
    }

    /* Effet au survol */
    .bg-background.rounded-t-\[40px\], .bg-background .ring-1:hover {
        background: linear-gradient(135deg, rgba(255, 238, 130, 0.9), rgba(255, 229, 60, .56), rgba(255, 220, 150, 0.85));
        opacity: 0.5;
        transition: background 0.3s ease-in-out;
    }
}