.demo-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .3s ease}.demo-modal{background:linear-gradient(135deg,#1a1a1a,#2d2d2d);border:1px solid rgba(255,138,101,.2);border-radius:20px;width:100%;max-width:900px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.5);animation:slideUp .4s ease}.demo-modal.mobile-optimized{max-width:100%;max-height:100vh;border-radius:0;height:100vh}.demo-header{background:linear-gradient(135deg,rgba(255,138,101,.1),rgba(255,183,77,.1));border-bottom:1px solid rgba(255,255,255,.1);padding:24px}.demo-title-section{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px}.demo-close-button{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:8px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.8);font-size:18px;cursor:pointer;transition:all .2s ease;flex-shrink:0}.demo-close-button:hover{background:rgba(255,255,255,.2);color:white}.demo-title-content{flex:1}.demo-title{font-size:1.8rem;font-weight:700;color:white;margin:0 0 8px;line-height:1.2}.demo-description{font-size:1rem;color:rgba(255,255,255,.8);margin:0;line-height:1.5}.step-controller{margin-top:8px}.step-progress{background:rgba(255,255,255,.1);border-radius:10px;height:6px;margin-bottom:20px;overflow:hidden}.step-progress-bar{background:linear-gradient(90deg,#FF8A65,#FFB74D);height:100%;border-radius:10px;transition:width .4s ease}.step-indicators{display:flex;gap:12px;overflow-x:auto;padding-bottom:4px}.step-indicator{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:80px;opacity:.6;transition:all .3s ease}.step-indicator.current{opacity:1}.step-indicator.completed{opacity:.8}.step-indicator.clickable{cursor:pointer}.step-indicator.clickable:hover{opacity:1}.step-indicator-content{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:rgba(255,255,255,.8);transition:all .3s ease}.step-indicator.current .step-indicator-content{background:linear-gradient(135deg,#FF8A65,#FFB74D);border-color:#FF8A65;color:white}.step-indicator.completed .step-indicator-content{background:#34D399;border-color:#34D399;color:white}.step-check{font-size:16px;line-height:1}.step-number{font-size:12px;line-height:1}.step-label{text-align:center}.step-label-text{display:block;font-size:.8rem;font-weight:500;color:rgba(255,255,255,.9);line-height:1.2;margin-bottom:2px}.step-duration{display:block;font-size:.7rem;color:rgba(255,255,255,.6)}.demo-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.step-header{display:flex;justify-content:space-between;align-items:flex-start;padding:24px 24px 0;gap:16px}.step-title-section{flex:1}.step-title{font-size:1.4rem;font-weight:600;color:white;margin:0 0 8px}.step-description{font-size:.95rem;color:rgba(255,255,255,.8);margin:0;line-height:1.5}.security-badge{display:flex;align-items:center;gap:6px;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);border-radius:8px;padding:8px 12px;white-space:nowrap}.security-icon{font-size:14px}.security-text{font-size:.8rem;font-weight:500;color:#34D399}.step-content{flex:1;padding:24px;overflow-y:auto;transition:opacity .3s ease,transform .3s ease}.step-content.transitioning{opacity:.7;transform:translateY(10px)}.demo-footer{background:rgba(0,0,0,.3);border-top:1px solid rgba(255,255,255,.1);padding:20px 24px}.demo-nav-buttons{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.demo-nav-right{display:flex;gap:12px;align-items:center}.demo-nav-button{padding:12px 20px;border-radius:8px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .2s ease;border:none;display:flex;align-items:center;gap:8px}.demo-nav-button:disabled{opacity:.5;cursor:not-allowed}.demo-nav-button.primary{background:linear-gradient(90deg,#FF8A65,#FFB74D);color:white}.demo-nav-button.primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px rgba(255,138,101,.3)}.demo-nav-button.primary.completion{background:linear-gradient(90deg,#34D399,#10B981)}.demo-nav-button.secondary{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:white}.demo-nav-button.secondary:hover:not(:disabled){background:rgba(255,255,255,.15);transform:translateY(-1px)}.demo-nav-button.tertiary{background:transparent;border:1px solid rgba(255,255,255,.3);color:rgba(255,255,255,.8)}.demo-nav-button.tertiary:hover:not(:disabled){background:rgba(255,255,255,.05);color:white}.demo-footer-info{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:rgba(255,255,255,.6);gap:16px}.time-estimate{font-weight:500}.security-notice{display:flex;align-items:center;gap:4px}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.demo-modal-overlay{padding:0;align-items:stretch}.demo-modal{max-width:100%;max-height:100%;height:100vh;border-radius:0}.demo-header{padding:20px}.demo-title{font-size:1.5rem}.step-indicators{gap:8px}.step-indicator{min-width:60px}.step-indicator-content{width:28px;height:28px}.step-label-text{font-size:.7rem}.step-duration{font-size:.6rem}.step-header{flex-direction:column;align-items:flex-start;padding:20px 20px 0}.step-content{padding:20px}.demo-footer{padding:16px 20px}.demo-nav-buttons{flex-direction:column;gap:12px}.demo-nav-right{width:100%;justify-content:center}.demo-nav-button{flex:1;justify-content:center}.demo-footer-info{flex-direction:column;text-align:center;gap:8px}}@media (max-width:480px){.demo-header{padding:16px}.demo-title{font-size:1.3rem}.demo-description{font-size:.9rem}.step-content{padding:16px}.demo-footer{padding:12px 16px}}.document-processing-demo{display:flex;flex-direction:column;gap:24px;height:100%}.demo-section-header{text-align:center;margin-bottom:8px}.demo-section-header h4{font-size:1.3rem;font-weight:600;color:white;margin:0 0 8px}.demo-section-header p{font-size:.95rem;color:rgba(255,255,255,.8);margin:0}.processing-status{background:linear-gradient(135deg,rgba(255,138,101,.1),rgba(255,183,77,.1));border:1px solid rgba(255,138,101,.3);border-radius:12px;padding:20px;animation:fadeIn .3s ease}.processing-indicator{display:flex;align-items:center;gap:16px;margin-bottom:16px}.processing-spinner{width:32px;height:32px;border:3px solid rgba(255,138,101,.3);border-top-color:#ff8a65;border-radius:50%;animation:spin 1s linear infinite}.processing-info{flex:1}.processing-title{font-size:1rem;font-weight:600;color:white;margin-bottom:4px}.processing-step{font-size:.9rem;color:rgba(255,255,255,.8)}.processing-progress{background:rgba(255,255,255,.1);border-radius:10px;height:6px;overflow:hidden}.processing-progress-bar{background:linear-gradient(90deg,#FF8A65,#FFB74D);height:100%;border-radius:10px;transition:width .3s ease}.documents-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.document-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px;transition:all .3s ease;position:relative;overflow:hidden;cursor:default}.document-card.completed{cursor:pointer}.document-card.completed:hover{background:rgba(255,255,255,.08);border-color:rgba(255,138,101,.3);transform:translateY(-2px)}.document-card.selected{border-color:#FF8A65;background:rgba(255,138,101,.1)}.document-card.pending{opacity:.7}.document-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.document-icon{font-size:1.8rem;line-height:1}.document-status-badge{font-size:.8rem;font-weight:500}.status-pending{color:#FFB74D}.status-processing{color:#FF8A65}.status-completed{color:#34D399}.document-info{position:relative;z-index:1}.document-name{font-size:1rem;font-weight:600;color:white;margin:0 0 8px;line-height:1.3}.document-meta{display:flex;gap:12px;margin-bottom:6px}.document-type{font-size:.8rem;color:#FF8A65;font-weight:500}.document-size{font-size:.8rem;color:rgba(255,255,255,.6)}.document-upload-time{font-size:.75rem;color:rgba(255,255,255,.5);margin-bottom:12px}.confidence-score{margin-top:12px}.confidence-label{font-size:.8rem;color:rgba(255,255,255,.7);margin-right:8px}.confidence-value{font-size:.9rem;font-weight:600;color:#34D399}.confidence-bar{background:rgba(255,255,255,.1);border-radius:10px;height:4px;margin-top:6px;overflow:hidden}.confidence-fill{background:linear-gradient(90deg,#34D399,#10B981);height:100%;border-radius:10px;transition:width .5s ease}.processing-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255,138,101,.1);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(2px)}.processing-animation{position:relative;width:100%;height:100%}.scan-line{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#FF8A65 50%,transparent);animation:scanLine 2s ease-in-out infinite}.extracted-data-viewer{background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:20px;animation:fadeIn .3s ease}.viewer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.1)}.viewer-header h5{font-size:1.1rem;font-weight:600;color:white;margin:0}.confidence-display{font-size:.9rem;color:rgba(255,255,255,.8)}.confidence-score-large{font-size:1.1rem;font-weight:600;color:#34D399}.extracted-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.extracted-field{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:12px}.field-label{font-size:.8rem;font-weight:500;color:rgba(255,255,255,.7);margin-bottom:4px;text-transform:capitalize}.field-value{font-size:1rem;font-weight:600;color:white;margin-bottom:4px}.field-confidence{font-size:.75rem;color:#34D399}.results-summary{background:linear-gradient(135deg,rgba(52,211,153,.1),rgba(16,185,129,.1));border:1px solid rgba(52,211,153,.3);border-radius:12px;padding:24px;text-align:center;animation:fadeIn .5s ease}.summary-header h5{font-size:1.3rem;font-weight:600;color:white;margin:0 0 8px}.summary-header p{font-size:.95rem;color:rgba(255,255,255,.8);margin:0 0 24px}.summary-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:20px;margin-bottom:24px}.stat-item{text-align:center}.stat-number{display:block;font-size:1.8rem;font-weight:700;color:#34D399;margin-bottom:4px}.stat-label{display:block;font-size:.8rem;color:rgba(255,255,255,.7)}.next-step-prompt p{font-size:1rem;color:rgba(255,255,255,.9);margin:0 0 16px}.proceed-button{background:linear-gradient(90deg,#34D399,#10B981);border:none;border-radius:10px;padding:14px 28px;color:white;font-weight:600;font-size:1rem;cursor:pointer;transition:transform .2s ease;display:inline-flex;align-items:center;gap:8px}.proceed-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(52,211,153,.3)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes scanLine{0%{transform:translateY(0)}50%{transform:translateY(200px)}to{transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.documents-grid,.extracted-fields{grid-template-columns:1fr;gap:12px}.summary-stats{grid-template-columns:repeat(2,1fr);gap:16px}.viewer-header{flex-direction:column;align-items:flex-start;gap:8px}}@media (max-width:480px){.document-processing-demo{gap:20px}.document-card{padding:12px}.extracted-data-viewer{padding:16px}.results-summary{padding:20px}.summary-stats{grid-template-columns:1fr;gap:12px}}