.ultrakit-icx{--a: #6c5ce7;--b: #00cec9;--ink: #14142b;--cols: 2;--cols-t: 2;--cols-m: 1;--gap: 28px;--r: 22px;--ratio: 3 / 2;--lens: 220px;--sweep: 5s;width: 100%;box-sizing: border-box;color: var(--ink)}.ultrakit-icx *,.ultrakit-icx *::before,.ultrakit-icx *::after{box-sizing: border-box}.icx-grid{display: grid;grid-template-columns: repeat(var(--cols),minmax(0,1fr));gap: var(--gap)}.icx-item{position: relative;margin: 0;display: flex;flex-direction: column;border-radius: var(--r);--sr: var(--r);min-width: 0}.icx-stage{position: relative;width: 100%;aspect-ratio: var(--ratio);overflow: hidden;border-radius: var(--sr);background: #e9e9f3;cursor: ew-resize;touch-action: pan-y;user-select: none;-webkit-user-select: none;outline: none;isolation: isolate}.icx-d-v .icx-stage{cursor: ns-resize;touch-action: pan-x}.icx-stage:focus-visible{box-shadow: 0 0 0 3px #fff,0 0 0 6px var(--a)}.icx-stage img{position: absolute;inset: 0;width: 100% !important;height: 100% !important;max-width: none;object-fit: cover;display: block;pointer-events: none}.icx-top{clip-path: inset(0 calc(100% - var(--pos)) 0 0)}.icx-d-v .icx-top{clip-path: inset(0 0 calc(100% - var(--pos)) 0)}.icx-f-soft .icx-item{box-shadow: 0 30px 60px -28px rgba(20,20,60,.45);background: #fff}.icx-f-soft .icx-cap{padding: 18px 22px 22px}.icx-f-border .icx-item{background: #fff;padding: 10px;--sr: calc(var(--r) - 8px);box-shadow: 0 30px 60px -28px rgba(20,20,60,.4)}.icx-f-gradient .icx-item{background: linear-gradient(135deg,var(--a),var(--b));padding: 4px;--sr: calc(var(--r) - 4px);box-shadow: 0 30px 60px -28px color-mix(in srgb,var(--a) 60%,transparent)}.icx-f-dark .icx-item{background: #14142b;padding: 10px;--sr: calc(var(--r) - 8px);color: #fff;box-shadow: 0 30px 60px -24px rgba(8,8,30,.6)}.icx-f-border .icx-cap,.icx-f-dark .icx-cap{padding: 16px 14px 8px}.icx-f-gradient .icx-cap{padding: 16px 20px 18px;background: #fff;border-radius: 0 0 calc(var(--r) - 4px) calc(var(--r) - 4px);margin-top: -1px}.icx-f-none .icx-cap{padding: 16px 2px 0}.icx-f-dark .icx-cap span{color: #b8b8d8}.icx-cap{display: flex;flex-direction: column;gap: 4px}.icx-cap b{font-size: 19px;font-weight: 800;letter-spacing: -.02em;line-height: 1.25}.icx-cap span{font-size: 14.5px;line-height: 1.55;color: #6b6b85}.icx-lab{position: absolute;z-index: 3;pointer-events: none;font-size: 12px;font-weight: 800;letter-spacing: .06em;text-transform: uppercase;color: #14142b;background: #fff;padding: 7px 14px;border-radius: 30px;box-shadow: 0 8px 20px -6px rgba(0,0,0,.35);transition: opacity .3s ease,transform .3s ease}.icx-lab-b{left: 16px;top: 16px}.icx-lab-a{right: 16px;top: 16px;background: linear-gradient(120deg,var(--a),var(--b));color: #fff}.icx-d-v .icx-lab-a{top: auto;bottom: 16px}.icx-lb-glass .icx-lab{background: rgba(14,14,32,.42);color: #fff;-webkit-backdrop-filter: blur(10px) saturate(1.5);backdrop-filter: blur(10px) saturate(1.5);box-shadow: inset 0 0 0 1px rgba(255,255,255,.5)}.icx-lb-dot .icx-lab{background: rgba(14,14,32,.62);color: #fff;-webkit-backdrop-filter: blur(8px);backdrop-filter: blur(8px);padding-left: 26px;box-shadow: none}.icx-lb-dot .icx-lab::before{content: "";position: absolute;left: 11px;top: 50%;width: 8px;height: 8px;margin-top: -4px;border-radius: 50%;background: #ff7a90}.icx-lb-dot .icx-lab-a::before{background: #3dffb8}.icx-lab.is-off{opacity: 0;transform: translateY(-6px)}.icx-m-toggle .icx-lab{display: none}.icx-handle{position: absolute;z-index: 4;left: var(--pos);top: 0;bottom: 0;width: 0;pointer-events: none}.icx-handle::before{content: "";position: absolute;left: -1.5px;top: 0;bottom: 0;width: 3px;background: #fff;box-shadow: 0 0 14px rgba(0,0,0,.35)}.icx-d-v .icx-handle{left: 0;right: 0;top: var(--pos);bottom: auto;width: auto;height: 0}.icx-d-v .icx-handle::before{left: 0;right: 0;top: -1.5px;bottom: auto;width: auto;height: 3px}.icx-knob{position: absolute;left: 0;top: 50%;width: 54px;height: 54px;margin: -27px 0 0 -27px;border-radius: 50%;background: #fff;color: #14142b;display: flex;align-items: center;justify-content: center;box-shadow: 0 12px 28px -6px rgba(0,0,0,.5);transition: transform .25s cubic-bezier(.22,.9,.3,1)}.icx-d-v .icx-knob{left: 50%;top: 0;margin: -27px 0 0 -27px}.icx-d-v .icx-knob svg{transform: rotate(90deg)}.icx-stage:hover .icx-knob,.icx-item.is-drag .icx-knob{transform: scale(1.1)}.icx-item.is-drag .icx-knob{transform: scale(.94)}.icx-h-pill .icx-knob{width: 36px;height: 72px;border-radius: 30px;margin: -36px 0 0 -18px}.icx-h-pill .icx-knob svg{width: 18px;height: 18px}.icx-d-v.icx-h-pill .icx-knob{width: 72px;height: 36px;margin: -18px 0 0 -36px}.icx-d-v.icx-h-pill .icx-knob{left: 50%;top: 0;margin: -18px 0 0 -36px}.icx-h-glass .icx-knob{width: 66px;height: 66px;margin: -33px 0 0 -33px;background: rgba(255,255,255,.2);color: #fff;-webkit-backdrop-filter: blur(12px) saturate(1.6);backdrop-filter: blur(12px) saturate(1.6);box-shadow: inset 0 0 0 2px rgba(255,255,255,.8),0 12px 30px -6px rgba(0,0,0,.4)}.icx-d-v.icx-h-glass .icx-knob{margin: -33px 0 0 -33px}.icx-h-line .icx-knob{width: 18px;height: 18px;margin: -9px 0 0 -9px;background: #fff;box-shadow: 0 0 0 5px rgba(255,255,255,.35)}.icx-h-line .icx-knob svg{display: none}.icx-d-v.icx-h-line .icx-knob{margin: -9px 0 0 -9px}.icx-h-gradient .icx-handle::before{background: linear-gradient(180deg,var(--a),var(--b));width: 4px;left: -2px}.icx-d-v.icx-h-gradient .icx-handle::before{background: linear-gradient(90deg,var(--a),var(--b));height: 4px;top: -2px;width: auto;left: 0}.icx-h-gradient .icx-knob{background: linear-gradient(135deg,var(--a),var(--b));color: #fff}.icx-m-fade .icx-top{clip-path: none;opacity: var(--k,.5)}.icx-m-fade .icx-handle{display: block}.icx-m-toggle .icx-stage{cursor: pointer}.icx-m-toggle .icx-top{transition: clip-path .75s cubic-bezier(.65,0,.25,1)}.icx-switch{position: absolute;z-index: 5;left: 50%;bottom: 18px;transform: translateX(-50%);display: flex;padding: 4px;border-radius: 40px;background: rgba(14,14,32,.68);-webkit-backdrop-filter: blur(12px);backdrop-filter: blur(12px);box-shadow: 0 14px 34px -10px rgba(0,0,0,.5)}.icx-switch button{position: relative;z-index: 1;appearance: none;border: 0;background: none;color: rgba(255,255,255,.8);font: 800 13px/1 inherit;letter-spacing: .04em;padding: 11px 24px;border-radius: 30px;cursor: pointer;transition: color .3s}.icx-switch button.is-on{color: #fff}.icx-switch i{position: absolute;z-index: 0;left: 4px;top: 4px;bottom: 4px;width: calc(50% - 4px);border-radius: 30px;background: linear-gradient(120deg,var(--a),var(--b));transition: transform .5s cubic-bezier(.65,0,.25,1)}.icx-item.is-after .icx-switch i{transform: translateX(100%)}.icx-m-lens .icx-stage{cursor: none;touch-action: none}.icx-m-lens .icx-top{--lr: 0px;clip-path: circle(var(--lr) at var(--x,50%) var(--y,50%));transition: clip-path .3s cubic-bezier(.22,.9,.3,1)}.icx-m-lens .icx-item.is-on .icx-top{--lr: calc(var(--lens) / 2)}.icx-m-lens .icx-item.is-move .icx-top{transition: none}.icx-ring{position: absolute;z-index: 4;left: var(--x,50%);top: var(--y,50%);width: var(--lens);height: var(--lens);margin: calc(var(--lens) / -2) 0 0 calc(var(--lens) / -2);border-radius: 50%;border: 3px solid #fff;box-shadow: 0 0 0 4px color-mix(in srgb,var(--a) 55%,transparent),0 30px 60px -16px rgba(0,0,0,.55),inset 0 0 40px rgba(255,255,255,.12);opacity: 0;transform: scale(.4);pointer-events: none;transition: opacity .25s,transform .3s cubic-bezier(.22,.9,.3,1)}.icx-item.is-on .icx-ring{opacity: 1;transform: none}.icx-item.is-move .icx-ring{transition: opacity .25s,transform .3s cubic-bezier(.22,.9,.3,1)}.icx-hint{position: absolute;z-index: 4;left: 50%;bottom: 18px;transform: translateX(-50%);padding: 9px 18px;border-radius: 30px;background: rgba(14,14,32,.68);color: #fff;font-size: 13px;font-weight: 700;-webkit-backdrop-filter: blur(10px);backdrop-filter: blur(10px);pointer-events: none;transition: opacity .3s;white-space: nowrap}.icx-item.is-on .icx-hint{opacity: 0}.icx-m-lens .icx-lab-a{top: 16px}.icx-l-switcher .icx-grid{display: block}.icx-l-switcher .icx-item{display: none}.icx-l-switcher .icx-item.is-current{display: flex;animation: icxIn .5s cubic-bezier(.22,.9,.3,1)}@keyframes icxIn{from{opacity: 0;transform: translateY(14px) scale(.985)}to{opacity: 1;transform: none}}.icx-thumbs{display: flex;gap: 14px;margin-top: 20px;overflow-x: auto;padding: 6px 4px 12px;scrollbar-width: none;justify-content: center}.icx-thumbs::-webkit-scrollbar{display: none}.icx-thumb{appearance: none;flex: 0 0 auto;width: 148px;padding: 6px;border: 0;border-radius: 16px;background: #fff;color: inherit;text-align: left;cursor: pointer;box-shadow: 0 8px 20px -10px rgba(20,20,60,.35);font-family: inherit;transition: transform .25s,box-shadow .25s}.icx-thumb:hover{transform: translateY(-3px)}.icx-thumb img{display: block;width: 100%;aspect-ratio: 3 / 2;object-fit: cover;border-radius: 11px}.icx-thumb span{display: block;padding: 8px 4px 2px;font-size: 12px;font-weight: 800;color: #14142b;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.icx-thumb.is-active{box-shadow: 0 0 0 2.5px var(--a),0 14px 28px -10px color-mix(in srgb,var(--a) 60%,transparent)}.icx-f-dark .icx-thumb{background: #14142b}.icx-f-dark .icx-thumb span{color: #fff}@media (max-width: 1024px){.icx-grid{grid-template-columns: repeat(var(--cols-t),minmax(0,1fr))}}@media (max-width: 767px){.icx-grid{grid-template-columns: repeat(var(--cols-m),minmax(0,1fr))}.icx-knob{width: 46px;height: 46px;margin: -23px 0 0 -23px}.icx-d-v .icx-knob{margin: -23px 0 0 -23px}.icx-lab{font-size: 11px;padding: 6px 11px}.icx-lab-b,.icx-lab-a{top: 10px}.icx-lab-b{left: 10px}.icx-lab-a{right: 10px}.icx-thumb{width: 118px}.icx-m-lens{--lens: 150px}}@media (prefers-reduced-motion: reduce){.icx-m-toggle .icx-top,.icx-switch i,.icx-knob,.icx-l-switcher .icx-item.is-current{transition: none !important;animation: none !important}}