body {
 font-family: Arial, sans-serif;
 text-align: center;
 margin-top: 50px;
 background-color: #FFF9DB; /* Light yellow background */
}
h1 {
 color: #9C7C00;      /* Warm golden text */
}
button {
 padding: 10px 20px;
 font-size: 16px;
 cursor: pointer;
 background-color: #FFE066; /* Soft yellow button */
 border: none;
 border-radius: 6px;
 color: #5C4A00;
 font-weight: bold;
}
button:hover {
 background-color: #FFD43B;
}
/* Animated Box Styling */
.box {
 width: 250px;
 height: 100px;
 background-color: #FFF3BF; /* Creamy yellow box */
 color: #5C4A00;
 line-height: 100px;
 margin: 40px auto;
 border-radius: 10px;
 font-size: 18px;
 border: 2px solid #FFD43B;
}
/* Animation Effects */
.box.ng-enter {
 opacity: 0;
 transform: translateX(-100px);
}
.box.ng-enter-active {
 opacity: 1;
 transform: translateX(0);
 transition: all 0.6s ease;
}
.box.ng-leave {
 opacity: 1;
 transform: translateX(0);
}
.box.ng-leave-active {
 opacity: 0;
 transform: translateX(100px);
 transition: all 0.6s ease;
}