.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;font-size:16px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;box-shadow:0 2px 8px #0000001a;position:relative;overflow:hidden}.btn:hover:not(.btn-disabled){transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.btn:active:not(.btn-disabled){transform:translateY(0);box-shadow:0 2px 6px #0000001a}.btn-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-small{padding:8px 16px;font-size:14px}.btn-medium{padding:12px 24px;font-size:16px}.btn-large{padding:16px 32px;font-size:18px}.btn-full-width{width:100%}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover:not(.btn-disabled){background:linear-gradient(135deg,#5568d3,#653a8a)}.btn-secondary{background:linear-gradient(135deg,#4a5568,#2d3748);color:#fff}.btn-secondary:hover:not(.btn-disabled){background:linear-gradient(135deg,#3a4556,#1a202c)}.btn-success{background:linear-gradient(135deg,#48bb78,#38a169);color:#fff}.btn-success:hover:not(.btn-disabled){background:linear-gradient(135deg,#38a169,#2f855a)}.btn-danger{background:linear-gradient(135deg,#f56565,#e53e3e);color:#fff}.btn-danger:hover:not(.btn-disabled){background:linear-gradient(135deg,#e53e3e,#c53030)}.btn-warning{background:linear-gradient(135deg,#ed8936,#dd6b20);color:#fff}.btn-warning:hover:not(.btn-disabled){background:linear-gradient(135deg,#dd6b20,#c05621)}.btn-outline{background:#fff;color:#667eea;border:2px solid #667eea;box-shadow:0 2px 8px #667eea33}.btn-outline:hover:not(.btn-disabled){background:#667eea;color:#fff}.btn-icon{display:inline-flex;align-items:center;font-size:1.2em}.btn-text{display:inline-flex;align-items:center}.btn-icon svg,.btn-icon i{width:1em;height:1em}.btn:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff80;transform:translate(-50%,-50%);transition:width .6s,height .6s}.btn:active:not(.btn-disabled):after{width:300px;height:300px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-container{animation:slideUp .3s ease;max-width:90%;max-height:90vh;overflow:auto}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-content{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;min-width:400px;max-width:600px}.modal-header{display:flex;align-items:center;padding:24px 28px 16px;border-bottom:1px solid #e0e0e0;position:relative}.modal-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;margin-right:16px;flex-shrink:0}.modal-icon.info{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.modal-icon.success{background:linear-gradient(135deg,#10b981,#059669);color:#fff;animation:successPop .4s ease}@keyframes successPop{0%{transform:scale(0)}50%{transform:scale(1.1)}to{transform:scale(1)}}.modal-icon.warning{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff}.modal-icon.error{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.modal-icon.confirm{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}.modal-title{flex:1;margin:0;font-size:20px;font-weight:600;color:#1f2937}.modal-close{position:absolute;top:16px;right:16px;background:none;border:none;font-size:32px;color:#9ca3af;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s ease;line-height:1}.modal-close:hover{background:#f3f4f6;color:#1f2937}.modal-body{padding:24px 28px;color:#4b5563;font-size:15px;line-height:1.6}.modal-body p{margin:0 0 12px}.modal-body p:last-child{margin-bottom:0}.modal-body ul{margin:8px 0;padding-left:20px}.modal-body li{margin:6px 0}.modal-body strong{color:#1f2937;font-weight:600}.modal-footer{padding:16px 28px 24px;display:flex;justify-content:flex-end;gap:12px;border-top:1px solid #e0e0e0}.modal-button{padding:10px 24px;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease;border:none;min-width:100px}.modal-button.cancel{background:#fff;color:#6b7280;border:2px solid #d1d5db}.modal-button.cancel:hover{background:#f9fafb;border-color:#9ca3af;color:#374151}.modal-button.confirm{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 2px 8px #667eea4d}.modal-button.confirm:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-1px)}.modal-button.confirm:active{transform:translateY(0)}.modal-content.success .modal-button.confirm{background:linear-gradient(135deg,#10b981,#059669);box-shadow:0 2px 8px #10b9814d}.modal-content.success .modal-button.confirm:hover{box-shadow:0 4px 12px #10b98166}.modal-content.error .modal-button.confirm{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 2px 8px #ef44444d}.modal-content.error .modal-button.confirm:hover{box-shadow:0 4px 12px #ef444466}@media (max-width: 640px){.modal-content{min-width:unset;width:90vw}.modal-header{padding:20px 20px 12px}.modal-body{padding:20px;font-size:14px}.modal-footer{padding:12px 20px 20px;flex-direction:column-reverse}.modal-button{width:100%}.modal-icon{width:40px;height:40px;font-size:20px;margin-right:12px}.modal-title{font-size:18px}}.progress-stepper{background:#fff;padding:30px 20px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.stepper-container{display:flex;justify-content:space-between;align-items:flex-start;position:relative;margin-bottom:20px}.step-item{display:flex;flex-direction:column;align-items:center;flex:1;position:relative;z-index:2}.step-circle{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;transition:all .3s ease;margin-bottom:12px;box-shadow:0 2px 4px #0000001a}.step-item.upcoming .step-circle{background:#e0e0e0;color:#999;border:3px solid #e0e0e0}.step-item.current .step-circle{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:3px solid #667eea;box-shadow:0 4px 12px #667eea66;animation:pulse 2s infinite}@keyframes pulse{0%,to{box-shadow:0 4px 12px #667eea66}50%{box-shadow:0 4px 20px #667eea99}}.step-item.completed .step-circle{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;border:3px solid #4CAF50}.checkmark{font-size:24px;animation:checkmarkPop .3s ease}@keyframes checkmarkPop{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}.step-number{font-size:20px}.step-label{text-align:center;margin-top:8px}.step-icon{font-size:24px;margin-bottom:6px}.step-text{font-size:13px;font-weight:600;color:#333;max-width:100px;line-height:1.3}.step-item.upcoming .step-text{color:#999}.step-item.current .step-text{color:#667eea;font-weight:700}.step-item.completed .step-text{color:#4caf50}.step-connector{flex:1;display:flex;align-items:center;position:relative;margin:0 10px;padding-top:25px}.connector-line{width:100%;height:4px;background:#e0e0e0;position:relative;transition:all .3s ease}.step-connector.completed .connector-line{background:linear-gradient(to right,#4caf50,#45a049)}.progress-bar-container{width:100%;height:8px;background:#e0e0e0;border-radius:4px;overflow:hidden;margin-top:10px}.progress-bar-fill{height:100%;background:linear-gradient(to right,#4caf50,#667eea,#764ba2);transition:width .5s ease;border-radius:4px}@media (max-width: 768px){.progress-stepper{padding:20px 15px}.step-circle{width:40px;height:40px;font-size:16px}.step-icon{font-size:20px}.step-text{font-size:11px;max-width:80px}.step-connector{margin:0 5px}}@media (max-width: 480px){.stepper-container{flex-wrap:wrap}.step-item{flex-basis:50%;margin-bottom:20px}.step-connector{display:none}}.feedback-button{position:fixed;bottom:30px;right:30px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:50px;padding:14px 24px;font-size:16px;font-weight:600;cursor:pointer;box-shadow:0 4px 12px #667eea66;transition:all .3s ease;z-index:1000;display:flex;align-items:center;gap:8px}.feedback-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #667eea80}.feedback-button.open{background:#e53e3e;border-radius:50%;width:50px;height:50px;padding:0;justify-content:center}.feedback-button.submitted{background:#48bb78;cursor:default}.feedback-success{display:flex;align-items:center;gap:8px}.feedback-modal{position:fixed;bottom:100px;right:30px;width:400px;max-width:90vw;background:#fff;border-radius:12px;box-shadow:0 10px 30px #0003;z-index:999;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.feedback-form-container{padding:24px}.feedback-form-container h3{margin:0 0 8px;color:#2d3748;font-size:20px}.feedback-subtitle{margin:0 0 20px;color:#718096;font-size:14px}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:6px;color:#4a5568;font-size:14px;font-weight:500}.form-group select,.form-group input[type=email],.form-group textarea{width:100%;padding:10px 12px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px;transition:border-color .2s;font-family:inherit}.form-group select:focus,.form-group input[type=email]:focus,.form-group textarea:focus{outline:none;border-color:#667eea}.form-group textarea{resize:vertical;min-height:80px}.rating-slider{display:flex;align-items:center;gap:12px}.rating-slider input[type=range]{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e2e8f0;border-radius:3px;outline:none}.rating-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;background:#667eea;border-radius:50%;cursor:pointer}.rating-slider input[type=range]::-moz-range-thumb{width:20px;height:20px;background:#667eea;border-radius:50%;cursor:pointer;border:none}.rating-value{min-width:50px;font-weight:600;color:#667eea;font-size:16px}.form-actions{display:flex;gap:10px;margin-top:20px}.btn-cancel,.btn-submit{flex:1;padding:10px 16px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.btn-cancel{background:#e2e8f0;color:#4a5568}.btn-cancel:hover{background:#cbd5e0}.btn-submit{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-submit:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 8px #667eea4d}.btn-submit:disabled{opacity:.6;cursor:not-allowed}.feedback-footer{margin-top:16px;font-size:12px;color:#a0aec0;text-align:center}@media (max-width: 480px){.feedback-modal{bottom:90px;right:20px;left:20px;width:auto}.feedback-button{bottom:20px;right:20px}}*{margin:0;padding:0;box-sizing:border-box}body{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;background-color:#f5f5f5}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.container{max-width:1400px;margin:0 auto;padding:20px}.header{background-color:#2c3e50;color:#fff;padding:20px;margin-bottom:30px;box-shadow:0 2px 4px #0000001a}.header h1{font-size:2rem;margin-bottom:5px}.header p{font-size:.9rem;opacity:.9}.card{background:#fff;border-radius:8px;padding:20px;margin-bottom:20px;box-shadow:0 2px 8px #0000001a}.button{background-color:#3498db;color:#fff;border:none;padding:10px 20px;border-radius:4px;cursor:pointer;font-size:1rem;transition:background-color .3s}.button:hover{background-color:#2980b9}.button:disabled{background-color:#95a5a6;cursor:not-allowed}.button-secondary{background-color:#95a5a6}.button-secondary:hover{background-color:#7f8c8d}.button-danger{background-color:#e74c3c}.button-danger:hover{background-color:#c0392b}.input-group{margin-bottom:20px}.input-group label{display:block;margin-bottom:8px;font-weight:600;color:#2c3e50;font-size:1rem}.input-group input,.input-group select{width:100%;padding:16px 20px;border:2px solid #e0e0e0;border-radius:10px;font-size:1.1rem;transition:all .3s ease;background:#fff;box-shadow:0 2px 8px #00000014;font-weight:500;min-height:56px}.input-group input:focus,.input-group select:focus{outline:none;border-color:#667eea;box-shadow:0 4px 12px #667eea26,0 0 0 3px #667eea1a;transform:translateY(-1px)}.input-group input:hover,.input-group select:hover{border-color:#aaa;box-shadow:0 4px 10px #0000001a}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.alert{padding:12px;border-radius:4px;margin-bottom:15px}.alert-info{background-color:#d1ecf1;color:#0c5460;border:1px solid #bee5eb}.alert-success{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}.alert-error{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb}canvas{border:2px solid #ddd;cursor:crosshair;display:block}.calibration-tool{max-width:1400px;margin:0 auto}.calibration-header{text-align:center;margin-bottom:2rem}.calibration-content{display:grid;grid-template-columns:2fr 1fr;gap:2rem;align-items:start}.canvas-container canvas{max-width:100%;height:auto;border-radius:8px}.calibration-controls{display:flex;flex-direction:column;gap:1.5rem}.control-group{display:flex;flex-direction:column;gap:.5rem}.control-group input{padding:16px 20px;border:2px solid #e0e0e0;border-radius:10px;font-size:1.1rem;min-height:56px;transition:all .3s ease;background-color:#fff;box-shadow:0 2px 8px #00000014}.control-group input:hover{border-color:silver;box-shadow:0 4px 12px #0000001f}.control-group input:focus{outline:none;border-color:#667eea;box-shadow:0 4px 12px #667eea26;transform:translateY(-1px)}.calibration-result{background:#f9f9f9;padding:1rem;border-radius:8px}.result-item{display:flex;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid #ddd}.result-item.highlight{background:#3498db;color:#fff;padding:.75rem;margin:.5rem -1rem;border-radius:6px;font-weight:700}.calibration-tips{margin-top:2rem;background:#e8f4f8;padding:1.5rem;border-radius:8px;border-left:4px solid #3498db}.tracing-canvas-container{max-width:1600px;margin:0 auto}.tracing-header{text-align:center;margin-bottom:2rem}.tracing-content{display:grid;grid-template-columns:2fr 1fr;gap:2rem;align-items:start}.canvas-wrapper{background:#fff;padding:1rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.canvas-controls{display:flex;gap:.75rem;margin-top:1rem;flex-wrap:wrap}.pieces-sidebar{display:flex;flex-direction:column;gap:1rem}.pieces-summary{background:#fff;padding:1.5rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.summary-totals{display:flex;flex-direction:column;gap:.75rem}.total-item{display:flex;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid #eee}.total-item.highlight{background:#3498db;color:#fff;padding:.75rem;margin:.5rem -1.5rem;border-radius:6px;font-weight:700;font-size:1.1rem}.pieces-list{max-height:500px;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem}.piece-item{background:#fff;padding:1rem;border-radius:8px;box-shadow:0 2px 8px #0000001a;transition:all .2s ease;cursor:pointer}.piece-item.hovered{box-shadow:0 4px 16px #3498db4d;transform:translateY(-2px);border:2px solid #3498db}.piece-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:2px solid #eee}.piece-number{font-weight:700;color:#3498db;font-size:1.1rem}.btn-delete{background:#e74c3c;color:#fff;border:none;width:2rem;height:2rem;border-radius:50%;cursor:pointer;font-size:1.5rem;line-height:1}.btn-delete:hover{background:#c0392b}.piece-details{display:flex;flex-direction:column;gap:.5rem;font-size:.9rem}.detail-row{display:flex;justify-content:space-between}.detail-row.total{margin-top:.5rem;padding-top:.5rem;border-top:2px solid #eee;font-weight:700;color:#3498db}.save-actions{background:#fff;padding:1rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.btn-large{width:100%;padding:1rem 2rem;font-size:1.1rem;font-weight:700}.btn-warning{background:#f39c12;color:#fff}.btn-warning:hover{background:#e67e22}.tracing-info{margin-top:2rem;background:#fff3cd;padding:1.5rem;border-radius:8px;border-left:4px solid #f39c12}.quote-generator{max-width:1400px;margin:0 auto}.quote-header{text-align:center;margin-bottom:2rem}.quote-content{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}.quote-inputs,.quote-preview{display:flex;flex-direction:column;gap:1.5rem}.labor-inputs{display:flex;flex-direction:column;gap:1rem}.labor-input-row{display:grid;grid-template-columns:1fr 100px 40px;gap:1rem;align-items:center}.labor-input-row label{display:flex;align-items:center;gap:.5rem;font-weight:500}.labor-input-row .icon{font-size:1.2rem}.labor-input-row input{padding:.5rem;border:2px solid #ddd;border-radius:4px;text-align:right;font-size:1rem}.labor-input-row input:focus{outline:none;border-color:#3498db}.labor-input-row .unit{color:#666;font-size:.9rem}.labor-summary{display:flex;justify-content:space-between;padding:1rem;margin-top:.5rem;background:#e8f4f8;border-radius:6px;font-size:1.1rem}.labor-summary .value{color:#3498db;font-weight:700}.pricing-input{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}.pricing-input label{font-weight:600;color:#333}.pricing-input input{padding:.75rem;border:2px solid #ddd;border-radius:6px;font-size:1rem}.pricing-input input:focus{outline:none;border-color:#3498db}.pricing-input small{color:#666;font-size:.85rem}.quote-card{background:#fff;padding:1.5rem;border-radius:12px;box-shadow:0 4px 12px #0000001a}.quote-card h3{margin-top:0;margin-bottom:1.5rem;color:#2c3e50;border-bottom:3px solid #3498db;padding-bottom:.5rem}.quote-section{margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid #eee}.quote-section:last-child{border-bottom:none}.quote-section h4{margin:0 0 .75rem;color:#555;font-size:.95rem;text-transform:uppercase;letter-spacing:.5px}.quote-line{display:flex;justify-content:space-between;padding:.5rem 0;font-size:.95rem}.quote-line.subtotal{font-weight:600;padding-top:.75rem;margin-top:.5rem;border-top:2px solid #eee;font-size:1rem}.quote-line.total{font-size:1.5rem;font-weight:700;color:#27ae60;padding:1rem 0;margin-top:1rem;border-top:3px solid #27ae60}.quote-actions{display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem}.success-card{background:#d4edda;border:2px solid #28a745;padding:1.5rem;border-radius:8px}.success-card h4{margin-top:0;color:#155724}.success-card p{margin:.5rem 0;color:#155724}.quote-tips{margin-top:2rem;background:#e8f4f8;padding:1.5rem;border-radius:8px;border-left:4px solid #3498db}.quote-tips h4{margin-top:0;color:#2c3e50}.quote-tips ul{margin:0;padding-left:1.5rem;line-height:1.8}.quote-tips li{margin:.5rem 0}.quote-tips strong{color:#2c3e50}@media print{.quote-actions,.quote-tips,.quote-inputs{display:none}.quote-content{grid-template-columns:1fr}}.pieces-list{max-height:400px;overflow-y:auto}.piece-item{padding:10px;border:1px solid #e0e0e0;border-radius:4px;margin-bottom:10px;background-color:#f9f9f9}.piece-item:hover{background-color:#f0f0f0}.piece-item h4{margin-bottom:5px;color:#2c3e50}.piece-item p{font-size:.9rem;color:#666;margin:3px 0}.loading{text-align:center;padding:40px;color:#666}.two-column{display:grid;grid-template-columns:2fr 1fr;gap:20px}@media (max-width: 768px){.two-column{grid-template-columns:1fr}}