diff --git a/ui/src/styles/skill-workshop.css b/ui/src/styles/skill-workshop.css index 7f1547a25edc..ab216fe39829 100644 --- a/ui/src/styles/skill-workshop.css +++ b/ui/src/styles/skill-workshop.css @@ -1495,132 +1495,3 @@ grid-template-columns: 1fr; } } - -/* Workshop chat handoff */ -.sw-handoff-veil { - position: fixed; - inset: 0; - z-index: 1199; - background: color-mix(in srgb, var(--bg, #0b0d10) 28%, transparent); - pointer-events: auto; - opacity: 0; - animation: sw-handoff-veil-in 260ms ease-out forwards; -} - -.sw-handoff-veil--landing { - animation: sw-handoff-veil-out 360ms ease-out forwards; -} - -@keyframes sw-handoff-veil-in { - from { - opacity: 0; - } - to { - opacity: 1; - } -} - -@keyframes sw-handoff-veil-out { - from { - opacity: 1; - } - to { - opacity: 0; - } -} - -.sw-handoff { - position: fixed; - top: 18px; - right: 24px; - z-index: 1200; - display: grid; - place-items: center; - width: 44px; - height: 44px; - border-radius: 999px; - background: color-mix(in srgb, var(--card) 92%, transparent); - border: 1px solid var(--border-strong); - box-shadow: 0 12px 34px rgba(0, 0, 0, 0.22); - pointer-events: none; - transform: translateY(-8px) scale(0.96); - opacity: 0; - animation: sw-handoff-in 220ms cubic-bezier(0.16, 1, 0.3, 1) forwards; -} - -.sw-handoff--landing { - animation: sw-handoff-out 320ms cubic-bezier(0.32, 0, 0.18, 1) forwards; -} - -.sw-handoff--error { - border-color: color-mix(in srgb, var(--danger, #ff6b6b) 60%, var(--border-strong)); -} - -.sw-handoff__spinner { - width: 18px; - height: 18px; - border-radius: 50%; - border: 2px solid color-mix(in srgb, var(--accent) 25%, transparent); - border-top-color: var(--accent); - animation: sw-handoff-spin 720ms linear infinite; -} - -.sw-handoff--landing .sw-handoff__spinner { - animation: none; - border: 2px solid var(--accent); - border-top-color: var(--accent); - opacity: 0.82; - transform: scale(0.74); -} - -.sw-handoff--error .sw-handoff__spinner { - border-color: color-mix(in srgb, var(--danger, #ff6b6b) 25%, transparent); - border-top-color: var(--danger, #ff6b6b); -} - -@keyframes sw-handoff-in { - from { - opacity: 0; - transform: translateY(-8px) scale(0.96); - } - to { - opacity: 1; - transform: translateY(0) scale(1); - } -} - -@keyframes sw-handoff-out { - from { - opacity: 1; - transform: translateY(0) scale(1); - } - to { - opacity: 0; - transform: translateY(-10px) scale(0.94); - } -} - -@keyframes sw-handoff-spin { - to { - transform: rotate(360deg); - } -} - -@media (prefers-reduced-motion: reduce) { - .sw-handoff, - .sw-handoff__spinner, - .sw-handoff-veil { - animation: none; - } - .sw-handoff { - opacity: 1; - transform: translateY(0) scale(1); - } - .sw-handoff-veil { - opacity: 1; - } - .sw-handoff--landing, - .sw-handoff-veil--landing { - opacity: 0; - } -}