body { background: #f5f6f8; }
.photo-thumb { width: 100%; height: 150px; object-fit: cover; background: #fff; }
.timeline-item { border-left: 3px solid #dee2e6; padding-left: 1rem; margin-bottom: 1.25rem; }
.timeline-item.defect { border-left-color: #dc3545; }
.login-box { max-width: 380px; }
.table td, .table th { vertical-align: middle; }
.text-pre { white-space: pre-line; }
.timeline-item.stk { border-left-color: #0d6efd; }
.eq-list { counter-reset: eq; }
.eq-item { counter-increment: eq; }
.eq-num::after { content: counter(eq); }
.pin-input { letter-spacing: .6em; font-size: 2rem; }
.photo-tile { display: flex; align-items: center; justify-content: center; position: relative; width: 100%; aspect-ratio: 4 / 3;
    border: 2px dashed #adb5bd; border-radius: .5rem; background: #fff; cursor: pointer; overflow: hidden; text-align: center; }
.photo-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.photo-tile-text { position: relative; font-weight: 600; padding: .25rem .5rem; border-radius: .25rem; }
.photo-tile.done { border: 3px solid #198754; }
.photo-tile.done .photo-tile-text { background: rgba(25, 135, 84, .9); color: #fff; align-self: flex-end; margin-bottom: .5rem; }
.photo-tile-input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pin-small { width: 7em; }
.photo-side { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: #fff; }