// ---- Drag & Drop logic (mouse) ---- function onMouseDown(e, icon) if (e.button !== 0) return; // left click only for dragging e.preventDefault(); dragTarget = icon; const iconDiv = e.currentTarget; activeIconElement = iconDiv; // bring to front iconDiv.style.zIndex = currentZIndex++; const startRect = iconDiv.getBoundingClientRect(); initialLeft = startRect.left; initialTop = startRect.top; dragStartX = e.clientX; dragStartY = e.clientY; const onMouseMove = (moveEvent) => if (!dragTarget) return; moveEvent.preventDefault(); const dx = moveEvent.clientX - dragStartX; const dy = moveEvent.clientY - dragStartY; let newX = initialLeft + dx; let newY = initialTop + dy; // boundary constraints relative to desktop container const containerRect = desktopEl.getBoundingClientRect(); const maxX = containerRect.width - 88; const maxY = containerRect.height - 78; newX = Math.min(maxX, Math.max(2, newX)); newY = Math.min(maxY, Math.max(2, newY)); if (activeIconElement) activeIconElement.style.left = `$newXpx`; activeIconElement.style.top = `$newYpx`; ; const onMouseUp = (upEvent) => if (dragTarget && activeIconElement) // commit final position from actual element style const leftVal = parseFloat(activeIconElement.style.left); const topVal = parseFloat(activeIconElement.style.top); if (!isNaN(leftVal) && !isNaN(topVal)) dragTarget.x = leftVal; dragTarget.y = topVal; persistPositions(); dragTarget = null; activeIconElement = null; document.removeEventListener('mousemove', onMouseMove); document.removeEventListener('mouseup', onMouseUp); removeContextMenu(); // also remove menu while dragging ; document.addEventListener('mousemove', onMouseMove); document.addEventListener('mouseup', onMouseUp); removeContextMenu(); // dismiss any open context menu when starting drag

/* icon text label */ .icon-label font-size: 12px; font-weight: 500; color: #fef7e0; text-shadow: 0 1px 3px rgba(0,0,0,0.6); background: rgba(0, 0, 0, 0.45); backdrop-filter: blur(4px); padding: 4px 8px; border-radius: 20px; max-width: 92px; white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; letter-spacing: 0.3px; transition: background 0.1s;

.context-menu-item:hover background: #3a4b6ecc;