grok.com by Aurekin

/* ==UserStyle== 
@name           Grok gold 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: #dcc45f !important; 
    }
    
    .message-bubble {
        font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
        color: #fff !important;
    }
    
    p, li.break-words {
        color: #4e4b3f !important;
    }
    
    .break-words strong {
        color: #443806 !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: #653e88;
        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 !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;
    }
}