:root{--stone-50: #faf9f7;--stone-100: #f0eeeb;--stone-200: #e2dfda;--stone-300: #c8c3bc;--white: #ffffff;--text-primary: #2e2a25;--text-secondary: #78716c;--terracotta: #c4704b;--terracotta-dark: #a85a38;--terracotta-light: #faf0eb;--sage: #7c9a82;--amber: #d4a054;--rose-muted: #c27070;--ease-out-expo: cubic-bezier(.22, 1, .36, 1)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--stone-50);color:var(--text-primary);line-height:1.6;min-height:100vh;padding:3.5rem 1.5rem 2rem;-webkit-font-smoothing:antialiased}.container{max-width:680px;margin:0 auto}header{padding:0 0 2.5rem;text-align:left}header h1{font-family:"Source Serif 4",Georgia,serif;font-size:2.25rem;font-weight:700;color:var(--text-primary);line-height:1.2;margin-bottom:.5rem;position:relative;display:inline-block}header h1:after{content:"";display:block;width:48px;height:3px;background:var(--terracotta);margin-top:.75rem;border-radius:2px}.subtitle{font-size:1rem;color:var(--text-secondary);font-weight:400;margin-top:.75rem}.upload-section{margin-bottom:2rem}.upload-area{border:2px dashed var(--stone-300);border-radius:20px;padding:3.5rem 2rem;text-align:center;cursor:pointer;transition:border-color .3s ease,background .3s ease;background:var(--white)}.upload-area:hover,.upload-area.dragover{border-color:var(--terracotta);background:var(--terracotta-light)}.upload-icon-circle{width:64px;height:64px;border-radius:50%;background:var(--stone-100);color:var(--terracotta);font-size:2rem;font-weight:300;display:flex;align-items:center;justify-content:center;margin:0 auto 1.25rem;transition:transform .4s var(--ease-out-expo),background .3s ease;line-height:1}.upload-area:hover .upload-icon-circle{transform:scale(1.1);background:var(--terracotta);color:var(--white)}.upload-area h2{font-family:"Source Serif 4",Georgia,serif;font-size:1.35rem;font-weight:600;margin-bottom:.5rem;color:var(--text-primary)}.upload-area p{color:var(--text-secondary);margin-bottom:.25rem;font-size:.95rem}.file-info{font-size:.825rem;color:var(--text-secondary);font-style:normal;opacity:.7}.loading{text-align:center;padding:3.5rem 1rem;animation:fadeUp .4s var(--ease-out-expo) both}.loading-text{color:var(--text-secondary);font-size:.95rem;margin-bottom:.25rem}.progress-bar-track{max-width:320px;height:8px;background:var(--stone-100);border-radius:4px;margin:.75rem auto 0;overflow:hidden}.progress-bar-fill{height:100%;background:var(--terracotta);border-radius:4px;transition:width .15s var(--ease-out-expo)}.progress-percent{font-family:JetBrains Mono,monospace;color:var(--terracotta);font-size:.875rem;margin-top:.5rem}.spinner{display:flex;align-items:center;justify-content:center;gap:6px;margin-bottom:1rem}.spinner span{display:block;width:10px;height:10px;border-radius:50%;background:var(--terracotta);animation:breathe 1.2s ease-in-out infinite}.spinner span:nth-child(2){animation-delay:.15s}.spinner span:nth-child(3){animation-delay:.3s}@keyframes breathe{0%,to{transform:scale(.6);opacity:.3}50%{transform:scale(1);opacity:1}}.results-section{animation:fadeUp .5s var(--ease-out-expo) both}.prediction-box{background:var(--white);color:var(--text-primary);padding:2.5rem;border-radius:12px;margin-bottom:2.5rem;text-align:left;border:1px solid var(--stone-200);border-left:4px solid var(--terracotta);box-shadow:0 1px 3px #0000000a}.prediction-box h2{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-secondary);margin-bottom:1rem}.prediction-result{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}.prediction-class{font-family:"Source Serif 4",Georgia,serif;font-size:2.75rem;font-weight:700;color:var(--text-primary);text-transform:none;letter-spacing:-.5px;line-height:1.1}.confidence{font-family:JetBrains Mono,monospace;font-size:1.1rem;color:var(--terracotta);font-weight:500}.batch-info{display:flex;justify-content:flex-start;gap:1rem;margin-top:1.25rem;flex-wrap:wrap;align-items:center}.scan-count{font-size:.875rem;color:var(--text-secondary)}.agreement-indicator{padding:.3rem .875rem;border-radius:20px;font-size:.8rem;font-weight:600}.agreement-indicator.full-agreement,.agreement-indicator.high-agreement{background:#7c9a8226;color:#5f8266}.agreement-indicator.medium-agreement{background:#d4a05426;color:#b8883a}.agreement-indicator.low-agreement{background:#c2707026;color:#b05555}.probabilities{padding:0;margin-bottom:2.5rem}.probabilities h3{font-family:"Source Serif 4",Georgia,serif;font-size:1.1rem;margin-bottom:1.25rem;color:var(--text-primary);font-weight:600}.probability-bars{display:flex;flex-direction:column;gap:1rem}.prob-item{display:flex;flex-direction:column;gap:.35rem}.prob-label{display:flex;justify-content:space-between;align-items:baseline;font-weight:500;color:var(--text-primary);font-size:.9rem}.prob-bar-container{width:100%;background:var(--stone-100);height:8px;border-radius:4px;overflow:hidden}.prob-bar{height:100%;background:var(--stone-300);border-radius:4px;transition:width .8s var(--ease-out-expo)}.prob-item:first-child .prob-bar{background:var(--terracotta)}.prob-value{font-family:JetBrains Mono,monospace;font-size:.825rem;font-weight:500;color:var(--text-secondary)}.export-section{display:flex;gap:.75rem;margin-bottom:2.5rem}.export-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;background:var(--white);color:var(--terracotta);border:1px solid var(--terracotta);border-radius:10px;font-size:.875rem;font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease}.export-btn:hover{background:var(--terracotta);color:var(--white)}.visualizations{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1.25rem;margin-bottom:2.5rem}.viz-item{padding:0;text-align:left}.viz-item h3{font-size:.825rem;margin-bottom:.75rem;color:var(--text-secondary);font-weight:500;text-transform:uppercase;letter-spacing:.5px}.viz-item img{width:100%;height:auto;border-radius:12px;transition:transform .4s var(--ease-out-expo)}.viz-item img:hover{transform:scale(1.02)}.individual-scans{margin-bottom:2.5rem}.expand-btn{width:auto;display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 0;background:none;border:none;cursor:pointer;font-size:.9rem;font-weight:500;color:var(--terracotta);transition:color .2s ease}.expand-btn:hover{color:var(--terracotta-dark);text-decoration:underline}.expand-icon{width:14px;height:14px;flex-shrink:0;transition:transform .3s var(--ease-out-expo);color:var(--terracotta)}.expand-btn.expanded .expand-icon{transform:rotate(180deg)}.scans-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.75rem;margin-top:1rem;overflow:hidden;transition:max-height .4s var(--ease-out-expo)}.scan-card{background:var(--white);border-radius:16px;border:1px solid var(--stone-200);padding:1rem;display:flex;gap:1rem;align-items:center;animation:fadeUp .4s var(--ease-out-expo) both}.scan-card.error{border:1px solid var(--rose-muted)}.scan-thumbnail{width:80px;height:80px;border-radius:10px;overflow:hidden;flex-shrink:0}.scan-thumbnail img{width:100%;height:100%;object-fit:cover}.scan-details{flex:1;min-width:0}.scan-filename{font-size:.8rem;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.3rem}.scan-prediction{font-family:"Source Serif 4",Georgia,serif;font-size:1.1rem;font-weight:600;color:var(--text-primary)}.scan-confidence{font-family:JetBrains Mono,monospace;font-size:.9rem;color:var(--terracotta);font-weight:500}.scan-overlay{width:80px;height:80px;border-radius:10px;overflow:hidden;flex-shrink:0}.scan-overlay img{width:100%;height:100%;object-fit:cover}.scan-error{color:var(--rose-muted);font-size:.875rem}.file-preview{margin-top:1.25rem}.file-preview-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.file-preview h3{font-size:.95rem;color:var(--text-primary);font-weight:500;margin:0}.file-count-badge{font-family:JetBrains Mono,monospace;background:var(--terracotta);color:var(--white);padding:.1rem .55rem;border-radius:10px;font-size:.8rem;font-weight:500}.add-more-btn{padding:0;background:none;color:var(--terracotta);border:none;font-size:.875rem;font-weight:500;cursor:pointer;transition:color .2s ease}.add-more-btn:hover{color:var(--terracotta-dark);text-decoration:underline}.file-list{display:flex;flex-direction:column;gap:.5rem;max-height:300px;overflow-y:auto;margin-bottom:1.25rem}.file-item{display:flex;align-items:center;gap:.875rem;border-left:2px solid transparent;padding:.625rem 0 .625rem .75rem;transition:border-color .2s ease}.file-item:hover{border-left-color:var(--terracotta)}.file-thumbnail{width:44px;height:44px;border-radius:8px;overflow:hidden;flex-shrink:0}.file-thumbnail img{width:100%;height:100%;object-fit:cover}.file-item-info{flex:1;display:flex;flex-direction:column;gap:.15rem;min-width:0}.file-name{font-weight:500;font-size:.9rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-size{font-family:JetBrains Mono,monospace;font-size:.775rem;color:var(--text-secondary)}.file-remove{width:26px;height:26px;border:none;background:none;color:var(--stone-300);border-radius:50%;cursor:pointer;font-size:1.25rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:color .2s ease;flex-shrink:0}.file-remove:hover{color:var(--rose-muted)}.file-actions{display:flex;gap:1rem;align-items:center}.clear-btn,.upload-btn{padding:.75rem 1.5rem;border:none;border-radius:10px;font-size:.925rem;font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease}.clear-btn{background:none;color:var(--text-secondary);padding-left:0;flex:0}.clear-btn:hover{color:var(--text-primary)}.upload-btn{flex:1;background:var(--terracotta);color:var(--white);border-radius:10px}.upload-btn:hover{background:var(--terracotta-dark)}.reset-btn{display:inline-block;padding:.75rem 2rem;background:var(--terracotta);color:var(--white);border:none;border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;transition:background .2s ease}.reset-btn:hover{background:var(--terracotta-dark)}.reset-hint{color:var(--text-secondary);font-size:.825rem;margin-top:.5rem}footer{margin-top:5rem;padding:1.5rem 0;text-align:left;border-top:1px solid var(--stone-200)}footer p{font-size:.8rem;color:var(--text-secondary);line-height:1.6}.model-info{margin-bottom:.25rem}.disclaimer{font-size:.775rem!important;opacity:.6}@keyframes fadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.toast-container{position:fixed;top:1.25rem;right:1.25rem;display:flex;flex-direction:column;gap:.5rem;z-index:1000;max-width:380px}.toast{display:flex;align-items:flex-start;gap:.75rem;background:var(--white);border:1px solid var(--stone-200);border-left:4px solid var(--rose-muted);border-radius:10px;padding:.875rem 1rem;box-shadow:0 4px 12px #00000014;animation:toastIn .35s var(--ease-out-expo) both;font-size:.9rem;color:var(--text-primary);line-height:1.5}.toast-warning{border-left-color:var(--amber)}.toast-success{border-left-color:var(--sage)}.toast-removing{animation:toastOut .25s ease-in forwards}.toast-message{flex:1;min-width:0}.toast-close{width:26px;height:26px;border:none;background:none;color:var(--stone-300);border-radius:50%;cursor:pointer;font-size:1.25rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:color .2s ease;flex-shrink:0}.toast-close:hover{color:var(--rose-muted)}.health-banner{display:flex;align-items:center;gap:.75rem;background:#d4a0541f;border:1px solid rgba(212,160,84,.3);border-radius:10px;padding:.75rem 1rem;margin-bottom:1.5rem;font-size:.9rem;color:var(--text-primary);line-height:1.5}.health-banner-close{width:26px;height:26px;border:none;background:none;color:var(--stone-300);border-radius:50%;cursor:pointer;font-size:1.25rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:color .2s ease;flex-shrink:0}.health-banner-close:hover{color:var(--text-primary)}.disclaimer-banner{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;background:linear-gradient(135deg,#fff3cd,#ffeaa7);border-left:4px solid #ff9800;border-radius:8px;margin-bottom:2rem}.disclaimer-icon{font-size:1.5rem}.disclaimer-content{font-size:.9rem;color:#856404;line-height:1.5}.disclaimer-content strong{font-weight:600}@keyframes toastIn{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes toastOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(40px)}}@media(max-width:768px){body{padding:2rem 1rem 1.5rem}header h1{font-size:1.75rem}.subtitle{font-size:.9rem}.prediction-class{font-size:2rem}.confidence{font-size:1rem}.visualizations{grid-template-columns:1fr}.file-actions{flex-direction:column}.clear-btn{text-align:center}.batch-info{flex-direction:column;align-items:flex-start;gap:.5rem}.scan-card{flex-wrap:wrap}.scan-overlay{width:100%;height:auto;aspect-ratio:1}.scans-container{grid-template-columns:1fr}.export-section{flex-direction:column}.export-btn{width:100%;justify-content:center}.upload-area{padding:2.5rem 1.5rem}.toast-container{left:0;right:0;padding:.75rem}}