@cn-ui/core
Version:
The @cn-ui/core is a collection of UI components and utilities for building modern web applications with SolidJS.
9 lines • 32.8 kB
CSS
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
:root {
--cn-bg-design-primary-0: #FFFFFF;--cn-bg-design-primary-elevated-0: #FFFFFF;--cn-bg-design-secondary-0: #F2F2F7;--cn-bg-design-secondary-elevated-0: #F2F2F7;--cn-bg-design-tertiary-0: #FFFFFF;--cn-bg-design-tertiary-elevated-0: #FFFFFF;--cn-bg-design-floating-0: #fafafa;--cn-bg-design-thick-0: #FFFFFF;--cn-bg-design-thick-1: saturate(180%) blur(50px);;--cn-border-design-separator-0: #e3e3e3;--cn-text-design-primary-0: #000000;--cn-text-design-secondary-0: #3C3C4399;--cn-text-design-tertiary-0: #3C3C434c;--cn-text-design-quarternary-0: #3C3C432d;--cn-bg-design-thick-0: rgba(255, 255, 255, 0.93);--cn-bg-design-thick-1: blur(5px) saturate(180%);--cn-bg-design-thick-2: 1px solid rgba(209, 213, 219, 0.3);--cn-bg-design-regular-0: rgba(255, 255, 255, 0.84);--cn-bg-design-regular-1: blur(8px) saturate(180%);--cn-bg-design-regular-2: 1px solid rgba(209, 213, 219, 0.3);--cn-bg-design-thin-0: rgba(255, 255, 255, 0.56);--cn-bg-design-thin-1: blur(14px) saturate(180%);--cn-bg-design-thin-2: 1px solid rgba(209, 213, 219, 0.3);--cn-bg-design-ultra-thin-0: rgba(255, 255, 255, 0.17);--cn-bg-design-ultra-thin-1: blur(25px) saturate(180%);--cn-bg-design-ultra-thin-2: 1px solid rgba(209, 213, 219, 0.3);
}
.dark{
--cn-bg-design-primary-0: #000000;--cn-bg-design-primary-elevated-0: #1C1C1E;--cn-bg-design-secondary-0: #1C1C1E;--cn-bg-design-secondary-elevated-0: #2C2C2E;--cn-bg-design-tertiary-0: #2C2C2E;--cn-bg-design-tertiary-elevated-0: #3A3A3C;--cn-bg-design-floating-0: #1C1C1E;--cn-bg-design-thick-0: #1C1C1E;--cn-bg-design-thick-1: saturate(180%) blur(50px);;--cn-border-design-separator-0: #3f3f3f;--cn-text-design-primary-0: #FFFFFF;--cn-text-design-secondary-0: #EBEBF599;--cn-text-design-tertiary-0: #EBEBF54c;--cn-text-design-quarternary-0: #EBEBF52d;--cn-bg-design-thick-0: rgba(17, 25, 40, 0.93);--cn-bg-design-thick-1: blur(5px) saturate(180%);--cn-bg-design-thick-2: 1px solid rgba(255, 255, 255, 0.125);--cn-bg-design-regular-0: rgba(17, 25, 40, 0.84);--cn-bg-design-regular-1: blur(8px) saturate(180%);--cn-bg-design-regular-2: 1px solid rgba(255, 255, 255, 0.125);--cn-bg-design-thin-0: rgba(17, 25, 40, 0.56);--cn-bg-design-thin-1: blur(14px) saturate(180%);--cn-bg-design-thin-2: 1px solid rgba(255, 255, 255, 0.125);--cn-bg-design-ultra-thin-0: rgba(17, 25, 40, 0.17);--cn-bg-design-ultra-thin-1: blur(8px) saturate(180%);--cn-bg-design-ultra-thin-2: 1px solid rgba(255, 255, 255, 0.125);
}
.container{width:100%;}.container\!{width:100% ;}@media (min-width: 640px){.container{max-width:640px;}.container\!{max-width:640px ;}}@media (min-width: 768px){.container{max-width:768px;}.container\!{max-width:768px ;}}@media (min-width: 1024px){.container{max-width:1024px;}.container\!{max-width:1024px ;}}@media (min-width: 1280px){.container{max-width:1280px;}.container\!{max-width:1280px ;}}@media (min-width: 1536px){.container{max-width:1536px;}.container\!{max-width:1536px ;}}:root{--cn-colors-gray-400:191 191 191;--cn-colors-yellow-200:255 251 143;--cn-colors-primary-500:22 119 255;--cn-colors-primary-400:64 150 255;--cn-colors-primary-50:230 244 255;--cn-colors-primary-100:186 224 255;--cn-colors-gray-700:67 67 67;--cn-colors-gray-100:245 245 245;--cn-colors-cyan-500:19 194 194;--cn-colors-blue-500:22 119 255;--cn-colors-primary-600:9 88 217;--cn-colors-gray-500:140 140 140;--cn-colors-gray-200:240 240 240;--cn-colors-gray-300:217 217 217;--cn-colors-green-600:56 158 13;--cn-colors-blue-600:9 88 217;--cn-colors-yellow-600:212 177 6;--cn-colors-red-600:207 19 34;--cn-colors-error-400:255 77 79;--cn-colors-primary-200:145 202 255;--cn-colors-blue-200:145 202 255;--cn-colors-blue-300:105 177 255;--cn-colors-blue-400:64 150 255;--cn-colors-green-200:183 235 143;--cn-colors-green-300:149 222 100;--cn-colors-green-100:217 247 190;--cn-colors-gray-50:250 250 250;--cn-colors-red-300:255 120 117;--cn-colors-red-400:255 77 79;--cn-colors-green-400:115 209 61;--cn-colors-blue-100:186 224 255;--cn-colors-yellow-400:255 236 61;--cn-colors-yellow-100:255 255 184;--cn-colors-red-100:255 204 199;--cn-colors-gray-600:89 89 89;--cn-colors-success-600:56 158 13;--cn-colors-primary-300:105 177 255;--cn-colors-purple-600:83 29 171;--cn-colors-error-500:245 34 45;--cn-colors-error-50:255 241 240;--cn-colors-primary-800:0 44 140;}
.dark{--cn-colors-gray-400:73 73 73;--cn-colors-yellow-200:89 80 20;--cn-colors-primary-500:22 104 220;--cn-colors-primary-400:21 84 173;--cn-colors-primary-50:17 26 44;--cn-colors-primary-100:17 37 69;--cn-colors-gray-700:123 123 123;--cn-colors-gray-100:31 31 31;--cn-colors-cyan-500:19 168 168;--cn-colors-blue-500:22 104 220;--cn-colors-primary-600:60 137 232;--cn-colors-gray-500:90 90 90;--cn-colors-gray-200:45 45 45;--cn-colors-gray-300:57 57 57;--cn-colors-green-600:106 190 57;--cn-colors-blue-600:60 137 232;--cn-colors-yellow-600:232 214 57;--cn-colors-red-600:232 71 73;--cn-colors-error-400:166 29 36;--cn-colors-primary-200:21 50 91;--cn-colors-blue-200:21 50 91;--cn-colors-blue-300:21 65 126;--cn-colors-blue-400:21 84 173;--cn-colors-green-200:39 73 22;--cn-colors-green-300:48 99 23;--cn-colors-green-100:29 55 18;--cn-colors-gray-50:21 21 21;--cn-colors-red-300:121 26 31;--cn-colors-red-400:166 29 36;--cn-colors-green-400:60 134 24;--cn-colors-blue-100:17 37 69;--cn-colors-yellow-400:170 149 20;--cn-colors-yellow-100:68 59 17;--cn-colors-red-100:67 20 24;--cn-colors-gray-600:106 106 106;--cn-colors-success-600:106 190 57;--cn-colors-primary-300:21 65 126;--cn-colors-purple-600:133 78 202;--cn-colors-error-500:211 32 41;--cn-colors-error-50:42 18 21;--cn-colors-primary-800:141 197 248;}.pointer-events-auto{pointer-events:auto;}.pointer-events-none{pointer-events:none;}.visible{visibility:visible;}.absolute{position:absolute;}.fixed{position:fixed;}.relative{position:relative;}.sticky{position:sticky;}.-top-3{top:-0.75rem;}.bottom-4{bottom:1rem;}.left-\[50\%\]{left:50%;}.left-0{left:0;}.right-0{right:0;}.right-1{right:0.25rem;}.right-4{right:1rem;}.top-\[50\%\]{top:50%;}.top-0{top:0;}.top-4{top:1rem;}.-z-1{z-index:-1;}.z-\[200\]{z-index:200;}.z-1{z-index:1;}.z-10{z-index:10;}.z-2{z-index:2;}.grid{display:grid;}.inline-grid{display:inline-grid;}.col-span-12{grid-column:span 12/span 12;}.col-span-4{grid-column:span 4/span 4;}.col-span-6{grid-column:span 6/span 6;}.grid-cols-10{grid-template-columns:repeat(10,minmax(0,1fr));}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr));}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}.float-right{float:right;}.m-12{margin:3rem;}.m-auto{margin:auto;}.mx-1{margin-left:0.25rem;margin-right:0.25rem;}.my-1{margin-top:0.25rem;margin-bottom:0.25rem;}.my-2{margin-top:0.5rem;margin-bottom:0.5rem;}.mb-1{margin-bottom:0.25rem;}.mb-2{margin-bottom:0.5rem;}.mb-4{margin-bottom:1rem;}.me{margin-inline-end:1rem;}.ml-1{margin-left:0.25rem;}.mr-1{margin-right:0.25rem;}.mr-2{margin-right:0.5rem;}.ms{margin-inline-start:1rem;}.mt-1{margin-top:0.25rem;}.mt-2{margin-top:0.5rem;}.mt-4{margin-top:1rem;}.block{display:block;}.inline-block{display:inline-block;}.hidden{display:none;}.h-\[80vh\]{height:80vh;}.h-1,.h1{height:0.25rem;}.h-10{height:2.5rem;}.h-12{height:3rem;}.h-16{height:4rem;}.h-18{height:4.5rem;}.h-24{height:6rem;}.h-32{height:8rem;}.h-4,.h4{height:1rem;}.h-48{height:12rem;}.h-5,.h5{height:1.25rem;}.h-6,.h6{height:1.5rem;}.h-8{height:2rem;}.h-80{height:20rem;}.h-96{height:24rem;}.h-full{height:100%;}.h-md{height:28rem;}.h-screen{height:100vh;}.h2{height:0.5rem;}.h3{height:0.75rem;}.max-h-32{max-height:8rem;}.max-w-2xl{max-width:42rem;}.max-w-screen{max-width:100vw;}.min-h-\[9rem\]{min-height:9rem;}.min-w-\[15rem\]{min-width:15rem;}.min-w-7{min-width:1.75rem;}.w-1{width:0.25rem;}.w-10{width:2.5rem;}.w-12{width:3rem;}.w-18{width:4.5rem;}.w-24{width:6rem;}.w-28{width:7rem;}.w-32{width:8rem;}.w-4{width:1rem;}.w-5{width:1.25rem;}.w-6{width:1.5rem;}.w-64{width:16rem;}.w-8{width:2rem;}.w-80{width:20rem;}.w-96{width:24rem;}.w-fit{width:fit-content;}.w-full{width:100%;}.w-px{width:1px;}.w-screen{width:100vw;}.hover\:w-1:hover{width:0.25rem;}.flex{display:flex;}.inline-flex{display:inline-flex;}.flex-1{flex:1 1 0%;}.flex-none{flex:none;}.flex-row{flex-direction:row;}.flex-row-reverse{flex-direction:row-reverse;}.flex-col{flex-direction:column;}.flex-col-reverse{flex-direction:column-reverse;}.flex-wrap{flex-wrap:wrap;}.flex-wrap-reverse{flex-wrap:wrap-reverse;}.flex-nowrap{flex-wrap:nowrap;}.table{display:table;}.-translate-x-\[50\%\],.-translate-x-1\/2{--un-translate-x:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.-translate-y-\[50\%\],.-translate-y-1\/2{--un-translate-y:-50%;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.translate-y-\[3px\]{--un-translate-y:3px;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.hover\:-translate-x-4:hover{--un-translate-x:-1rem;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.-rotate-90{--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-rotate:-90deg;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.rotate-180{--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-rotate:180deg;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.rotate-45{--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-rotate:45deg;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.rotate-90{--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-rotate:90deg;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.scale-125{--un-scale-x:1.25;--un-scale-y:1.25;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.active\:scale-75:active{--un-scale-x:0.75;--un-scale-y:0.75;transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}.transform{transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite;}.cursor-default{cursor:default;}.cursor-pointer{cursor:pointer;}.cursor-not-allowed{cursor:not-allowed;}.cursor-grab{cursor:grab;}.cursor-col-resize{cursor:col-resize;}.touch-none{touch-action:none;}.select-none{-webkit-user-select:none;user-select:none;}.resize{resize:both;}.resize-none{resize:none;}.appearance-none{-webkit-appearance:none;appearance:none;}.columns-2{columns:2;}.items-start{align-items:flex-start;}.items-end{align-items:flex-end;}.items-center{align-items:center;}.items-baseline{align-items:baseline;}.items-stretch{align-items:stretch;}.justify-start{justify-content:flex-start;}.justify-end{justify-content:flex-end;}.justify-center{justify-content:center;}.justify-between{justify-content:space-between;}.justify-around{justify-content:space-around;}.justify-evenly{justify-content:space-evenly;}.justify-stretch{justify-content:stretch;}.gap-1{gap:0.25rem;}.gap-2{gap:0.5rem;}.gap-3{gap:0.75rem;}.gap-4{gap:1rem;}.gap-8{gap:2rem;}.overflow-auto{overflow:auto;}.overflow-hidden{overflow:hidden;}.overflow-x-visible{overflow-x:visible;}.overflow-y-auto{overflow-y:auto;}.overflow-y-scroll{overflow-y:scroll;}.text-ellipsis{text-overflow:ellipsis;}.whitespace-pre-wrap{white-space:pre-wrap;}.b,.border,.border-1{border-width:1px;}.border-2{border-width:2px;}.border-3{border-width:3px;}.border-4{border-width:4px;}.border-x{border-left-width:1px;border-right-width:1px;}.border-b{border-bottom-width:1px;}.border-r{border-right-width:1px;}.border-t{border-top-width:1px;}.border-black{--un-border-opacity:1;border-color:rgb(0 0 0 / var(--un-border-opacity));}.border-blue-600{--un-border-opacity:1;border-color:rgb(var(--cn-colors-blue-600) / var(--un-border-opacity));}.border-gray-200{--un-border-opacity:1;border-color:rgb(var(--cn-colors-gray-200) / var(--un-border-opacity));}.border-gray-300{--un-border-opacity:1;border-color:rgb(var(--cn-colors-gray-300) / var(--un-border-opacity));}.border-gray-300\/80{border-color:rgb(var(--cn-colors-gray-300) / 0.8);}.border-gray-400{--un-border-opacity:1;border-color:rgb(var(--cn-colors-gray-400) / var(--un-border-opacity));}.border-primary-200{--un-border-opacity:1;border-color:rgb(var(--cn-colors-primary-200) / var(--un-border-opacity));}.border-primary-300{--un-border-opacity:1;border-color:rgb(var(--cn-colors-primary-300) / var(--un-border-opacity));}.border-primary-400{--un-border-opacity:1;border-color:rgb(var(--cn-colors-primary-400) / var(--un-border-opacity));}.border-primary-500{--un-border-opacity:1;border-color:rgb(var(--cn-colors-primary-500) / var(--un-border-opacity));}.border-primary-600{--un-border-opacity:1;border-color:rgb(var(--cn-colors-primary-600) / var(--un-border-opacity));}.border-red-300{--un-border-opacity:1;border-color:rgb(var(--cn-colors-red-300) / var(--un-border-opacity));}.border-success-600{--un-border-opacity:1;border-color:rgb(var(--cn-colors-success-600) / var(--un-border-opacity));}.hover\:border-blue-400:hover{--un-border-opacity:1;border-color:rgb(var(--cn-colors-blue-400) / var(--un-border-opacity));}.hover\:border-error-400:hover{--un-border-opacity:1;border-color:rgb(var(--cn-colors-error-400) / var(--un-border-opacity));}.hover\:border-primary-400:hover{--un-border-opacity:1;border-color:rgb(var(--cn-colors-primary-400) / var(--un-border-opacity));}.rounded{border-radius:0.25rem;}.rounded-full{border-radius:9999px;}.rounded-lg{border-radius:0.5rem;}.rounded-md{border-radius:0.375rem;}.rounded-xl{border-radius:0.75rem;}.border-dashed{border-style:dashed;}.border-none{border-style:none;}.border-solid{border-style:solid;}.bg-blue-100{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-blue-100) / var(--un-bg-opacity));}.bg-blue-200{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-blue-200) / var(--un-bg-opacity));}.bg-blue-300{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-blue-300) / var(--un-bg-opacity));}.bg-blue-400{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-blue-400) / var(--un-bg-opacity));}.bg-blue-600{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-blue-600) / var(--un-bg-opacity));}.bg-error-400{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-error-400) / var(--un-bg-opacity));}.bg-error-500{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-error-500) / var(--un-bg-opacity));}.bg-gray-100{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-gray-100) / var(--un-bg-opacity));}.bg-gray-100\/70{background-color:rgb(var(--cn-colors-gray-100) / 0.7);}.bg-gray-200{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-gray-200) / var(--un-bg-opacity));}.bg-gray-300{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-gray-300) / var(--un-bg-opacity));}.bg-gray-50{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-gray-50) / var(--un-bg-opacity));}.bg-gray-700\/70{background-color:rgb(var(--cn-colors-gray-700) / 0.7);}.bg-green-100{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-green-100) / var(--un-bg-opacity));}.bg-green-200{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-green-200) / var(--un-bg-opacity));}.bg-green-300{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-green-300) / var(--un-bg-opacity));}.bg-green-400{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-green-400) / var(--un-bg-opacity));}.bg-green-600{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-green-600) / var(--un-bg-opacity));}.bg-primary-400{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-primary-400) / var(--un-bg-opacity));}.bg-primary-50{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-primary-50) / var(--un-bg-opacity));}.bg-primary-500{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-primary-500) / var(--un-bg-opacity));}.bg-primary-600{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-primary-600) / var(--un-bg-opacity));}.bg-purple-600{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-purple-600) / var(--un-bg-opacity));}.bg-red-100{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-red-100) / var(--un-bg-opacity));}.bg-red-400{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-red-400) / var(--un-bg-opacity));}.bg-rose-600{--un-bg-opacity:1;background-color:rgb(225 29 72 / var(--un-bg-opacity));}.bg-transparent{background-color:transparent;}.bg-white{--un-bg-opacity:1;background-color:rgb(255 255 255 / var(--un-bg-opacity));}.bg-yellow-100{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-yellow-100) / var(--un-bg-opacity));}.bg-yellow-400{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-yellow-400) / var(--un-bg-opacity));}.bg-yellow-600{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-yellow-600) / var(--un-bg-opacity));}.hover\:bg-error-400:hover{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-error-400) / var(--un-bg-opacity));}.hover\:bg-gray-100:hover{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-gray-100) / var(--un-bg-opacity));}.hover\:bg-gray-200:hover{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-gray-200) / var(--un-bg-opacity));}.hover\:bg-gray-300:hover{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-gray-300) / var(--un-bg-opacity));}.hover\:bg-primary-400:hover{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-primary-400) / var(--un-bg-opacity));}.hover\:bg-primary-600:hover{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-primary-600) / var(--un-bg-opacity));}.active\:bg-error-50:active{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-error-50) / var(--un-bg-opacity));}.active\:bg-primary-50:active{--un-bg-opacity:1;background-color:rgb(var(--cn-colors-primary-50) / var(--un-bg-opacity));}.from-cyan-500{--un-gradient-from-position:0%;--un-gradient-from:rgb(var(--cn-colors-cyan-500) / var(--un-from-opacity, 1)) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(var(--cn-colors-cyan-500) / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);}.to-blue-500{--un-gradient-to-position:100%;--un-gradient-to:rgb(var(--cn-colors-blue-500) / var(--un-to-opacity, 1)) var(--un-gradient-to-position);}.bg-gradient-to-r{--un-gradient-shape:to right;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));}.fill-gray-500{--un-fill-opacity:1;fill:rgb(var(--cn-colors-gray-500) / var(--un-fill-opacity));}.fill-primary-400{--un-fill-opacity:1;fill:rgb(var(--cn-colors-primary-400) / var(--un-fill-opacity));}.fill-primary-600{--un-fill-opacity:1;fill:rgb(var(--cn-colors-primary-600) / var(--un-fill-opacity));}.stroke-primary-400{--un-stroke-opacity:1;stroke:rgb(var(--cn-colors-primary-400) / var(--un-stroke-opacity));}.object-cover{object-fit:cover;}.p-\[0\.35rem\]{padding:0.35rem;}.p-0,.p-none{padding:0;}.p-1{padding:0.25rem;}.p-12{padding:3rem;}.p-2{padding:0.5rem;}.p-4{padding:1rem;}.p-5{padding:1.25rem;}.px,.px-4{padding-left:1rem;padding-right:1rem;}.px-1{padding-left:0.25rem;padding-right:0.25rem;}.px-2{padding-left:0.5rem;padding-right:0.5rem;}.px-3{padding-left:0.75rem;padding-right:0.75rem;}.px-5{padding-left:1.25rem;padding-right:1.25rem;}.py-1{padding-top:0.25rem;padding-bottom:0.25rem;}.py-2{padding-top:0.5rem;padding-bottom:0.5rem;}.py-4{padding-top:1rem;padding-bottom:1rem;}.pb-2{padding-bottom:0.5rem;}.pb-4{padding-bottom:1rem;}.pl-\[0\.15rem\]{padding-left:0.15rem;}.pl-4{padding-left:1rem;}.pl-6{padding-left:1.5rem;}.pr-1{padding-right:0.25rem;}.pr-2{padding-right:0.5rem;}.pr-4{padding-right:1rem;}.pt-2{padding-top:0.5rem;}.pt-4{padding-top:1rem;}.text-center{text-align:center;}.text-left{text-align:left;}.text-right{text-align:right;}.text-justify{text-align:justify;}.indent,.indent-md{text-indent:1.5rem;}.indent-lg{text-indent:2rem;}.indent-sm{text-indent:1rem;}.text-nowrap{text-wrap:nowrap;}.text-2xl{font-size:1.5rem;line-height:2rem;}.text-lg{font-size:1.125rem;line-height:1.75rem;}.text-sm{font-size:0.875rem;line-height:1.25rem;}.text-xl{font-size:1.25rem;line-height:1.75rem;}.text-xs{font-size:0.75rem;line-height:1rem;}.text-black{--un-text-opacity:1;color:rgb(0 0 0 / var(--un-text-opacity));}.text-blue-600{--un-text-opacity:1;color:rgb(var(--cn-colors-blue-600) / var(--un-text-opacity));}.text-error-500{--un-text-opacity:1;color:rgb(var(--cn-colors-error-500) / var(--un-text-opacity));}.text-gray-400{--un-text-opacity:1;color:rgb(var(--cn-colors-gray-400) / var(--un-text-opacity));}.text-gray-600{--un-text-opacity:1;color:rgb(var(--cn-colors-gray-600) / var(--un-text-opacity));}.text-green-600{--un-text-opacity:1;color:rgb(var(--cn-colors-green-600) / var(--un-text-opacity));}.text-primary-300{--un-text-opacity:1;color:rgb(var(--cn-colors-primary-300) / var(--un-text-opacity));}.text-primary-400{--un-text-opacity:1;color:rgb(var(--cn-colors-primary-400) / var(--un-text-opacity));}.text-primary-500{--un-text-opacity:1;color:rgb(var(--cn-colors-primary-500) / var(--un-text-opacity));}.text-primary-600{--un-text-opacity:1;color:rgb(var(--cn-colors-primary-600) / var(--un-text-opacity));}.text-red-300{--un-text-opacity:1;color:rgb(var(--cn-colors-red-300) / var(--un-text-opacity));}.text-red-400{--un-text-opacity:1;color:rgb(var(--cn-colors-red-400) / var(--un-text-opacity));}.text-red-600{--un-text-opacity:1;color:rgb(var(--cn-colors-red-600) / var(--un-text-opacity));}.text-rose-500{--un-text-opacity:1;color:rgb(244 63 94 / var(--un-text-opacity));}.text-white{--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));}.text-yellow-600{--un-text-opacity:1;color:rgb(var(--cn-colors-yellow-600) / var(--un-text-opacity));}.hover\:text-error-400:hover{--un-text-opacity:1;color:rgb(var(--cn-colors-error-400) / var(--un-text-opacity));}.hover\:text-primary-400:hover{--un-text-opacity:1;color:rgb(var(--cn-colors-primary-400) / var(--un-text-opacity));}.hover\:text-primary-600:hover{--un-text-opacity:1;color:rgb(var(--cn-colors-primary-600) / var(--un-text-opacity));}.hover\:text-primary-800:hover{--un-text-opacity:1;color:rgb(var(--cn-colors-primary-800) / var(--un-text-opacity));}.font-400{font-weight:400;}.font-bold{font-weight:700;}.font-light{font-weight:300;}.leading-\[0\]{line-height:0;}.leading-\[2\.3\]{line-height:2.3;}.tracking-\[0\.125em\]{letter-spacing:0.125em;}.write-vertical-right{writing-mode:vertical-rl;}.opacity-0{opacity:0;}.opacity-50{opacity:0.5;}.opacity-70{opacity:0.7;}.hover\:opacity-100:hover{opacity:1;}.hover\:opacity-50:hover{opacity:0.5;}.shadow-1{--un-shadow:var(--un-shadow-inset) 0 1px 2px -2px var(--un-shadow-color, rgb(0 0 0 / 0.16)),var(--un-shadow-inset) 0 3px 6px 0px var(--un-shadow-color, rgb(0 0 0 / 0.12)),var(--un-shadow-inset) 0 5px 12px 4px var(--un-shadow-color, rgb(0 0 0 / 0.09));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}.shadow-2{--un-shadow:var(--un-shadow-inset) 0 3px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.12)),var(--un-shadow-inset) 0 6px 16px 0px var(--un-shadow-color, rgb(0 0 0 / 0.08)),var(--un-shadow-inset) 0 9px 28px 8px var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}.shadow-2xl{--un-shadow:var(--un-shadow-inset) 0 25px 50px -12px var(--un-shadow-color, rgb(0 0 0 / 0.25));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}.shadow-3{--un-shadow:var(--un-shadow-inset) 0 6px 16px -8px var(--un-shadow-color, rgb(0 0 0 / 0.08)),var(--un-shadow-inset) 0 9px 28px 0px var(--un-shadow-color, rgb(0 0 0 / 0.05)),var(--un-shadow-inset) 0 12px 48px 16px var(--un-shadow-color, rgb(0 0 0 / 0.03));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}.shadow-lg{--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}.outline-none{outline:2px solid transparent;outline-offset:2px;}.filter{filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia);}.backdrop-filter{-webkit-backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);backdrop-filter:var(--un-backdrop-blur) var(--un-backdrop-brightness) var(--un-backdrop-contrast) var(--un-backdrop-grayscale) var(--un-backdrop-hue-rotate) var(--un-backdrop-invert) var(--un-backdrop-opacity) var(--un-backdrop-saturate) var(--un-backdrop-sepia);}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;}.transition-color{transition-property:color;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;}.duration-300{transition-duration:300ms;}.ease,.ease-in-out{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);}.ease-in{transition-timing-function:cubic-bezier(0.4, 0, 1, 1);}.ease-out{transition-timing-function:cubic-bezier(0, 0, 0.2, 1);}.bg-design-primary{background-color:var(--cn-bg-design-primary-0);}.bg-design-primary-elevated{background-color:var(--cn-bg-design-primary-elevated-0);}.bg-design-secondary{background-color:var(--cn-bg-design-secondary-0);}.bg-design-secondary-elevated{background-color:var(--cn-bg-design-secondary-elevated-0);}.bg-design-tertiary{background-color:var(--cn-bg-design-tertiary-0);}.bg-design-tertiary-elevated{background-color:var(--cn-bg-design-tertiary-elevated-0);}.bg-design-floating{background-color:var(--cn-bg-design-floating-0);}.border-design-separator{border-color:var(--cn-border-design-separator-0);}.text-design-primary{color:var(--cn-text-design-primary-0);}.text-design-secondary{color:var(--cn-text-design-secondary-0);}.text-design-tertiary{color:var(--cn-text-design-tertiary-0);}.text-design-quarternary{color:var(--cn-text-design-quarternary-0);}.bg-design-thick{background-color:var(--cn-bg-design-thick-0);backdrop-filter:var(--cn-bg-design-thick-1);border:var(--cn-bg-design-thick-2);}.bg-design-regular{background-color:var(--cn-bg-design-regular-0);backdrop-filter:var(--cn-bg-design-regular-1);border:var(--cn-bg-design-regular-2);}.bg-design-thin{background-color:var(--cn-bg-design-thin-0);backdrop-filter:var(--cn-bg-design-thin-1);border:var(--cn-bg-design-thin-2);}.bg-design-ultra-thin{background-color:var(--cn-bg-design-ultra-thin-0);backdrop-filter:var(--cn-bg-design-ultra-thin-1);border:var(--cn-bg-design-ultra-thin-2);}.indent-none{indent:0;}