/* Production tools (photo reorder/rename board) — shared by the Pipeline card + (legacy) Production tab. */
.photo-board { margin:8px 0; border:1px solid var(--line); border-radius:10px; }
.pb-sum { cursor:pointer; padding:10px 12px; font-weight:600; font-size:14px; list-style:none; }
.pb-sum::-webkit-details-marker { display:none; }
.pb-body { padding:0 12px 12px; }
.pb-hint { font-size:12px; color:var(--muted); }
.pb-controls { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:6px 0 8px; }
.pb-size-wrap { font-size:12px; color:var(--muted); display:flex; align-items:center; gap:6px; }
.pb-size { accent-color:var(--accent); }
.pb-selinfo { font-size:12px; font-weight:700; color:var(--accent); }
.pb-grid { display:grid; grid-template-columns:repeat(var(--pb-cols,5),1fr); gap:6px; }
.pb-tile { position:relative; border-radius:6px; overflow:hidden; background:#111; cursor:grab; border:2px solid transparent; }
.pb-tile img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.pb-tile.hidden { opacity:.4; border-color:#7f1d1d; }
.pb-tile.sel { border-color:var(--accent); box-shadow:0 0 0 2px var(--accent) inset; }
.pb-tile.dragging { opacity:.5; outline:2px solid var(--accent); }
.pb-eye { position:absolute; top:2px; right:2px; background:rgba(0,0,0,.55); border:0; border-radius:5px; font-size:12px; padding:2px 5px; cursor:pointer; line-height:1; }
.pb-noimg { display:flex; align-items:center; justify-content:center; aspect-ratio:4/3; color:var(--muted); }
.pb-name { font-size:10px; color:var(--muted); padding:2px 4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; background:var(--panel2,#1c212b); }

/* Slideshow (make → review → approve) + hero/end-card previews — folded into the Pipeline card. */
.prow { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:8px 0; }
.p-btn { background:var(--accent); color:var(--accent-ink,#06122e); border:0; border-radius:8px; font:inherit; font-weight:700; font-size:13px; padding:8px 14px; cursor:pointer; }
.p-btn:disabled { opacity:.5; cursor:default; }
.p-btn.ghost { background:transparent; border:1px solid var(--line); color:var(--ink); }
.p-btn.danger { background:transparent; border:1px solid #7f1d1d; color:#f87171; }
.ss-msg { font-size:13px; }
.ss-wrap { margin:8px 0; }
.ss-badge { font-size:12px; font-weight:700; border-radius:999px; padding:5px 11px; }
.ss-badge.rendering { background:rgba(251,191,36,.16); color:var(--warn); }
.ss-badge.review { background:rgba(91,140,255,.16); color:#5b8cff; }
.ss-badge.approved { background:rgba(52,211,153,.16); color:var(--ok); }
.ss-preview { margin:10px 0; font-size:13px; }
.ss-pos { background:var(--panel); color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:7px 9px; font:inherit; font-size:13px; }
.hero-box { position:relative; width:100%; max-width:520px; aspect-ratio:16/9; border-radius:10px; overflow:hidden; background:#111; margin:10px 0; container-type:inline-size; }
.hero-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.hero-ph { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; font-size:12px; padding:0 12px; }
.hero-cap { position:absolute; left:0; right:0; text-align:center; color:#fff; font-family:Georgia,"Times New Roman",serif; font-size:4.2cqw; line-height:1.18; text-shadow:0 2px 5px rgba(0,0,0,.75); padding:0 6%; pointer-events:none; transition:top .15s ease; }
.hero-cap.top { top:16.67%; transform:translateY(-50%); }
.hero-cap.middle { top:50%; transform:translateY(-50%); }
.hero-cap.bottom { top:83.33%; transform:translateY(-50%); }
.preview-row { display:flex; gap:12px; flex-wrap:wrap; }
.preview-col { flex:1; min-width:250px; }
.plabel { font-size:12px; color:var(--muted); font-weight:600; margin:6px 0 -2px; }
.end-box { position:relative; width:100%; aspect-ratio:16/9; border-radius:10px; overflow:hidden; background:#141416; margin:10px 0; container-type:inline-size; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:4%; }
.end-box.text { display:block; padding:0; }
.end-ph { color:var(--muted); font-size:12px; }
.end-logo { max-width:74%; max-height:50%; object-fit:contain; }
.end-name { color:#fff; font-family:Georgia,"Times New Roman",serif; font-size:5cqw; line-height:1.2; margin-top:4%; }
.end-contact { color:#d2d2d6; font-family:Georgia,"Times New Roman",serif; font-size:3.5cqw; margin-top:2%; }
.end-box.text .end-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.end-box.text .end-cap { position:absolute; left:0; right:0; top:50%; transform:translateY(-50%); padding:0 6%; }
.end-box.text .end-name { text-shadow:0 2px 5px rgba(0,0,0,.75); margin:0; }
.end-box.text .end-contact { text-shadow:0 2px 5px rgba(0,0,0,.75); }
.end-box.text .end-div { width:34%; height:2px; background:rgba(255,255,255,.85); margin:2.5% auto; }