: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}body{margin:0;padding:0;min-height:100vh}#root{min-height:100vh}.image-upload{width:100%;max-width:500px;margin:0 auto}.upload-prompt{border:3px dashed #ff6347;border-radius:12px;padding:40px 20px;text-align:center;cursor:pointer;background-color:#fff5f5;transition:all .3s ease}.upload-prompt:hover{background-color:#ffe5e5;border-color:#ff4500;transform:scale(1.02)}.upload-icon{font-size:64px;margin-bottom:10px}.upload-prompt p{margin:10px 0 5px;font-size:16px;color:#333}.upload-prompt small{color:#666;font-size:14px}.preview-container{position:relative;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #0000001a}.image-preview{width:100%;height:auto;max-height:400px;object-fit:contain;display:block;background-color:#f5f5f5}.clear-button{position:absolute;top:10px;right:10px;background-color:#f00c;color:#fff;border:none;border-radius:50%;width:40px;height:40px;font-size:18px;cursor:pointer;transition:all .3s ease}.clear-button:hover{background-color:red;transform:scale(1.1)}.clear-button:disabled{opacity:.5;cursor:not-allowed}.change-button{width:100%;margin-top:15px;padding:12px;background-color:tomato;color:#fff;border:none;border-radius:8px;font-size:16px;cursor:pointer;transition:all .3s ease}.change-button:hover{background-color:#ff4500;transform:translateY(-2px);box-shadow:0 4px 8px #ff63474d}.change-button:disabled{opacity:.5;cursor:not-allowed;transform:none}@media(max-width:600px){.upload-prompt{padding:30px 15px}.upload-icon{font-size:48px}.image-preview{max-height:300px}}.result-display{margin-top:30px;animation:slideUp .4s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.result-display h2{text-align:center;color:#333;margin-bottom:20px;font-size:24px}.result-card{background:#fff;border-radius:12px;padding:25px;box-shadow:0 4px 16px #0000001a;max-width:500px;margin:0 auto}.disease-info{margin-bottom:25px;text-align:center}.label{display:block;font-size:14px;color:#666;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px}.disease-name{color:tomato;font-size:28px;margin:10px 0;font-weight:700}.confidence-info{margin-bottom:20px}.confidence-bar-container{width:100%;height:30px;background-color:#f0f0f0;border-radius:15px;overflow:hidden;margin:10px 0;position:relative}.confidence-bar{height:100%;border-radius:15px;transition:width .5s ease-out}.confidence-bar-container.high .confidence-bar{background:linear-gradient(90deg,#4caf50,#8bc34a)}.confidence-bar-container.medium .confidence-bar{background:linear-gradient(90deg,#ff9800,#ffc107)}.confidence-bar-container.low .confidence-bar{background:linear-gradient(90deg,#f44336,#ff5722)}.confidence-value{display:block;text-align:center;font-size:20px;font-weight:700;color:#333;margin-top:5px}.confidence-message{margin-top:20px;padding:15px;border-radius:8px;text-align:center}.confidence-message p{margin:0;font-size:15px;font-weight:500}.confidence-message .high{color:#2e7d32;background-color:#e8f5e9}.confidence-message .medium{color:#f57c00;background-color:#fff3e0}.confidence-message .low{color:#c62828;background-color:#ffebee}@media(max-width:600px){.result-card{padding:20px}.disease-name{font-size:24px}.confidence-value{font-size:18px}}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#ffeaa7,#fdcb6e)}.app-header{text-align:center;padding:30px 20px;background-color:#ffffffe6;box-shadow:0 2px 10px #0000001a}.app-header h1{margin:0;font-size:48px;color:tomato;text-shadow:2px 2px 4px rgba(0,0,0,.1)}.app-header p{margin:10px 0 0;font-size:18px;color:#666}.app-main{flex:1;padding:40px 20px;max-width:800px;width:100%;margin:0 auto}.submit-button,.reset-button{display:block;width:100%;max-width:500px;margin:20px auto;padding:16px 32px;background-color:tomato;color:#fff;border:none;border-radius:8px;font-size:18px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 6px #0000001a}.submit-button:hover:not(:disabled),.reset-button:hover{background-color:#ff4500;transform:translateY(-2px);box-shadow:0 6px 12px #ff63474d}.submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.submit-button:active:not(:disabled),.reset-button:active{transform:translateY(0)}.reset-button{background-color:#4caf50}.reset-button:hover{background-color:#45a049}.spinner{display:inline-block;width:16px;height:16px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;margin-right:10px}@keyframes spin{to{transform:rotate(360deg)}}.error-message{max-width:500px;margin:20px auto;padding:20px;background-color:#ffebee;border-left:4px solid #f44336;border-radius:8px;box-shadow:0 2px 8px #0000001a;animation:shake .5s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.error-icon{font-size:24px;margin-right:10px}.error-message p{margin:10px 0;color:#c62828;font-size:16px}.error-message button{margin-top:10px;padding:8px 16px;background-color:#f44336;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.error-message button:hover{background-color:#d32f2f}.app-footer{text-align:center;padding:20px;background-color:#ffffffe6;box-shadow:0 -2px 10px #0000001a}.app-footer p{margin:0;color:#666;font-size:14px}@media(max-width:600px){.app-header h1{font-size:36px}.app-header p{font-size:16px}.app-main{padding:30px 15px}.submit-button,.reset-button{font-size:16px;padding:14px 28px}}
