body { font-family: 'Inter', sans-serif; background-color: #f3f4f6; margin:0; padding:0; }
.container-greentext { max-width:1250px; margin:0.8rem auto; padding:1rem; background:#fff; border-radius:8px; box-shadow:0 0 15px rgba(0,0,0,0.1); }
.btn-gradient { background: linear-gradient(90deg, #553c9a, #ee4b2b); color:#fff; border:none; transition: none !important; }
.btn-gradient:hover { opacity:1 !important; background:linear-gradient(90deg, #553c9a, #ee4b2b) !important; }
.loader-border { width:1rem; height:1rem; border:2px solid #fff; border-right-color:transparent; border-radius:50%; animation:spinner 0.6s linear infinite; }
@keyframes spinner { to { transform:rotate(360deg); } }
.textarea-wrapper { position:relative; }
.textarea-dice-icon { position:absolute; top:35px; right:10px; color:black; cursor:pointer; z-index:10; }
textarea#promptInput { padding-right:2rem; }
.custom-scroll::-webkit-scrollbar { height:6px; }
.custom-scroll::-webkit-scrollbar-track { background:#e5e7eb; }
.custom-scroll::-webkit-scrollbar-thumb { background-color:#9ca3af; border-radius:3px; }
.step {
    background-color: #f9f9f9;
    padding: 20px;
}
@media screen and (max-width: 768px) {
    .step {
        padding: 15px;
        margin-bottom: 20px;
        max-width: 100%;
        overflow-x: hidden;
    }
}
.step-description {
    font-size: 16px;
    color: #666;
}