/* Styles for the photo viewer (views/photo.js).
   Loaded after /app/app.css on every /app/ page. Only the builder of that view edits this file, so
   parallel work never touches the same file. Use the shared classes in app.css first (see the
   class list at its top and CONTRACTS.md §10); put only this screen's own additions here, and
   start every selector with the view's root class (for example .view-photo) so nothing leaks into
   other screens. Tokens (colors, fonts) come from /shared/tokens.css. */

.view-photo .photo-stage{display:grid;gap:12px;min-width:0}
.view-photo .photo-status{display:grid;gap:12px}
/* A photo row with no picture: dashed, like the week's 'Photo didn't finish uploading' tile. */
.view-photo .photo-missing{display:flex;gap:10px;align-items:flex-start;padding:16px;border:1.5px dashed var(--line);border-radius:14px;font-weight:600}
.view-photo .photo-missing .icon{color:var(--pen);margin-top:2px}
.view-photo .photo-meta{color:var(--muted);font-size:.95rem}