/* 3D Dock icons (dock-icons.js). A button with .has-dock-icon-3d keeps its 48 px slot, focus ring,
   state marker, label and tooltip; its sculpted artwork replaces the flat tile, so the icon sits
   directly on the Dock surface instead of on a coloured square. */
.app-shortcut.has-dock-icon-3d,
.app-shortcut.has-dock-icon-3d:hover {
  padding: 0;
  border: 0; /* keeps the 48 px box; the 56 px layer below is measured from it */
  background: transparent;
  color: var(--text); /* state marker colour on the light Dock surface */
}

/* The artwork layer is larger than the button (56 px, centred) so the hover lift and press
   squash are never clipped; it never takes input, so the clickable area stays put. */
.dock-icon-3d {
  position: absolute;
  inset: -4px;
  pointer-events: none;
}
.dock-icon-3d img,
.dock-icon-3d canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
/* Without a tile the open/active marker would land on the raven's feet; it sits just below. */
.app-shortcut.has-dock-icon-3d .shortcut-state { bottom: -8px; }

/* Static image until the first 3D frame, and again whenever 3D is unavailable. */
.dock-icon-3d.is-live img { visibility: hidden; }

/* Minimized-window previews reuse the static image as their artwork. */
.minimized-preview-icon .dock-icon-still { width: 20px; height: 20px; }