*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#1a1a1a;background:#f7f7f8;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}.app{min-height:100vh}.container{max-width:640px;margin:0 auto;padding:2rem 1rem}.container-wide{max-width:960px;margin:0 auto;padding:2rem 1rem}.form-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;padding:1rem 0;display:flex}.form-header-cancel{color:#1a1a1a;cursor:pointer;background:0 0;border:none;align-items:center;gap:.25rem;font-size:.875rem;display:flex}.form-header-step{color:#6b7280;font-size:.875rem}.step-progress{justify-content:center;align-items:center;gap:0;margin-bottom:2rem;display:flex}.step-item{align-items:center;gap:0;display:flex}.step-icon{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:.75rem;display:flex}.step-icon-pending{color:#9ca3af;background:#e5e7eb}.step-icon-active{color:#fff;background:#1a1a1a}.step-icon-complete{color:#fff;background:#16a34a}.step-label{color:#6b7280;white-space:nowrap;margin-left:.375rem;font-size:.8rem}.step-label-active{color:#1a1a1a;font-weight:600}.step-connector{background:#d1d5db;width:40px;height:1px;margin:0 .25rem}.card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;margin-bottom:1rem;padding:2rem}.card h2{color:#1a1a1a;margin-bottom:1.5rem;font-size:1.5rem;font-weight:600}.card h3{color:#6b7280;margin-top:1.5rem;margin-bottom:.75rem;font-size:.875rem;font-weight:600}.form-row{gap:1.5rem;margin-bottom:1.25rem;display:grid}.form-row-2{grid-template-columns:1fr 1fr}.form-row-3{grid-template-columns:1fr 1fr 1fr}.field{position:relative}.field label{color:#6b7280;margin-bottom:.25rem;font-size:.8rem;display:block}.field input,.field select,.field textarea{color:#1a1a1a;background:0 0;border:none;border-bottom:1px solid #d1d5db;outline:none;width:100%;padding:.5rem 0;font-size:1rem;transition:border-color .2s}.field input:focus,.field select:focus,.field textarea:focus{border-bottom-color:#1a1a1a}.field input::placeholder,.field textarea::placeholder{color:#9ca3af}.field select{cursor:pointer;appearance:none}.field textarea{resize:vertical;min-height:60px}.toggle-group{gap:.5rem;display:flex}.toggle-btn{cursor:pointer;color:#374151;background:#fff;border:1px solid #d1d5db;border-radius:20px;padding:.375rem 1.25rem;font-size:.875rem;transition:all .15s}.toggle-btn:hover{border-color:#9ca3af}.toggle-btn.active{color:#fff;background:#2563eb;border-color:#2563eb}.chip-group{flex-wrap:wrap;gap:.5rem;margin-top:.5rem;display:flex}.chip{cursor:pointer;color:#374151;-webkit-user-select:none;user-select:none;background:#fff;border:1px solid #d1d5db;border-radius:20px;padding:.375rem .875rem;font-size:.8rem;transition:all .15s}.chip:hover{border-color:#9ca3af}.chip.selected{color:#fff;background:#1a1a1a;border-color:#1a1a1a}.form-nav{justify-content:space-between;align-items:center;margin-top:1.5rem;display:flex}.btn-back{color:#1a1a1a;cursor:pointer;background:0 0;border:none;align-items:center;gap:.25rem;padding:.5rem 0;font-size:.875rem;display:flex}.btn-back:hover{color:#4b5563}.btn-continue{color:#fff;cursor:pointer;background:#1a1a1a;border:1px solid #1a1a1a;border-radius:8px;align-items:center;gap:.375rem;padding:.625rem 1.5rem;font-size:.875rem;font-weight:500;transition:all .15s;display:flex}.btn-continue:hover{background:#374151}.btn-continue:disabled{opacity:.4;cursor:not-allowed}.btn-submit{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:8px;align-items:center;gap:.375rem;padding:.625rem 1.5rem;font-size:.875rem;font-weight:500;display:flex}.btn-submit:hover{background:#1d4ed8}.btn-submit:disabled{opacity:.5;cursor:not-allowed}.btn-scan{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:8px;justify-content:center;align-items:center;gap:.5rem;width:100%;margin-bottom:1.5rem;padding:.75rem;font-size:1rem;font-weight:500;display:flex}.btn-scan:hover{background:#1d4ed8}.vin-helper{text-align:center;background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;margin-bottom:1rem;padding:1.25rem}.vin-helper p{color:#6b7280;margin-top:.5rem;font-size:.8rem}.vin-helper-title{margin-bottom:.75rem;font-size:.875rem;font-weight:500}.toggle-row{justify-content:space-between;align-items:center;margin-bottom:1.25rem;display:flex}.toggle-row-label{font-size:.95rem;font-weight:500}.section-label{color:#374151;margin-top:1.5rem;margin-bottom:.75rem;font-size:.875rem;font-weight:600}.odometer-row{align-items:flex-end;gap:1rem;display:flex}.odometer-input{flex:1}.unit-toggle{border:1px solid #d1d5db;border-radius:8px;margin-bottom:.25rem;display:flex;overflow:hidden}.unit-toggle button{cursor:pointer;background:#fff;border:none;padding:.375rem .75rem;font-size:.8rem}.unit-toggle button.active{color:#fff;background:#1a1a1a}.mats-grid{grid-template-columns:auto repeat(4,1fr) auto;align-items:center;gap:.5rem;margin-top:.5rem;display:grid}.mats-header{color:#6b7280;text-align:center;font-size:.75rem}.mats-label{color:#374151;font-size:.8rem}.mat-check{justify-content:center;display:flex}.mat-check input[type=checkbox]{cursor:pointer;accent-color:#16a34a;width:18px;height:18px}.car-diagram-container{max-width:400px;margin:1rem auto;position:relative}.car-diagram{width:100%;height:auto}.diagram-photo-slot{cursor:pointer;background:#fff;border:2px dashed #d1d5db;border-radius:8px;justify-content:center;align-items:center;width:48px;height:48px;transition:border-color .15s;display:flex;position:absolute;overflow:hidden}.diagram-photo-slot:hover{border-color:#2563eb}.diagram-photo-slot.has-photo{border-style:solid;border-color:#16a34a}.diagram-photo-slot img{object-fit:cover;width:100%;height:100%}.diagram-photo-slot svg{color:#9ca3af}.damage-tabs{flex-wrap:wrap;gap:.375rem;margin-bottom:1rem;display:flex}.damage-tab{cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:6px;padding:.375rem .75rem;font-size:.8rem;transition:all .15s}.damage-tab:hover{border-color:#9ca3af}.damage-tab.active{color:#fff;background:#dc2626;border-color:#dc2626}.view-toggle{border:1px solid #d1d5db;border-radius:20px;width:fit-content;margin-bottom:1rem;display:flex;overflow:hidden}.view-toggle button{cursor:pointer;background:#fff;border:none;padding:.375rem 1rem;font-size:.8rem}.view-toggle button.active{color:#fff;background:#16a34a}.damage-item-row{align-items:flex-end;gap:.75rem;margin-top:.75rem;display:flex}.damage-item-row .field{flex:1}.btn-add-item{cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;margin-bottom:.25rem;font-size:1.25rem;display:flex}.btn-add-item:hover{background:#f3f4f6}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.75rem;margin-top:.75rem;display:grid}.photo-thumb{aspect-ratio:1;border-radius:8px;position:relative;overflow:hidden}.photo-thumb img{object-fit:cover;width:100%;height:100%}.photo-thumb button{color:#fff;cursor:pointer;background:#0009;border:none;border-radius:50%;width:22px;height:22px;font-size:.7rem;line-height:1;position:absolute;top:4px;right:4px}.upload-zone{text-align:center;cursor:pointer;color:#6b7280;border:2px dashed #d1d5db;border-radius:8px;padding:1.5rem;font-size:.9rem;transition:border-color .15s}.upload-zone:hover{border-color:#2563eb}.btn{cursor:pointer;border:none;border-radius:8px;padding:.625rem 1.25rem;font-size:1rem;font-weight:600;transition:background-color .15s;display:inline-block}.btn-primary{color:#fff;background:#2563eb}.btn-primary:hover{background:#1d4ed8}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{color:#374151;background:#e5e7eb}.btn-secondary:hover{background:#d1d5db}.choice-list{flex-direction:column;gap:.75rem;display:flex}.choice-btn{text-align:left;cursor:pointer;background:#fff;border:1px solid #e5e7eb;border-radius:8px;width:100%;padding:1rem;transition:border-color .15s;display:block}.choice-btn:hover{border-color:#2563eb}.choice-btn strong{margin-bottom:.25rem;display:block}.choice-btn span{color:#6b7280;font-size:.875rem}.badge{border-radius:9999px;padding:.125rem .5rem;font-size:.75rem;font-weight:600;display:inline-block}.badge-complete{color:#065f46;background:#d1fae5}.badge-partial{color:#92400e;background:#fef3c7}.error{color:#dc2626;margin-top:.25rem;font-size:.875rem}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid #e5e7eb;padding:.75rem}th{text-transform:uppercase;letter-spacing:.05em;color:#6b7280;font-size:.75rem;font-weight:600}tbody tr:hover{background:#f9fafb}a{color:#2563eb;text-decoration:none}a:hover{text-decoration:underline}h1{color:#1a1a1a;margin-bottom:1.5rem;font-size:1.5rem}@media (width<=480px){.form-row-2,.form-row-3{grid-template-columns:1fr}.step-label{display:none}.step-connector{width:20px}}
