.card{width:300px;height:300px;border:1px solid #866868;background:#fdc3db;color:#242424;border-radius:10px;display:flex;justify-content:center;align-items:center}.animated-button{padding:10px 20px;border:none;background-color:#007bff;color:#fff;font-size:16px;cursor:pointer;border-radius:4px;transition:background-color .3s}.animated-button:hover{background-color:#0056b3}.animated-button:active{background-color:#004085}.fade-in{transition:opacity 1s}.slide-in{overflow:hidden}.modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;justify-content:center;align-items:center}.modal-content{background:#fff;padding:20px;border-radius:8px;position:relative}.close-button{position:absolute;top:10px;right:10px;background:none;border:none;font-size:16px;cursor:pointer}.accordion{border:1px solid #dee2e6;border-radius:4px;margin-bottom:10px}.accordion-title{background:#e9ecef;padding:10px;margin:0;border-bottom:1px solid #dee2e6;color:#130707}.accordion-content{padding:10px}.staggered-list{list-style:none;padding:0}.staggered-list li{margin:5px 0;padding:10px;background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px}.rotating-loader{width:50px;height:50px;border:5px solid #007bff;border-top-color:transparent;border-radius:50%}.draggable-card{background:#f8f9fa;padding:20px;border-radius:8px;color:#130707;width:300px;height:400px}.bounce{display:inline-block;padding:10px 20px;background-color:#28a745;color:#fff;font-size:16px;border-radius:4px}.colorful-spinner{width:50px;height:50px;border:5px solid transparent;border-top-color:#ff5733;border-right-color:#33ff57;border-bottom-color:#3357ff;border-radius:50%}.waving-hand{font-size:140px}.tabs{display:flex;flex-direction:column;width:100%;max-width:600px;margin:0 auto}.tab-list{display:flex;justify-content:space-around;margin-bottom:10px}.tab-item{background-color:#a0d5f8;color:#000;border:none;padding:10px 20px;cursor:pointer;border-radius:5px;transition:background-color .3s ease}.tab-item.active{background-color:#2980b9}.tab-content{padding:20px;border:1px solid #ddd;border-radius:10px;background-color:#fff;color:#000}.progress-bar-container{width:100%;height:20px;background-color:#e0e0e0;border-radius:10px;overflow:hidden}.progress-bar{height:100%;border-radius:10px}.pagination{display:flex;justify-content:center;margin-top:20px}.pagination-item{background-color:#62bbf8;color:#fff;border:none;padding:10px 15px;margin:0 5px;border-radius:5px;cursor:pointer;transition:background-color .3s ease}.pagination-item.active{background-color:#0c3a57}.pagination-item:hover{background-color:#3d6e8d}.carousel{position:relative;width:100%;max-width:600px;margin:0 auto;overflow:hidden;border-radius:10px}.carousel-image{width:100%;border-radius:10px;display:block}.carousel-button{position:absolute;top:50%;transform:translateY(-50%);background-color:#00000080;color:#fff;border:none;padding:10px;cursor:pointer;border-radius:50%}.carousel-button.prev{left:10px}.carousel-button.next{right:10px}.carousel-button:hover{background-color:#000000b3}.form-input-with-validation{display:flex;flex-direction:column;margin-bottom:20px}.form-input-with-validation label{margin-bottom:5px;font-weight:700}.form-input-with-validation input{padding:10px;border:1px solid #ddd;border-radius:5px;font-size:16px;transition:border-color .3s ease}.form-input-with-validation input.error{border-color:#e74c3c}.form-input-with-validation input:focus{outline:none;border-color:#007bff}.form-input-with-validation .error-message{color:#e74c3c;margin-top:5px;font-size:14px}.stepper{display:flex;flex-direction:column;width:100%;max-width:600px;margin:0 auto}.stepper .stepper-header{display:flex;justify-content:space-between;margin-bottom:20px;position:relative}.stepper .stepper-header .stepper-step{display:flex;flex-direction:column;align-items:center;position:relative;flex:1}.stepper .stepper-header .stepper-step .step-number{width:30px;height:30px;border-radius:50%;background-color:#ddd;display:flex;align-items:center;justify-content:center;margin-bottom:5px;transition:background-color .3s ease}.stepper .stepper-header .stepper-step .step-label{font-size:14px}.stepper .stepper-header .stepper-step.active .step-number{background-color:#007bff;color:#fff}.stepper .stepper-content{padding:20px;border:1px solid #ddd;border-radius:5px;margin-bottom:20px;min-height:150px}.stepper .stepper-controls{display:flex;justify-content:space-between}.stepper .stepper-controls button{padding:10px 20px;border:none;border-radius:5px;cursor:pointer;font-size:16px;transition:background-color .3s ease}.stepper .stepper-controls button:disabled{background-color:#ccc;cursor:not-allowed}.stepper .stepper-controls button:not(:disabled){background-color:#007bff;color:#fff}.stepper .stepper-controls button:not(:disabled):hover{background-color:#0056b3}.search-bar{display:flex;align-items:center;background-color:#f7f7f7;border:1px solid #ddd;border-radius:5px;overflow:hidden;padding:5px}.search-bar input{border:none;padding:10px;flex-grow:1;font-size:16px;border-radius:5px 0 0 5px}.search-bar input:focus{outline:none}.search-bar button{background-color:#007bff;color:#fff;border:none;padding:10px 20px;cursor:pointer;font-size:16px;border-radius:0 5px 5px 0;transition:background-color .3s ease}.search-bar button:hover{background-color:#0056b3}.sidebar{position:fixed;top:0;left:0;width:250px;height:100%;background-color:#333;color:#fff;padding:20px;box-shadow:2px 0 5px #00000080;z-index:1000;transform:translate(-100%)}.sidebar .toggle-btn{background-color:#007bff;color:#fff;border:none;padding:10px 20px;cursor:pointer;margin-bottom:20px;border-radius:5px;font-size:16px}.sidebar ul{list-style:none;padding:0}.sidebar ul li{margin-bottom:15px}.sidebar ul li a{color:#fff;text-decoration:none;font-size:18px;transition:color .3s ease}.sidebar ul li a:hover{color:#007bff}.sidebar.open{transform:translate(0)}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-height:100vh}h1{font-size:3.2em;line-height:1.1}