/* Preserve the camera grid. Only the chosen player expands to usable controls. */
.cam[data-webcam] [hidden] { display: none !important; }
.cam[data-webcam] .cam-open { position: absolute; inset: 0; display: block; }
.cam[data-webcam] .cam-preview { display: flex; pointer-events: none; }
.cam[data-webcam] .cam-play { opacity: 1; background: var(--mu-ink); color: var(--mu-paper); padding: 8px 12px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.cam[data-webcam] .cam-unavailable { display: none; }
.cam[data-webcam].cam-off .cam-unavailable { display: block; }
.cam[data-webcam]::after { content: "Prévia"; pointer-events: none; }
.cam[data-webcam] .cam-open:focus-visible { outline: 3px solid var(--mu-lime); outline-offset: -4px; }
.cam[data-webcam].cam-playing { grid-column: 1 / -1; aspect-ratio: auto; min-height: 0; cursor: auto; }
.cam[data-webcam].cam-playing::after { display: none; }
.cam[data-webcam] [data-webcam-player] { position: relative; width: 100%; aspect-ratio: 16 / 9; min-height: 200px; }
.cam[data-webcam] [data-webcam-player] iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cam[data-webcam] .cam-controls { padding: 12px; display: grid; gap: 8px; background: var(--panel, var(--mu-paper)); color: var(--ink, var(--mu-ink)); }
.cam[data-webcam] .cam-controls strong { font-size: 14px; }
.cam[data-webcam] [data-webcam-status] { font-size: 13px; line-height: 1.4; }
.cam[data-webcam] .cam-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cam[data-webcam] .cam-actions > * { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line, var(--mu-line)); border-radius: 8px; background: var(--panel, var(--mu-paper)); color: inherit; font: inherit; font-size: 12px; font-weight: 800; text-decoration: none; cursor: pointer; }
.cam[data-webcam] .cam-actions > *:focus-visible { outline: 3px solid var(--green, var(--mu-green)); outline-offset: 2px; }
.cam[data-webcam] .cam-actions > *:hover { border-color: var(--green, var(--mu-green)); }
.webcam-note { margin: 0; padding: 10px 14px; color: var(--muted, var(--mu-muted)); font-size: 12px; line-height: 1.4; }
