:root{font-family: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;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background-color:#f4f4f4;color:#333}.header,.footer{background-color:#2d2d2d;color:#fff;padding:10px;text-align:center}.content{padding:15px}@media (min-width: 768px){.content{padding:20px}}.header{background-color:#222;color:#fff;padding:1rem;text-align:center}.footer{background-color:#222;color:#fff;padding:1rem;text-align:center;position:fixed;bottom:0;width:100%}.player-layout{display:flex;flex-direction:column;min-height:100vh}.content{flex:1;padding:1rem}.login-container{display:flex;justify-content:center;align-items:center;height:100vh;background-color:#f5f7fa}.login-form{background-color:#fff;padding:2rem;border-radius:12px;box-shadow:0 0 12px #0000001a;width:100%;max-width:400px}.login-form h2{margin-bottom:1.5rem;text-align:center;color:#333}button{width:100%;padding:.8rem;font-size:1rem;background-color:#007bff;color:#fff;border:none;border-radius:8px;cursor:pointer;margin-top:1rem}button:hover{background-color:#0056b3}.forgot-password{margin-top:1rem;text-align:center;font-size:.9rem}.forgot-password a{color:#007bff;text-decoration:none}.forgot-password a:hover{text-decoration:underline}.forgot-password-container{display:flex;justify-content:center;align-items:center;height:100vh;background-color:#f5f7fa}.forgot-password-form{background-color:#fff;padding:2rem;border-radius:12px;box-shadow:0 0 12px #0000001a;width:100%;max-width:400px}.forgot-password-form h2{margin-bottom:1.5rem;text-align:center;color:#333}.form-group{margin-bottom:1rem}.form-group label{display:block;font-weight:500;margin-bottom:.5rem;color:#555}.form-group input{width:100%;padding:.6rem .8rem;border:1px solid #ccc;border-radius:8px;font-size:1rem}.error-message{color:#e63946;font-size:.875rem;margin-top:.25rem}button{width:100%;padding:.8rem;font-size:1rem;background-color:#28a745;color:#fff;border:none;border-radius:8px;cursor:pointer;margin-top:1rem}button:hover{background-color:#218838}.back-to-login{margin-top:1rem;text-align:center;font-size:.9rem}.back-to-login a{color:#007bff;text-decoration:none}.back-to-login a:hover{text-decoration:underline}.player-page-container{display:flex;flex-direction:column;align-items:center;padding:2rem;background-color:#f9fafc;min-height:100vh;box-sizing:border-box}.player-header{font-size:2rem;font-weight:700;margin-bottom:2rem;color:#333}.audio-player{display:flex;flex-direction:column;align-items:center;background-color:#fff;padding:1.5rem 2rem;border-radius:16px;box-shadow:0 4px 12px #00000014;max-width:500px;width:100%}.audio-controls{display:flex;justify-content:center;gap:1.2rem;margin-top:1.2rem}.control-button{padding:.8rem 1.2rem;font-size:1rem;border:none;background-color:#007bff;color:#fff;border-radius:8px;cursor:pointer;transition:background-color .3s}.control-button:hover{background-color:#0056b3}.audio-progress{width:100%;margin-top:1.5rem;height:6px;background-color:#ddd;border-radius:4px;position:relative;overflow:hidden}.audio-progress-bar{height:100%;width:0%;background-color:#28a745;transition:width .25s ease}.audio-title{margin-top:1rem;font-weight:500;color:#444}.change-password-container{display:flex;justify-content:center;align-items:center;padding:2rem;background-color:#f5f7fa;min-height:100vh;box-sizing:border-box}.change-password-box{background-color:#fff;padding:2rem 2.5rem;border-radius:12px;box-shadow:0 4px 12px #00000014;max-width:400px;width:100%}.change-password-box h2{margin-bottom:1.5rem;font-size:1.5rem;text-align:center;color:#333}.change-password-form{display:flex;flex-direction:column;gap:1.2rem}.change-password-form label{font-weight:500;color:#444;margin-bottom:.3rem}.change-password-form input{padding:.6rem .8rem;border-radius:6px;border:1px solid #ccc;font-size:1rem;outline:none}.change-password-form input:focus{border-color:#007bff;box-shadow:0 0 0 2px #007bff33}.change-password-button{background-color:#007bff;color:#fff;padding:.8rem;font-size:1rem;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s}.change-password-button:hover{background-color:#0056b3}.error-message{color:#dc3545;font-size:.9rem}.profile-container{display:flex;justify-content:center;align-items:center;padding:2rem;min-height:100vh;background-color:#f0f2f5;box-sizing:border-box}.profile-box{background-color:#fff;padding:2.5rem 3rem;border-radius:12px;box-shadow:0 4px 12px #00000014;width:100%;max-width:500px}.profile-box h2{font-size:1.8rem;margin-bottom:1.5rem;text-align:center;color:#333}.profile-info{display:flex;flex-direction:column;gap:1rem}.profile-field{display:flex;flex-direction:column}.profile-field label{font-weight:500;margin-bottom:.3rem;color:#555}.profile-field input{padding:.6rem .8rem;font-size:1rem;border:1px solid #ccc;border-radius:6px;outline:none;background-color:#f9f9f9}.profile-field input:focus{border-color:#007bff;background-color:#fff;box-shadow:0 0 0 2px #007bff33}.profile-actions{margin-top:1.5rem;display:flex;justify-content:flex-end}.profile-actions button{padding:.7rem 1.2rem;font-size:1rem;color:#fff;background-color:#007bff;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s}.profile-actions button:hover{background-color:#0056b3}