.ux4g-category-cards{--primary: var(--ux4g-color-brand-primary, #4a2bc2);--primary-deep: #301c7d;--primary-dark: #271563;--primary-darker: #1c0f4d;--primary-tint: #ece7fb;--amber: #ff9233;--amber-ink: #7a3d00;--amber-soft: #fff4e6;--warm-bg-2: #ffe9d2;--ux4g-color-primary-100: #e9e4fb;--ux4g-color-primary-200: #d4c9f6;--ux4g-color-primary-300: #b6a4ee;--ux4g-color-primary-400: #9375e6;--success: #16a34a}.ux4g-category-cards .cx-sc-art-panel{background:color-mix(in srgb,var(--amber-soft) 88%,var(--card))}.dark .ux4g-category-cards .cx-sc-art-panel{background:color-mix(in srgb,var(--amber) 10%,var(--card))}.ux4g-category-cards .cx-sc-art{display:flex;align-items:center;justify-content:center}.ux4g-category-cards .cx-sc-art svg{width:100%;max-width:220px;height:auto;max-height:100%;display:block}@media(prefers-reduced-motion:no-preference){.ux4g-category-cards .cx-sc-card--form:hover .cx-cursor{animation:cx-blink 1s steps(1,end) infinite}.ux4g-category-cards .cx-sc-card--form:hover .cx-knob{animation:cx-knob-nudge 1.7s ease-in-out infinite}.ux4g-category-cards .cx-sc-card--feedback:hover .cx-spinner{transform-box:view-box;transform-origin:186px 25px;animation:cx-spin .9s linear infinite}.ux4g-category-cards .cx-sc-card--feedback:hover .cx-progress-fill{animation:cx-progress 2.4s ease-in-out infinite}.ux4g-category-cards .cx-sc-card--data:hover .cx-av{transform-box:view-box;animation:cx-pop 1.6s ease-in-out infinite}.ux4g-category-cards .cx-sc-card--data:hover .cx-av-1{transform-origin:17px 17px}.ux4g-category-cards .cx-sc-card--data:hover .cx-av-2{transform-origin:17px 45px;animation-delay:.18s}.ux4g-category-cards .cx-sc-card--data:hover .cx-av-3{transform-origin:17px 73px;animation-delay:.36s}.ux4g-category-cards .cx-sc-card--nav:hover .cx-dash{animation:cx-flow .85s linear infinite}.ux4g-category-cards .cx-sc-card--nav:hover .cx-step{transform-box:view-box;transform-origin:88px 42px;animation:cx-pulse 1.6s ease-in-out infinite}.ux4g-category-cards .cx-sc-card--capture:hover .cx-scan{animation:cx-scan-sweep 2.2s ease-in-out infinite}}@keyframes cx-blink{0%,48%{opacity:1}52%,98%{opacity:0}to{opacity:1}}@keyframes cx-knob-nudge{0%,to{transform:translate(0)}45%,55%{transform:translate(-9px)}}@keyframes cx-spin{to{transform:rotate(360deg)}}@keyframes cx-progress{0%,to{width:70px}50%{width:205px}}@keyframes cx-pop{0%,to{transform:scale(1)}42%{transform:scale(1.16)}}@keyframes cx-flow{to{stroke-dashoffset:-14}}@keyframes cx-pulse{0%,to{transform:scale(1)}45%{transform:scale(1.15)}}@keyframes cx-scan-sweep{0%,to{transform:translateY(-18px)}50%{transform:translateY(18px)}}.cx-a11y-demo .cx-a11y-target{box-shadow:0 0 0 0 transparent}@keyframes cx-a11y-ring{0%,30%{box-shadow:0 0 0 2px var(--card),0 0 0 5px var(--ux4g-color-brand-primary, #4a2bc2)}33.33%,to{box-shadow:0 0 0 0 transparent}}@keyframes cx-a11y-tab-press{0%,6%,to{transform:translateY(0)}3%{transform:translateY(2px)}}@media(prefers-reduced-motion:no-preference){.cx-a11y-demo .cx-a11y-target{animation:cx-a11y-ring 4.8s ease-in-out infinite}.cx-a11y-demo .cx-a11y-t2{animation-delay:1.6s}.cx-a11y-demo .cx-a11y-t3{animation-delay:3.2s}.cx-a11y-demo .cx-a11y-tab{animation:cx-a11y-tab-press 1.6s ease-in-out infinite}}@media(prefers-reduced-motion:reduce){.cx-a11y-demo .cx-a11y-t1{box-shadow:0 0 0 2px var(--card),0 0 0 5px var(--ux4g-color-brand-primary, #4a2bc2)}}
