body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.canvas-container{align-items:center;display:flex;flex-direction:column;gap:1.5rem}.drawing-canvas{background:#000;border:3px solid #2c3e50;border-radius:16px;box-shadow:0 8px 16px #00000026;cursor:crosshair;touch-action:none;transition:all .3s ease}.drawing-canvas:hover{box-shadow:0 12px 24px #0003;transform:translateY(-2px)}.button-group{display:flex;gap:1rem}.clear-button,.predict-button{border:none;border-radius:12px;box-shadow:0 4px 12px #00000026;color:#fff;cursor:pointer;font-size:1.05rem;font-weight:700;letter-spacing:.5px;padding:.875rem 2.5rem;transition:all .3s ease}.predict-button{background:linear-gradient(135deg,#667eea,#764ba2)}.predict-button:hover{background:linear-gradient(135deg,#5568d3,#63408a);box-shadow:0 8px 20px #667eea66;transform:translateY(-3px)}.predict-button:active{box-shadow:0 4px 12px #00000026;transform:translateY(-1px)}.clear-button{background:linear-gradient(135deg,#f093fb,#f5576c)}.clear-button:hover{background:linear-gradient(135deg,#e082ea,#e4465b);box-shadow:0 8px 20px #f5576c66;transform:translateY(-3px)}.clear-button:active{box-shadow:0 4px 12px #00000026;transform:translateY(-1px)}.prediction-display{background:linear-gradient(135deg,#fdfbfb,#ebedee);border:2px solid #667eea1a;border-radius:20px;box-shadow:0 8px 24px #0000001f;max-width:400px;padding:2rem;width:100%}.prediction-display h3{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:#2c3e50;font-size:1.5rem;font-weight:700;margin:0 0 1.5rem;text-align:center}.loading,.placeholder{color:#7f8c8d;font-size:1rem;padding:2rem;text-align:center}.predictions-grid{display:flex;flex-direction:column;gap:.75rem}.prediction-item{grid-gap:1rem;align-items:center;background:#fff;border:2px solid #0000;border-radius:14px;box-shadow:0 2px 8px #0000000d;display:grid;gap:1rem;grid-template-columns:50px 1fr 70px;padding:.875rem;transition:all .3s ease}.prediction-item:hover{background:#f8f9ff;border-color:#667eea4d;box-shadow:0 4px 16px #667eea26;transform:translateX(6px)}.digit-label{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:#2c3e50;font-size:1.75rem;font-weight:800;text-align:center}.confidence-bar-container{background:linear-gradient(90deg,#e8eaf6,#f3e5f5);border-radius:14px;box-shadow:inset 0 2px 4px #0000000f;height:28px;overflow:hidden;width:100%}.confidence-bar{background:linear-gradient(90deg,#667eea,#764ba2);border-radius:14px;box-shadow:0 2px 8px #667eea4d;height:100%;transition:width .6s cubic-bezier(.4,0,.2,1)}.confidence-value{color:#34495e;font-size:.875rem;font-weight:600;text-align:right}.feedback-form{background:linear-gradient(135deg,#fff5f5,#ffe8e8);border:2px solid #f5576c1a;border-radius:20px;box-shadow:0 8px 24px #f5576c1f;max-width:400px;padding:2rem;width:100%}.feedback-form h3{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#f093fb,#f5576c);-webkit-background-clip:text;background-clip:text;color:#2c3e50;font-size:1.5rem;font-weight:700;margin:0 0 .5rem;text-align:center}.feedback-description{color:#7f8c8d;font-size:.875rem;margin:0 0 1.5rem;text-align:center}.input-group{margin-bottom:1rem}.input-group label{color:#34495e;display:block;font-size:.875rem;font-weight:600;margin-bottom:.5rem}.input-group select{background:#fff;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;font-size:1rem;padding:.75rem;transition:all .2s;width:100%}.input-group select:focus{border-color:#3498db;box-shadow:0 0 0 3px #3498db1a;outline:none}.input-group select:disabled{background:#f5f5f5;cursor:not-allowed}.submit-button{background:linear-gradient(135deg,#11998e,#38ef7d);border:none;border-radius:14px;box-shadow:0 4px 16px #11998e4d;color:#fff;cursor:pointer;font-size:1.05rem;font-weight:700;letter-spacing:.5px;padding:.875rem;transition:all .3s ease;width:100%}.submit-button:hover:not(:disabled){background:linear-gradient(135deg,#0e8778,#2ed968);box-shadow:0 8px 24px #11998e66;transform:translateY(-3px)}.submit-button:active:not(:disabled){box-shadow:0 4px 16px #11998e4d;transform:translateY(-1px)}.submit-button:disabled{background:linear-gradient(135deg,#95a5a6,#7f8c8d);box-shadow:0 2px 8px #0000001a;cursor:not-allowed;transform:none}.success-message{color:#27ae60;font-size:1.125rem;font-weight:600;padding:1.5rem;text-align:center}*{box-sizing:border-box;margin:0;padding:0}.App{background:linear-gradient(135deg,#667eea,#764ba2);display:flex;flex-direction:column;min-height:100vh}.App-header{background:#0003;box-shadow:0 4px 6px #0000001a;color:#fff;padding:2rem;text-align:center}.App-header h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;text-shadow:2px 2px 4px #0000004d}.subtitle{font-size:1.125rem;margin-bottom:1rem;opacity:.9}.model-info{align-items:center;font-size:.875rem;gap:.75rem;margin-top:.5rem;opacity:.8}.App-main,.model-info{display:flex;justify-content:center}.App-main{align-items:flex-start;flex:1 1;padding:2rem}.container{grid-gap:3rem;background:#fff;border-radius:24px;box-shadow:0 10px 40px #00000040;display:grid;gap:3rem;grid-template-columns:auto auto;max-width:1200px;padding:2.5rem;width:100%}.left-section,.right-section{display:flex;flex-direction:column;gap:1.5rem}.left-section{align-items:center;background:linear-gradient(135deg,#f8f9ff,#e8eeff);border:2px solid #667eea1a;border-radius:20px;box-shadow:0 8px 24px #667eea1f;display:flex;flex-direction:column;padding:2.5rem}.instructions{background:#fff;border-radius:16px;box-shadow:0 4px 12px #00000014;max-width:400px;padding:1.5rem;width:100%}.instructions h3{color:#2c3e50;font-size:1.125rem;margin-bottom:1rem}.instructions ul{list-style:none;text-align:left}.instructions li{align-items:center;color:#34495e;display:flex;padding:.5rem 0}.instructions li:before{color:#3498db;content:"→";font-weight:700;margin-right:.75rem}.App-footer{background:#0003;color:#fff;font-size:.875rem;padding:1.5rem;text-align:center}.App-footer p{margin:.25rem 0}.feedback-info{font-weight:600;opacity:.9}@media (max-width:968px){.container{grid-template-columns:1fr;justify-items:center;padding:1.5rem}.App-header h1{font-size:2rem}.left-section,.right-section{max-width:400px;width:100%}}
/*# sourceMappingURL=main.9c944ed9.css.map*/