/* Scene stills guide photo placement. Existing controls own files and roles. */
body.v2-site .cast-board{--cast-accent:#f59e0b;--cast-target:clamp(44px,4.5vw,72px);--cast-lead-target:clamp(56px,5.3vw,84px);width:100%;min-width:0}
body.v2-site .cast-board[hidden]{display:none}
body.v2-site .cast-board-canvas{display:grid;grid-template-columns:60% minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:4px;aspect-ratio:1.22;min-height:0;padding:0;position:relative;overflow:hidden;isolation:isolate;border:1px solid var(--color-border-default);border-radius:var(--radius-md);background:var(--color-bg-surface);box-shadow:none}
body.v2-site .cast-board-canvas::before,body.v2-site .cast-board-canvas::after{display:none}
body.v2-site .cast-board-panel{display:block;position:relative;min-width:0;min-height:0;overflow:hidden;background:var(--color-bg-surface-elevated)}
body.v2-site .cast-board-panel[data-panel=ensemble]{grid-row:1/-1}
body.v2-site .cast-board-panel::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.03),transparent 55%,rgba(0,0,0,.16));z-index:0}
body.v2-site .cast-board-reference{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.9) saturate(.95);pointer-events:none;user-select:none}
body.v2-site .cast-board-reference[hidden]{display:none}
body.v2-site .cast-board-canvas[data-layout=solo],body.v2-site .cast-board-canvas[data-layout=duo]{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);aspect-ratio:4/3;min-height:0}
body.v2-site .cast-board-panel[data-image-error=true]{background:radial-gradient(ellipse at bottom,#283044,var(--color-bg-surface))}

/* The center of the circular button, not the combined button/label, is anchored
   to the face. Percentages are recalculated for the image's actual cover crop. */
body.v2-site .cast-board-canvas[data-layout] .cast-board-pin[data-pin-role]{position:absolute;left:var(--face-x,50%)!important;top:var(--face-y,50%)!important;transform:translate(-50%,-50%);display:block;width:var(--cast-target);height:var(--cast-target);max-width:none;min-width:0;padding:0;z-index:1;text-align:center;opacity:1}
body.v2-site .cast-board-canvas[data-layout] .cast-board-pin[data-pin-role=lead],body.v2-site .cast-board-canvas[data-layout=duo] .cast-board-pin[data-pin-role]{width:var(--cast-lead-target);height:var(--cast-lead-target)}
body.v2-site :is(.cast-board-choose,.cast-board-static){display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;min-height:0;padding:0;border:2px solid var(--cast-accent);border-radius:50%;background:rgba(10,11,16,.62);color:#fff;box-shadow:0 0 0 5px rgba(245,158,11,.17),0 4px 18px rgba(0,0,0,.4);font-family:var(--font-body);overflow:visible;transition:background .18s,box-shadow .18s}
body.v2-site .cast-board-choose:is(:hover,:focus-visible,.is-dragover){transform:none;background:rgba(136,80,0,.85);box-shadow:0 0 0 7px rgba(245,158,11,.3),0 4px 20px rgba(0,0,0,.5)}
body.v2-site .cast-board-choose:focus-visible,body.v2-site .cast-board-remove:focus-visible{outline:3px solid white;outline-offset:4px}
body.v2-site .cast-board-choose:disabled{cursor:wait;opacity:.65;transform:none}
body.v2-site .cast-board-symbol{margin:0;color:#ffbd36;font:500 1.6rem/1 var(--font-body)}
body.v2-site .cast-board-add-label{margin-top:3px;color:#fff;font:600 .625rem/1.2 var(--font-body);white-space:nowrap}
body.v2-site .cast-board-role{position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);max-width:110px;width:max-content;padding:3px 7px;border:1px solid rgba(245,158,11,.4);border-radius:5px;background:rgba(10,11,16,.92);color:#fff;box-shadow:0 2px 8px #0004;font:500 .625rem/1.4 var(--font-mono);text-align:center;white-space:nowrap}
body.v2-site .cast-board-role::before{display:none}
body.v2-site [data-pin-role=lead] .cast-board-role{background:var(--cast-accent);border-color:var(--cast-accent);color:#18120a;font-weight:700}
body.v2-site .cast-board-subtitle{position:absolute;top:calc(100% + 31px);left:50%;transform:translateX(-50%);white-space:nowrap;padding:2px 4px;border-radius:3px;background:rgba(10,11,16,.85);color:#eee;font:400 .5625rem/1.3 var(--font-body)}
body.v2-site .cast-board-portrait{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;pointer-events:none}
body.v2-site .cast-board-pin[data-state=ready] .cast-board-choose,body.v2-site .cast-board-pin[data-state=mirror] .cast-board-static{border-color:var(--cast-accent);box-shadow:0 0 0 4px rgba(245,158,11,.25),0 4px 18px #0006;background:#0a0b10}
body.v2-site .cast-board-photo-check{position:absolute;right:-4px;bottom:0;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;border:2px solid #1b1b1b;background:var(--cast-accent);color:#18120a;font:700 10px/1 var(--font-body)}
body.v2-site .cast-board-pin[data-state=inactive]{pointer-events:none;opacity:.65}
body.v2-site .cast-board-pin[data-state=inactive] .cast-board-static{border:1px dashed #bbb;background:rgba(10,11,16,.6);box-shadow:none}
body.v2-site .cast-board-pin[data-state=inactive] .cast-board-symbol{color:#ddd;font:500 .75rem/1 var(--font-mono)}
body.v2-site .cast-board-removals{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
body.v2-site .cast-board-removals[hidden]{display:none}
body.v2-site .cast-board-remove{min-height:44px;padding:8px 12px;gap:12px;border:1px solid var(--color-border-default);border-radius:var(--radius-sm);background:var(--color-bg-surface-elevated);color:var(--color-text-secondary);font:500 .75rem/1.3 var(--font-body)}
body.v2-site .cast-board-remove:hover{border-color:var(--color-accent-coral);color:var(--color-text-primary)}
body.v2-site .cast-board-remove-symbol{color:var(--color-accent-coral)}
/* Same timing, scale and glow as the owner's V2 memeClonePulse. */
body.v2-site .cast-board .v2-cloned-pulse{animation:memeClonePulse .6s cubic-bezier(.16,1,.3,1) var(--clone-delay,0ms)}
@media(max-width:600px){
 body.v2-site .cast-board{--cast-accent:#f59e0b;--cast-target:44px;--cast-lead-target:56px}
 body.v2-site .cast-board-canvas{aspect-ratio:.95;gap:3px}
 body.v2-site .cast-board-canvas[data-scene=soul-duet]{aspect-ratio:1}
 body.v2-site .cast-board-canvas[data-layout=duo]{--cast-lead-target:52px}
 body.v2-site .cast-board-role{font-size:.5rem;padding:3px 4px;top:calc(100% + 6px)}
 body.v2-site .cast-board-canvas[data-layout=band] :is([data-pin-role=left],[data-pin-role=right]) .cast-board-role{top:auto;bottom:calc(100% + 6px)}
 body.v2-site .cast-board-add-label{font-size:.5rem}
 body.v2-site .cast-board-symbol{font-size:1.35rem}
 body.v2-site .cast-board-subtitle{font-size:.5rem;top:calc(100% + 25px)}
}
@media(prefers-reduced-motion:reduce){body.v2-site .cast-board-choose{transition:none}body.v2-site .cast-board .v2-cloned-pulse{animation:none}}

/* Photo source mode stays separate from the selected concert scene. */
.v2-site .input-mode-picker{border:0;padding:0;margin:0 0 18px;min-width:0}
.v2-site .input-mode-picker legend{font-size:13px;margin-bottom:10px;font-weight:600}
.v2-site .input-mode-tabs{display:flex;gap:8px;flex-wrap:wrap}
.v2-site .input-mode-tabs label{position:relative;cursor:pointer;flex:1;min-width:120px}
.v2-site .input-mode-tabs input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer}
.v2-site .input-mode-tabs span{display:flex;align-items:center;justify-content:center;padding:12px 10px;border:1px solid var(--border-subtle,#45454d);border-radius:12px;font-size:13px;min-height:44px}
.v2-site .input-mode-tabs input:checked+span{border-color:#f5a300;background:#f5a30020;color:var(--brand-primary,#f5a300)}
.v2-site .input-mode-tabs input:focus-visible+span{outline:2px solid #f5a300;outline-offset:3px}
.v2-site .input-mode-detail{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;margin-top:12px}
.v2-site .input-mode-detail select{width:auto;min-width:110px;padding:9px}
.v2-site .input-mode-picker [hidden],.v2-site #shared-photo-upload[hidden]{display:none!important}
.v2-site .shared-photo-target{width:100%;min-height:300px;border:1px dashed #f5a300;border-radius:18px;background:radial-gradient(ellipse at center,#f5a30012,transparent);color:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:22px;cursor:pointer;overflow:hidden}
.v2-site .shared-photo-target img{width:100%;height:230px;object-fit:contain;border-radius:10px}
.v2-site .shared-photo-target:has(img:not([hidden])) .shared-photo-symbol{display:none}
.v2-site .shared-photo-symbol{font-size:42px;color:#f5a300}
.v2-site .shared-photo-target>span:last-child{font-size:12px;color:var(--text-secondary)}
.v2-site #remove-shared-photo{margin-top:12px}
.v2-site .hero-clone-link{display:inline-block;margin:12px 0 4px;font-size:13px;color:var(--brand-primary,#f5a300)}
@media(max-width:600px){.v2-site .shared-photo-target{min-height:250px;padding:14px}.v2-site .shared-photo-target img{height:190px}}
