{"html":"\n \n\n \n\n \n Start session\n\n \n \n \n \n\n","css":".absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.left-0 {\n left: 0px;\n}\n.top-0 {\n top: 0px;\n}\n.-mr-1 {\n margin-right: -0.25rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.flex {\n display: flex;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-full {\n height: 100%;\n}\n.w-5 {\n width: 1.25rem;\n}\n.w-full {\n width: 100%;\n}\n.-translate-y-1 {\n --tw-translate-y: -0.25rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.translate-y-0\\.5 {\n --tw-translate-y: 0.125rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.select-none {\n -webkit-user-select: none;\n user-select: none;\n}\n.items-center {\n align-items: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-3 {\n gap: 0.75rem;\n}\n.rounded-lg {\n border-radius: 0.5rem;\n}\n.border-none {\n border-style: none;\n}\n.bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity));\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-opacity-25 {\n --tw-bg-opacity: 0.25;\n}\n.bg-gradient-to-l {\n background-image: linear-gradient(to left, var(--tw-gradient-stops));\n}\n.bg-gradient-to-r {\n background-image: linear-gradient(to right, var(--tw-gradient-stops));\n}\n.from-\\[\\#f27121\\] {\n --tw-gradient-from: #f27121 var(--tw-gradient-from-position);\n --tw-gradient-to: rgb(242 113 33 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\n.from-\\[hsl\\(217\\2c 33\\%\\2c 16\\%\\)\\] {\n --tw-gradient-from: hsl(217, 33%, 16%) var(--tw-gradient-from-position);\n --tw-gradient-to: hsl(217 33% 16% / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\n.via-\\[\\#e94057\\] {\n --tw-gradient-to: rgb(233 64 87 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from),\n #e94057 var(--tw-gradient-via-position), var(--tw-gradient-to);\n}\n.via-\\[hsl\\(217\\2c 33\\%\\2c 32\\%\\)\\] {\n --tw-gradient-to: hsl(217 33% 32% / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from),\n hsl(217, 33%, 32%) var(--tw-gradient-via-position), var(--tw-gradient-to);\n}\n.to-\\[\\#8a2387\\] {\n --tw-gradient-to: #8a2387 var(--tw-gradient-to-position);\n}\n.to-\\[hsl\\(217\\2c 33\\%\\2c 16\\%\\)\\] {\n --tw-gradient-to: hsl(217, 33%, 16%) var(--tw-gradient-to-position);\n}\n.p-0 {\n padding: 0px;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n}\n.font-mono {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,\n \"Liberation Mono\", \"Courier New\", monospace;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.font-light {\n font-weight: 300;\n}\n.uppercase {\n text-transform: uppercase;\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.outline-none {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.brightness-100 {\n --tw-brightness: brightness(1);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)\n var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate)\n var(--tw-sepia) var(--tw-drop-shadow);\n}\n.transition {\n transition-property:\n color,\n background-color,\n border-color,\n fill,\n stroke,\n opacity,\n box-shadow,\n transform,\n filter,\n -webkit-text-decoration-color,\n -webkit-backdrop-filter;\n transition-property: color, background-color, border-color,\n text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,\n backdrop-filter;\n transition-property:\n color,\n background-color,\n border-color,\n text-decoration-color,\n fill,\n stroke,\n opacity,\n box-shadow,\n transform,\n filter,\n backdrop-filter,\n -webkit-text-decoration-color,\n -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-\\[600ms\\] {\n transition-duration: 600ms;\n}\n.ease-\\[cubic-bezier\\(0\\.3\\2c 0\\.7\\2c 0\\.4\\2c 1\\)\\] {\n transition-timing-function: cubic-bezier(0.3, 0.7, 0.4, 1);\n}\n.group:hover .group-hover\\:-translate-y-1\\.5 {\n --tw-translate-y: -0.375rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.group:hover .group-hover\\:translate-x-1 {\n --tw-translate-x: 0.25rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.group:hover .group-hover\\:translate-y-1 {\n --tw-translate-y: 0.25rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.group:hover .group-hover\\:brightness-110 {\n --tw-brightness: brightness(1.1);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)\n var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate)\n var(--tw-sepia) var(--tw-drop-shadow);\n}\n.group:hover .group-hover\\:duration-\\[250ms\\] {\n transition-duration: 250ms;\n}\n.group:active .group-active\\:-translate-y-0\\.5 {\n --tw-translate-y: -0.125rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.group:active .group-active\\:translate-y-px {\n --tw-translate-y: 1px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n"}

little-puma-84

👁 实时预览

📝 源代码