.order-code{font-variant-numeric:tabular-nums;letter-spacing:.12em}
.order-photo-card{margin-top:24px;padding:24px}
.order-photo-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}
.order-photo-heading h2{margin:0 0 5px}
.order-photo-heading p{margin:0;color:#657184;font-size:.93rem;line-height:1.55}
.order-photo-heading>span{flex:0 0 auto;padding:6px 10px;border-radius:999px;background:#eef5ff;color:#1769d2;font-size:.75rem;font-weight:700}
.order-photo-layout{display:block}
.order-photo-layout.has-photo{display:grid;grid-template-columns:minmax(210px,300px) minmax(0,1fr);gap:24px;align-items:stretch}
.order-photo-preview{position:relative;display:block;overflow:hidden;min-height:220px;border:1px solid #dce4ee;border-radius:16px;background:#f5f7fa;aspect-ratio:4/3}
.order-photo-preview img{width:100%;height:100%;object-fit:cover}
.order-photo-preview>span{position:absolute;right:10px;bottom:10px;padding:7px 10px;border-radius:9px;background:rgba(15,23,42,.78);color:#fff;font-size:.75rem;font-weight:700}
.order-photo-upload{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:12px;min-width:0;margin:0}
.order-photo-picker{position:relative;display:flex;min-height:170px;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:24px;border:1.5px dashed #aebdd0;border-radius:16px;background:#f8fafc;text-align:center;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s}
.order-photo-picker:hover,.order-photo-picker:focus-within{border-color:#1769d2;background:#f2f7ff;box-shadow:0 0 0 3px rgba(23,105,210,.08)}
.order-photo-picker input[type=file]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.order-photo-icon{display:grid;width:42px;height:42px;place-items:center;margin-bottom:3px;border-radius:12px;background:#e8f1ff;color:#1769d2;font-size:1.5rem;line-height:1}
.order-photo-picker strong{color:#152238;font-size:1rem}
.order-photo-picker small{color:#718096;font-size:.82rem}
.order-photo-submit{align-self:flex-start;min-width:160px}
@media(max-width:700px){.order-photo-card{padding:18px}.order-photo-heading{display:block}.order-photo-heading>span{display:inline-block;margin-top:10px}.order-photo-layout.has-photo{grid-template-columns:1fr}.order-photo-preview{min-height:0}.order-photo-picker{min-height:150px}.order-photo-submit{width:100%}}