:root{--white: oklch(100% 0 0);--off-white: oklch(98% .005 0 / .8);--light-gray: oklch(90% .01 0);--mid-gray: oklch(70% .02 0);--dark-gray: oklch(25% .02 0);--teal: oklch(75% .18 170);--pink: oklch(75% .17 20);--purple: oklch(70% .16 290);--teal-light: oklch(85% .12 170);--pink-light: oklch(85% .11 20);--purple-light: oklch(80% .1 290);--main: var(--teal);--main-light: var(--teal-light);--md-background: oklch(100% 0 0);--shadow: 0 4px 8px rgba(0, 0, 0, .04), 0 2px 4px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .02);--shadow-lg: 0 12px 24px rgba(0, 0, 0, .16);--shadow-hover: 0 12px 24px rgba(0, 0, 0, .08), 0 6px 12px rgba(0, 0, 0, .1), 0 3px 6px rgba(0, 0, 0, .05);--shadow-main: 0 8px 16px oklch(from var(--main) l c h / .25), 0 4px 8px oklch(from var(--main) l c h / .2), 0 2px 4px oklch(from var(--main) l c h / .3);--border: 1px solid var(--light-gray);--border-radius-sm: 8px;--border-radius: 12px;--border-radius-lg: 16px;--transition-fast: all .2s cubic-bezier(.4, 0, .2, 1);--transition: all .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: all .5s cubic-bezier(.4, 0, .2, 1);--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--width: 1200px;--width-sm: 768px;--delay: 0s}@media(prefers-color-scheme:dark){:root{--white: oklch(15% 0 0);--off-white: oklch(20% .01 0 / .8);--light-gray: oklch(30% .02 0);--mid-gray: oklch(60% .02 0);--dark-gray: oklch(90% 0 0);--md-background: oklch(18% .01 0)}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{scroll-behavior:smooth;font-size:16px}body{margin:0;padding:0;background:var(--white);color:var(--dark-gray);font-family:Inter,PingFang SC,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";line-height:1.7;position:relative;overflow-x:hidden;text-shadow:0 1px 2px rgba(0,0,0,.05)}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 20% 30%,var(--pink-light) 0%,transparent 40%),radial-gradient(circle at 80% 70%,var(--teal-light) 0%,transparent 40%),radial-gradient(circle at 40% 80%,var(--purple-light) 0%,transparent 40%);animation:shiftColors 10s infinite alternate ease-in-out;will-change:filter,opacity;pointer-events:none;opacity:.4;z-index:-1}@keyframes shiftColors{0%{filter:hue-rotate(0deg) opacity(.5)}to{filter:hue-rotate(30deg) opacity(1)}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--off-white);border-radius:6px}::-webkit-scrollbar-thumb{background:var(--light-gray);border-radius:6px;transition:var(--transition)}::-webkit-scrollbar-thumb:hover{background:var(--mid-gray)}::-webkit-scrollbar-button{display:none}::selection{background:var(--main-light);color:var(--dark-gray)}:focus-visible{outline:2px solid var(--main);outline-offset:2px;border-radius:var(--border-radius-sm)}a{color:var(--main);text-decoration:none;transition:var(--transition-fast)}a:hover{color:var(--main-light);text-decoration:none}a:focus-visible{outline:2px solid var(--main);outline-offset:2px;border-radius:2px}h1,h2,h3,h4,h5,h6{color:var(--dark-gray);margin-top:0;line-height:1.3}.page-enter-active,.page-leave-active{transition:var(--transition)}.page-enter-from,.page-leave-to{opacity:0;transform:scale(.95)}.list-enter-from{opacity:0;transform:translateY(30px) scale(.95)}.list-enter-active{transition:all .3s ease var(--delay, 0s)}.list-leave-active{opacity:0;position:fixed}.list-move{transition:transform .3s ease}.cool-title{color:transparent;-webkit-text-fill-color:transparent;background:linear-gradient(135deg,var(--pink),var(--teal),var(--pink)) repeat;background-size:200% 100%;background-clip:text;-webkit-background-clip:text;animation:subtleFlow 5s linear infinite;text-shadow:0 2px 4px rgba(0,0,0,.1);will-change:background-position}@keyframes subtleFlow{0%{background-position:0 0}to{background-position:200% 100%}}img[data-loading=true]{background:linear-gradient(90deg,var(--off-white) 25%,var(--light-gray) 50%,var(--off-white) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.demo-block[data-v-84509da6]{margin:var(--spacing-lg) 0;border:var(--border);border-radius:6px;overflow:hidden;background:var(--off-white)}.demo-title[data-v-84509da6]{font-size:.875rem;font-weight:600;padding:var(--spacing-sm) var(--spacing);background:var(--off-white);color:var(--dark-gray);border-bottom:var(--border)}
