body,html{padding:0;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;background-color:#000;color:#fff}.red-experience{background:linear-gradient(90deg,#e53e3e,#9b2c2c)}.blue-experience{background:linear-gradient(90deg,#3182ce,#2c5282)}.audio-button{padding:.5rem 1rem;border-radius:.375rem;font-weight:500;transition:all .3s ease;cursor:pointer;border:none}.audio-button.red{background-color:#e53e3e;color:white}.audio-button.red:hover{background-color:#c53030}.audio-button.blue{background-color:#3182ce;color:white}.audio-button.blue:hover{background-color:#2b6cb0}.audio-button.active{box-shadow:0 0 0 4px rgba(255,255,255,.5)}.container{max-width:1200px;margin:0 auto;padding:1rem}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-center{text-align:center}.rounded-lg{border-radius:.5rem}.p-4{padding:1rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}.progress-container{border-radius:9999px;height:.5rem;margin:1rem 0}.progress-bar{border-radius:9999px;transition:width .3s ease}.progress-bar.red{background-color:#f56565}.progress-bar.blue{background-color:#4299e1}.animate-spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.loading-spinner{display:inline-block;width:2.5rem;height:2.5rem;border-radius:50%;border:2px solid #f3f3f3;border-top-color:#3498db;animation:spin 1s linear infinite}:root{--red-gradient-start:#ec4899;--red-gradient-end:#9333ea;--blue-gradient-start:#3b82f6;--blue-gradient-end:#10b981}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background-color:#121212;color:white}.progress-container{width:100%;height:8px;background-color:rgba(255,255,255,.2);border-radius:4px;overflow:hidden}.progress-bar{height:100%;border-radius:4px;transition:width .5s ease}.progress-bar.red{background:linear-gradient(to right,var(--red-gradient-start),var(--red-gradient-end))}.progress-bar.blue{background:linear-gradient(to right,var(--blue-gradient-start),var(--blue-gradient-end))}.red-background{background:linear-gradient(135deg,#450a0a,#3b0764)}.blue-background{background:linear-gradient(135deg,#172554,#064e3b)}.audio-controls{display:flex;justify-content:center;gap:1rem;margin:1rem 0}.audio-controls button{background-color:rgba(255,255,255,.2);border:none;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease}.audio-controls button:hover{background-color:rgba(255,255,255,.3)}.experience-button{border-radius:9999px;padding:1rem;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease;width:60px;height:60px}.experience-button.red{border:3px solid var(--red-gradient-start);background-color:rgba(236,72,153,.2)}.experience-button.blue{border:3px solid var(--blue-gradient-start);background-color:rgba(59,130,246,.2)}