.canvas-head-actions { display:flex; align-items:center; gap:8px; }
#uploadPhotosBtn { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
#uploadPhotosBtn[hidden] { display:none; }
#uploadPhotosBtn img { width:16px; height:16px; }
.photo-dialog { box-sizing:border-box; width:min(660px,calc(100vw - 24px)); max-height:calc(100dvh - 32px); padding:0; border:1px solid #b8cbed; border-radius:6px; color:#172033; background:white; overflow:auto; }
.photo-dialog::backdrop { background:rgb(15 23 42 / 45%); }
.photo-dialog header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px; border-bottom:1px solid #d6e2f5; position:sticky; top:0; background:white; z-index:1; }
.photo-dialog h2 { font-size:18px; margin:0; }
.photo-dialog main { padding:16px; }
.photo-dialog input[type=file] { width:100%; box-sizing:border-box; font-size:14px; }
.photo-dialog .photo-status { margin:12px 0; font-size:14px; overflow-wrap:anywhere; }
.photo-dialog .photo-status[data-error=true] { color:#b42318; }
.photo-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.photo-item { min-width:0; border:1px solid #d6e2f5; padding:8px; border-radius:4px; }
.photo-item img { display:block; width:100%; height:116px; object-fit:contain; background:#f4f7fb; }
.photo-item span { display:block; overflow-wrap:anywhere; font-size:13px; margin:8px 0; }
.photo-item button { width:100%; }
.photo-dialog footer { padding:12px 16px; border-top:1px solid #d6e2f5; text-align:right; }
@media(max-width:760px) { .canvas-head:has(#uploadPhotosBtn:not([hidden])) { grid-template-columns:minmax(0,1fr) auto; } .canvas-head:has(#uploadPhotosBtn:not([hidden])) .canvas-result-tabs-host { grid-column:1 / -1; grid-row:2; min-width:0; } }