@php
    /** @var string $id */
    $id = $id ?? 'cam';
    $label = $label ?? 'CAM 01';
    $showPlaceholder = $showPlaceholder ?? true;
@endphp
<div class="camera-frame" id="{{ $id }}">
  <span class="tick tl"></span>
  <span class="tick tr"></span>
  <span class="tick bl"></span>
  <span class="tick br"></span>
  <span class="label">{{ $label }}</span>
  @if ($showPlaceholder)
    <div class="placeholder">
      <svg width="64" height="48" viewBox="0 0 64 48" xmlns="http://www.w3.org/2000/svg" fill="none">
        <rect x="2" y="8" width="44" height="32" rx="2" stroke="#4fd2ff" stroke-width="2"/>
        <path d="M46 18 L60 10 L60 38 L46 30 Z" stroke="#4fd2ff" stroke-width="2" stroke-linejoin="round"/>
        <circle cx="14" cy="14" r="2" fill="#e63a2e"/>
      </svg>
      <span class="ph-text">— WAITING FOR CAMERA —</span>
      <span class="ph-coords">auto-syncs from OBS scene transform</span>
    </div>
  @endif
</div>
