/* The public /share/:token surface. Structural styles for the dedicated
   share views; layout, badges, plan/room-rect, photo-stage and filmstrip
   vocabulary is shared from base.css/components.css/floor_plan.css/
   workspace.css (same class names, no app partials rendered). */

.share-bar { display: flex; align-items: baseline; gap: var(--space-3);
  padding: var(--space-4) var(--space-8); background: var(--color-surface);
  border-bottom: 1px solid var(--color-border); }
.share-bar__brand { font-family: var(--font-display); font-size: var(--text-base); font-weight: 700;
  letter-spacing: var(--tracking-caps); text-transform: uppercase; }
.share-bar__label { font-family: var(--font-body); font-size: var(--text-sm); color: var(--color-text-muted); }

.share-hub { max-width: 960px; margin: 0 auto; }

.share-workspace { max-width: 720px; margin: 0 auto; }
.share-workspace__floor { display: inline-block; margin-bottom: var(--space-2); text-decoration: none; }
.share-workspace__floor:hover { color: var(--color-text); }
.share-workspace__status { margin-bottom: var(--space-4); }

.share-tasks { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-3); }
.share-task-row { display: flex; gap: var(--space-3); align-items: center; padding: var(--space-3);
  border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.share-task-row__index { display: grid; place-items: center; flex: 0 0 auto;
  width: var(--size-task-row-index); height: var(--size-task-row-index);
  border-radius: var(--radius-pill); background: var(--color-status-empty);
  font-family: var(--font-mono); font-size: var(--text-xs); }
.share-task-row__title { flex: 1; min-width: 0; font-weight: 500; text-decoration: none; color: var(--color-text); }
.share-task-row__comments { display: inline-flex; align-items: center; gap: 3px; color: var(--color-text-muted); }
.share-task-row__comments .icon-comment { width: 13px; height: 13px; display: block; }

.share-task { max-width: 720px; margin: 0 auto; }
.share-task__pins { display: flex; gap: var(--space-2); margin: var(--space-2) 0 var(--space-4); }
.share-task__pin-thumb { display: block; border-radius: var(--radius-sm); overflow: hidden; }
.share-task__pin-thumb img { display: block; width: var(--size-thumb-w); height: var(--size-thumb-h); object-fit: cover; }