/* Paint and interaction only: dock geometry, hit targets and media handlers stay
   owned by the existing call controls. */
.call-controls .icon-control>svg {
  transform:none;
  transition:background 180ms ease,border-color 180ms ease,box-shadow 180ms ease,filter 150ms ease,transform 140ms cubic-bezier(.22,.8,.25,1);
}
.call-controls .call-control-glyph {
  transform-box:fill-box;transform-origin:center;
  transition:transform 180ms cubic-bezier(.22,.8,.25,1),opacity 150ms ease;
}
.call-controls .control-label { transition:color 150ms ease; }
.call-controls .icon-control:not(:disabled):focus-visible>svg {
  filter:brightness(1.12);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-focus,#3498ff) 14%,transparent),inset 0 1px rgba(255,255,255,.06);
}
@media(hover:hover) {
  .call-controls .icon-control:not(:disabled):hover>svg {
    filter:brightness(1.13);
    border-color:color-mix(in srgb,currentColor 48%,transparent);
    box-shadow:0 0 0 3px color-mix(in srgb,currentColor 6%,transparent),0 4px 12px rgba(0,0,0,.14),inset 0 1px rgba(255,255,255,.06);
  }
  .call-controls .icon-control:not(:disabled):hover .call-control-glyph { transform:translateY(-.6px) rotate(-3deg); }
  .call-controls .control-leave:not(:disabled):hover .call-control-glyph { transform:translateY(-.5px); }
}
.call-controls .icon-control:not(:disabled):active>svg { transform:scale(.94);filter:brightness(1.06); }
.call-controls .icon-control:not(:disabled):active .call-control-glyph { transform:scale(.96); }
.call-controls :is(#toggle-camera,#stop-share).is-active>svg {
  border-color:rgba(52,152,255,.8);
  background:linear-gradient(145deg,rgba(52,152,255,.19),rgba(52,152,255,.08)),var(--theme-surface-card,#101c30);
  box-shadow:0 0 0 2px rgba(52,152,255,.08),inset 0 1px rgba(255,255,255,.05);
}
.call-controls :is(#toggle-camera,#stop-share).is-active::after {
  content:'';position:absolute;right:1px;top:1px;width:7px;height:7px;border:1px solid var(--theme-surface-card,#101c30);border-radius:50%;background:#3498ff;pointer-events:none;
}
.call-controls #toggle-camera.is-pending .call-control-glyph { animation:call-camera-pending 1100ms ease-in-out infinite; }
.call-controls .share-split-toggle { transition:background 150ms ease,border-color 150ms ease,transform 140ms ease; }
.call-controls .share-split-toggle:active { transform:scale(.92); }
.call-controls .share-split-toggle>svg { transition:transform 180ms ease; }
.call-controls .share-split-toggle[aria-expanded=true]>svg { transform:rotate(180deg); }
.call-controls .icon-control:disabled { cursor:default; }
@keyframes call-camera-pending { 0%,100% { opacity:.5; } 50% { opacity:1; } }
@media(prefers-reduced-motion:reduce) {
  .call-controls #toggle-camera.is-pending .call-control-glyph { animation:none;opacity:.7; }
  .call-controls :is(.icon-control>svg,.call-control-glyph,.control-label,.share-split-toggle,.share-split-toggle>svg) { transition:none;animation:none; }
  .call-controls .icon-control:not(:disabled):is(:hover,:active) .call-control-glyph,.call-controls .icon-control:not(:disabled):active>svg,.call-controls .share-split-toggle:active { transform:none; }
}