design-pact 0.2.1 → 0.3.0

package/web/_next/static/chunks/0ge~kyq7lzl~5.js

@@ -0,0 +1,187 @@
+(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,31713,e=>{"use strict";let t,r,a,i;var s=e.i(43476),l=e.i(71645),n="1.3.23";function o(e,t,r){return Math.max(e,Math.min(t,r))}var d=class{isRunning=!1;value=0;from=0;to=0;currentTime=0;lerp;duration;easing;onUpdate;advance(e){if(!this.isRunning)return;let t=!1;if(this.duration&&this.easing){this.currentTime+=e;let r=o(0,this.currentTime/this.duration,1),a=(t=r>=1)?1:this.easing(r);this.value=this.from+(this.to-this.from)*a}else if(this.lerp){var r,a,i,s;this.value=(r=this.value,a=this.to,i=60*this.lerp,(1-(s=1-Math.exp(-i*e)))*r+s*a),Math.round(this.value)===Math.round(this.to)&&(this.value=this.to,t=!0)}else this.value=this.to,t=!0;t&&this.stop(),this.onUpdate?.(this.value,t)}stop(){this.isRunning=!1}fromTo(e,t,{lerp:r,duration:a,easing:i,onStart:s,onUpdate:l}){this.from=this.value=e,this.to=t,this.lerp=r,this.duration=a,this.easing=i,this.currentTime=0,this.isRunning=!0,s?.(),this.onUpdate=l}},c=class{width=0;height=0;scrollHeight=0;scrollWidth=0;debouncedResize;wrapperResizeObserver;contentResizeObserver;constructor(e,t,{autoResize:r=!0,debounce:a=250}={}){this.wrapper=e,this.content=t,r&&(this.debouncedResize=function(e,t){let r;return function(...a){clearTimeout(r),r=setTimeout(()=>{r=void 0,e.apply(this,a)},t)}}(this.resize,a),this.wrapper instanceof Window?window.addEventListener("resize",this.debouncedResize):(this.wrapperResizeObserver=new ResizeObserver(this.debouncedResize),this.wrapperResizeObserver.observe(this.wrapper)),this.contentResizeObserver=new ResizeObserver(this.debouncedResize),this.contentResizeObserver.observe(this.content)),this.resize()}destroy(){this.wrapperResizeObserver?.disconnect(),this.contentResizeObserver?.disconnect(),this.wrapper===window&&this.debouncedResize&&window.removeEventListener("resize",this.debouncedResize)}resize=()=>{this.onWrapperResize(),this.onContentResize()};onWrapperResize=()=>{this.wrapper instanceof Window?(this.width=window.innerWidth,this.height=window.innerHeight):(this.width=this.wrapper.clientWidth,this.height=this.wrapper.clientHeight)};onContentResize=()=>{this.wrapper instanceof Window?(this.scrollHeight=this.content.scrollHeight,this.scrollWidth=this.content.scrollWidth):(this.scrollHeight=this.wrapper.scrollHeight,this.scrollWidth=this.wrapper.scrollWidth)};get limit(){return{x:this.scrollWidth-this.width,y:this.scrollHeight-this.height}}},h=class{events={};emit(e,...t){let r=this.events[e]||[];for(let e=0,a=r.length;e<a;e++)r[e]?.(...t)}on(e,t){return this.events[e]?this.events[e].push(t):this.events[e]=[t],()=>{this.events[e]=this.events[e]?.filter(e=>t!==e)}}off(e,t){this.events[e]=this.events[e]?.filter(e=>t!==e)}destroy(){this.events={}}};let u=100/6,x={passive:!1};function p(e,t){return 1===e?u:2===e?t:1}var m=class{touchStart={x:0,y:0};lastDelta={x:0,y:0};window={width:0,height:0};emitter=new h;constructor(e,t={wheelMultiplier:1,touchMultiplier:1}){this.element=e,this.options=t,window.addEventListener("resize",this.onWindowResize),this.onWindowResize(),this.element.addEventListener("wheel",this.onWheel,x),this.element.addEventListener("touchstart",this.onTouchStart,x),this.element.addEventListener("touchmove",this.onTouchMove,x),this.element.addEventListener("touchend",this.onTouchEnd,x)}on(e,t){return this.emitter.on(e,t)}destroy(){this.emitter.destroy(),window.removeEventListener("resize",this.onWindowResize),this.element.removeEventListener("wheel",this.onWheel,x),this.element.removeEventListener("touchstart",this.onTouchStart,x),this.element.removeEventListener("touchmove",this.onTouchMove,x),this.element.removeEventListener("touchend",this.onTouchEnd,x)}onTouchStart=e=>{let{clientX:t,clientY:r}=e.targetTouches?e.targetTouches[0]:e;this.touchStart.x=t,this.touchStart.y=r,this.lastDelta={x:0,y:0},this.emitter.emit("scroll",{deltaX:0,deltaY:0,event:e})};onTouchMove=e=>{let{clientX:t,clientY:r}=e.targetTouches?e.targetTouches[0]:e,a=-(t-this.touchStart.x)*this.options.touchMultiplier,i=-(r-this.touchStart.y)*this.options.touchMultiplier;this.touchStart.x=t,this.touchStart.y=r,this.lastDelta={x:a,y:i},this.emitter.emit("scroll",{deltaX:a,deltaY:i,event:e})};onTouchEnd=e=>{this.emitter.emit("scroll",{deltaX:this.lastDelta.x,deltaY:this.lastDelta.y,event:e})};onWheel=e=>{let{deltaX:t,deltaY:r,deltaMode:a}=e,i=p(a,this.window.width),s=p(a,this.window.height);t*=i,r*=s,t*=this.options.wheelMultiplier,r*=this.options.wheelMultiplier,this.emitter.emit("scroll",{deltaX:t,deltaY:r,event:e})};onWindowResize=()=>{this.window={width:window.innerWidth,height:window.innerHeight}}};let f=e=>Math.min(1,1.001-2**(-10*e));var g=class{_isScrolling=!1;_isStopped=!1;_isLocked=!1;_preventNextNativeScrollEvent=!1;_resetVelocityTimeout=null;_rafId=null;isTouching;time=0;userData={};lastVelocity=0;velocity=0;direction=0;options;targetScroll;animatedScroll;animate=new d;emitter=new h;dimensions;virtualScroll;constructor({wrapper:e=window,content:t=document.documentElement,eventsTarget:r=e,smoothWheel:a=!0,syncTouch:i=!1,syncTouchLerp:s=.075,touchInertiaExponent:l=1.7,duration:o,easing:d,lerp:h=.1,infinite:u=!1,orientation:x="vertical",gestureOrientation:p="horizontal"===x?"both":"vertical",touchMultiplier:g=1,wheelMultiplier:b=1,autoResize:y=!0,prevent:v,virtualScroll:w,overscroll:j=!0,autoRaf:k=!1,anchors:N=!1,autoToggle:M=!1,allowNestedScroll:$=!1,__experimental__naiveDimensions:S=!1,naiveDimensions:z=S,stopInertiaOnNavigate:C=!1}={}){window.lenisVersion=n,window.lenis||(window.lenis={}),window.lenis.version=n,"horizontal"===x&&(window.lenis.horizontal=!0),!0===i&&(window.lenis.touch=!0),e&&e!==document.documentElement||(e=window),"number"==typeof o&&"function"!=typeof d?d=f:"function"==typeof d&&"number"!=typeof o&&(o=1),this.options={wrapper:e,content:t,eventsTarget:r,smoothWheel:a,syncTouch:i,syncTouchLerp:s,touchInertiaExponent:l,duration:o,easing:d,lerp:h,infinite:u,gestureOrientation:p,orientation:x,touchMultiplier:g,wheelMultiplier:b,autoResize:y,prevent:v,virtualScroll:w,overscroll:j,autoRaf:k,anchors:N,autoToggle:M,allowNestedScroll:$,naiveDimensions:z,stopInertiaOnNavigate:C},this.dimensions=new c(e,t,{autoResize:y}),this.updateClassName(),this.targetScroll=this.animatedScroll=this.actualScroll,this.options.wrapper.addEventListener("scroll",this.onNativeScroll),this.options.wrapper.addEventListener("scrollend",this.onScrollEnd,{capture:!0}),(this.options.anchors||this.options.stopInertiaOnNavigate)&&this.options.wrapper.addEventListener("click",this.onClick),this.options.wrapper.addEventListener("pointerdown",this.onPointerDown),this.virtualScroll=new m(r,{touchMultiplier:g,wheelMultiplier:b}),this.virtualScroll.on("scroll",this.onVirtualScroll),this.options.autoToggle&&(this.checkOverflow(),this.rootElement.addEventListener("transitionend",this.onTransitionEnd)),this.options.autoRaf&&(this._rafId=requestAnimationFrame(this.raf))}destroy(){this.emitter.destroy(),this.options.wrapper.removeEventListener("scroll",this.onNativeScroll),this.options.wrapper.removeEventListener("scrollend",this.onScrollEnd,{capture:!0}),this.options.wrapper.removeEventListener("pointerdown",this.onPointerDown),(this.options.anchors||this.options.stopInertiaOnNavigate)&&this.options.wrapper.removeEventListener("click",this.onClick),this.virtualScroll.destroy(),this.dimensions.destroy(),this.cleanUpClassName(),this._rafId&&cancelAnimationFrame(this._rafId)}on(e,t){return this.emitter.on(e,t)}off(e,t){return this.emitter.off(e,t)}onScrollEnd=e=>{e instanceof CustomEvent||"smooth"!==this.isScrolling&&!1!==this.isScrolling||e.stopPropagation()};dispatchScrollendEvent=()=>{this.options.wrapper.dispatchEvent(new CustomEvent("scrollend",{bubbles:this.options.wrapper===window,detail:{lenisScrollEnd:!0}}))};get overflow(){let e=this.isHorizontal?"overflow-x":"overflow-y";return getComputedStyle(this.rootElement)[e]}checkOverflow(){["hidden","clip"].includes(this.overflow)?this.internalStop():this.internalStart()}onTransitionEnd=e=>{e.propertyName?.includes("overflow")&&e.target===this.rootElement&&this.checkOverflow()};setScroll(e){this.isHorizontal?this.options.wrapper.scrollTo({left:e,behavior:"instant"}):this.options.wrapper.scrollTo({top:e,behavior:"instant"})}onClick=e=>{let t=e.composedPath().filter(e=>e instanceof HTMLAnchorElement&&e.href).map(e=>new URL(e.href)),r=new URL(window.location.href);if(this.options.anchors){let e=t.find(e=>r.host===e.host&&r.pathname===e.pathname&&e.hash);if(e){let t="object"==typeof this.options.anchors&&this.options.anchors?this.options.anchors:void 0,r=`#${e.hash.split("#")[1]}`;this.scrollTo(r,t);return}}if(this.options.stopInertiaOnNavigate&&t.some(e=>r.host===e.host&&r.pathname!==e.pathname))return void this.reset()};onPointerDown=e=>{1===e.button&&this.reset()};onVirtualScroll=e=>{if("function"==typeof this.options.virtualScroll&&!1===this.options.virtualScroll(e))return;let{deltaX:t,deltaY:r,event:a}=e;if(this.emitter.emit("virtual-scroll",{deltaX:t,deltaY:r,event:a}),a.ctrlKey||a.lenisStopPropagation)return;let i=a.type.includes("touch"),s=a.type.includes("wheel");this.isTouching="touchstart"===a.type||"touchmove"===a.type;let l=0===t&&0===r;if(this.options.syncTouch&&i&&"touchstart"===a.type&&l&&!this.isStopped&&!this.isLocked)return void this.reset();let n="vertical"===this.options.gestureOrientation&&0===r||"horizontal"===this.options.gestureOrientation&&0===t;if(l||n)return;let o=a.composedPath();o=o.slice(0,o.indexOf(this.rootElement));let d=this.options.prevent,c=Math.abs(t)>=Math.abs(r)?"horizontal":"vertical";if(o.find(e=>e instanceof HTMLElement&&("function"==typeof d&&d?.(e)||e.hasAttribute?.("data-lenis-prevent")||"vertical"===c&&e.hasAttribute?.("data-lenis-prevent-vertical")||"horizontal"===c&&e.hasAttribute?.("data-lenis-prevent-horizontal")||i&&e.hasAttribute?.("data-lenis-prevent-touch")||s&&e.hasAttribute?.("data-lenis-prevent-wheel")||this.options.allowNestedScroll&&this.hasNestedScroll(e,{deltaX:t,deltaY:r}))))return;if(this.isStopped||this.isLocked){a.cancelable&&a.preventDefault();return}if(!(this.options.syncTouch&&i||this.options.smoothWheel&&s)){this.isScrolling="native",this.animate.stop(),a.lenisStopPropagation=!0;return}let h=r;"both"===this.options.gestureOrientation?h=Math.abs(r)>Math.abs(t)?r:t:"horizontal"===this.options.gestureOrientation&&(h=t),(!this.options.overscroll||this.options.infinite||this.options.wrapper!==window&&this.limit>0&&(this.animatedScroll>0&&this.animatedScroll<this.limit||0===this.animatedScroll&&r>0||this.animatedScroll===this.limit&&r<0))&&(a.lenisStopPropagation=!0),a.cancelable&&a.preventDefault();let u=i&&this.options.syncTouch,x=i&&"touchend"===a.type;x&&(h=Math.sign(h)*Math.abs(this.velocity)**this.options.touchInertiaExponent),this.scrollTo(this.targetScroll+h,{programmatic:!1,...u?{lerp:x?this.options.syncTouchLerp:1}:{lerp:this.options.lerp,duration:this.options.duration,easing:this.options.easing}})};resize(){this.dimensions.resize(),this.animatedScroll=this.targetScroll=this.actualScroll,this.emit()}emit(){this.emitter.emit("scroll",this)}onNativeScroll=()=>{if(null!==this._resetVelocityTimeout&&(clearTimeout(this._resetVelocityTimeout),this._resetVelocityTimeout=null),this._preventNextNativeScrollEvent){this._preventNextNativeScrollEvent=!1;return}if(!1===this.isScrolling||"native"===this.isScrolling){let e=this.animatedScroll;this.animatedScroll=this.targetScroll=this.actualScroll,this.lastVelocity=this.velocity,this.velocity=this.animatedScroll-e,this.direction=Math.sign(this.animatedScroll-e),this.isStopped||(this.isScrolling="native"),this.emit(),0!==this.velocity&&(this._resetVelocityTimeout=setTimeout(()=>{this.lastVelocity=this.velocity,this.velocity=0,this.isScrolling=!1,this.emit()},400))}};reset(){this.isLocked=!1,this.isScrolling=!1,this.animatedScroll=this.targetScroll=this.actualScroll,this.lastVelocity=this.velocity=0,this.animate.stop()}start(){if(this.isStopped){if(this.options.autoToggle)return void this.rootElement.style.removeProperty("overflow");this.internalStart()}}internalStart(){this.isStopped&&(this.reset(),this.isStopped=!1,this.emit())}stop(){if(!this.isStopped){if(this.options.autoToggle)return void this.rootElement.style.setProperty("overflow","clip");this.internalStop()}}internalStop(){this.isStopped||(this.reset(),this.isStopped=!0,this.emit())}raf=e=>{let t=e-(this.time||e);this.time=e,this.animate.advance(.001*t),this.options.autoRaf&&(this._rafId=requestAnimationFrame(this.raf))};scrollTo(e,{offset:t=0,immediate:r=!1,lock:a=!1,programmatic:i=!0,lerp:s=i?this.options.lerp:void 0,duration:l=i?this.options.duration:void 0,easing:n=i?this.options.easing:void 0,onStart:d,onComplete:c,force:h=!1,userData:u}={}){if((this.isStopped||this.isLocked)&&!h)return;let x=e,p=t;if("string"==typeof x&&["top","left","start","#"].includes(x))x=0;else if("string"==typeof x&&["bottom","right","end"].includes(x))x=this.limit;else{let e=null;if("string"==typeof x?(e=document.querySelector(x))||("#top"===x?x=0:console.warn("Lenis: Target not found",x)):x instanceof HTMLElement&&x?.nodeType&&(e=x),e){if(this.options.wrapper!==window){let e=this.rootElement.getBoundingClientRect();p-=this.isHorizontal?e.left:e.top}let t=e.getBoundingClientRect(),r=getComputedStyle(e),a=this.isHorizontal?Number.parseFloat(r.scrollMarginLeft):Number.parseFloat(r.scrollMarginTop),i=getComputedStyle(this.rootElement),s=this.isHorizontal?Number.parseFloat(i.scrollPaddingLeft):Number.parseFloat(i.scrollPaddingTop);x=(this.isHorizontal?t.left:t.top)+this.animatedScroll-(Number.isNaN(a)?0:a)-(Number.isNaN(s)?0:s)}}if("number"==typeof x){if(x+=p,this.options.infinite){if(i){this.targetScroll=this.animatedScroll=this.scroll;let e=x-this.animatedScroll;e>this.limit/2?x-=this.limit:e<-this.limit/2&&(x+=this.limit)}}else x=o(0,x,this.limit);if(x===this.targetScroll){d?.(this),c?.(this);return}if(this.userData=u??{},r){this.animatedScroll=this.targetScroll=x,this.setScroll(this.scroll),this.reset(),this.preventNextNativeScrollEvent(),this.emit(),c?.(this),this.userData={},requestAnimationFrame(()=>{this.dispatchScrollendEvent()});return}i||(this.targetScroll=x),"number"==typeof l&&"function"!=typeof n?n=f:"function"==typeof n&&"number"!=typeof l&&(l=1),this.animate.fromTo(this.animatedScroll,x,{duration:l,easing:n,lerp:s,onStart:()=>{a&&(this.isLocked=!0),this.isScrolling="smooth",d?.(this)},onUpdate:(e,t)=>{this.isScrolling="smooth",this.lastVelocity=this.velocity,this.velocity=e-this.animatedScroll,this.direction=Math.sign(this.velocity),this.animatedScroll=e,this.setScroll(this.scroll),i&&(this.targetScroll=e),t||this.emit(),t&&(this.reset(),this.emit(),c?.(this),this.userData={},requestAnimationFrame(()=>{this.dispatchScrollendEvent()}),this.preventNextNativeScrollEvent())}})}}preventNextNativeScrollEvent(){this._preventNextNativeScrollEvent=!0,requestAnimationFrame(()=>{this._preventNextNativeScrollEvent=!1})}hasNestedScroll(e,{deltaX:t,deltaY:r}){let a,i,s,l,n,o,d,c,h,u,x,p,m,f,g,b,y=Date.now();e._lenis||(e._lenis={});let v=e._lenis;if(y-(v.time??0)>2e3){v.time=Date.now();let t=window.getComputedStyle(e);if(v.computedStyle=t,a=["auto","overlay","scroll"].includes(t.overflowX),i=["auto","overlay","scroll"].includes(t.overflowY),n=["auto"].includes(t.overscrollBehaviorX),o=["auto"].includes(t.overscrollBehaviorY),v.hasOverflowX=a,v.hasOverflowY=i,!(a||i))return!1;d=e.scrollWidth,c=e.scrollHeight,h=e.clientWidth,u=e.clientHeight,s=d>h,l=c>u,v.isScrollableX=s,v.isScrollableY=l,v.scrollWidth=d,v.scrollHeight=c,v.clientWidth=h,v.clientHeight=u,v.hasOverscrollBehaviorX=n,v.hasOverscrollBehaviorY=o}else s=v.isScrollableX,l=v.isScrollableY,a=v.hasOverflowX,i=v.hasOverflowY,d=v.scrollWidth,c=v.scrollHeight,h=v.clientWidth,u=v.clientHeight,n=v.hasOverscrollBehaviorX,o=v.hasOverscrollBehaviorY;if(!(a&&s||i&&l))return!1;let w=Math.abs(t)>=Math.abs(r)?"horizontal":"vertical";if("horizontal"===w)x=Math.round(e.scrollLeft),p=d-h,m=t,f=a,g=s,b=n;else{if("vertical"!==w)return!1;x=Math.round(e.scrollTop),p=c-u,m=r,f=i,g=l,b=o}return!b&&(x>=p||x<=0)||(m>0?x<p:x>0)&&f&&g}get rootElement(){return this.options.wrapper===window?document.documentElement:this.options.wrapper}get limit(){return this.options.naiveDimensions?this.isHorizontal?this.rootElement.scrollWidth-this.rootElement.clientWidth:this.rootElement.scrollHeight-this.rootElement.clientHeight:this.dimensions.limit[this.isHorizontal?"x":"y"]}get isHorizontal(){return"horizontal"===this.options.orientation}get actualScroll(){let e=this.options.wrapper;return this.isHorizontal?e.scrollX??e.scrollLeft:e.scrollY??e.scrollTop}get scroll(){var e;return this.options.infinite?(this.animatedScroll%(e=this.limit)+e)%e:this.animatedScroll}get progress(){return 0===this.limit?1:this.scroll/this.limit}get isScrolling(){return this._isScrolling}set isScrolling(e){this._isScrolling!==e&&(this._isScrolling=e,this.updateClassName())}get isStopped(){return this._isStopped}set isStopped(e){this._isStopped!==e&&(this._isStopped=e,this.updateClassName())}get isLocked(){return this._isLocked}set isLocked(e){this._isLocked!==e&&(this._isLocked=e,this.updateClassName())}get isSmooth(){return"smooth"===this.isScrolling}get className(){let e="lenis";return this.options.autoToggle&&(e+=" lenis-autoToggle"),this.isStopped&&(e+=" lenis-stopped"),this.isLocked&&(e+=" lenis-locked"),this.isScrolling&&(e+=" lenis-scrolling"),"smooth"===this.isScrolling&&(e+=" lenis-smooth"),e}updateClassName(){this.cleanUpClassName(),this.className.split(" ").forEach(e=>{this.rootElement.classList.add(e)})}cleanUpClassName(){for(let e of Array.from(this.rootElement.classList))("lenis"===e||e.startsWith("lenis-"))&&this.rootElement.classList.remove(e)}};let b=(0,l.createContext)(null),y=new class{listeners=[];constructor(e){this.state=e}set(e){for(let t of(this.state=e,this.listeners))t(this.state)}subscribe(e){return this.listeners=[...this.listeners,e],()=>{this.listeners=this.listeners.filter(t=>t!==e)}}get(){return this.state}}(null),v=(0,l.forwardRef)(({children:e,root:t=!1,options:r={},autoRaf:a=!0,className:i="",...n},o)=>{let d=(0,l.useRef)(null),c=(0,l.useRef)(null),[h,u]=(0,l.useState)(void 0);(0,l.useImperativeHandle)(o,()=>({wrapper:d.current,content:c.current,lenis:h}),[h]),(0,l.useEffect)(()=>{let e=new g({...r,...d.current&&c.current&&{wrapper:d.current,content:c.current},autoRaf:r?.autoRaf??a});return u(e),()=>{e.destroy(),u(void 0)}},[a,JSON.stringify({...r,wrapper:null,content:null})]);let x=(0,l.useRef)([]),p=(0,l.useCallback)((e,t)=>{x.current.push({callback:e,priority:t}),x.current.sort((e,t)=>e.priority-t.priority)},[]),m=(0,l.useCallback)(e=>{x.current=x.current.filter(t=>t.callback!==e)},[]);return((0,l.useEffect)(()=>{if(t&&h)return y.set({lenis:h,addCallback:p,removeCallback:m}),()=>y.set(null)},[t,h,p,m]),(0,l.useEffect)(()=>{if(!h)return;let e=e=>{for(let{callback:t}of x.current)t(e)};return h.on("scroll",e),()=>{h.off("scroll",e)}},[h]),e)?(0,s.jsx)(b.Provider,{value:{lenis:h,addCallback:p,removeCallback:m},children:t&&"asChild"!==t?e:(0,s.jsx)("div",{ref:d,className:`${i} ${h?.className??""}`.trim(),...n,children:(0,s.jsx)("div",{ref:c,children:e})})}):null}),w={};function j(e,t=[],r=0){let a=(0,l.useContext)(b),i=function(e){let[t,r]=(0,l.useState)(e.get());return(0,l.useEffect)(()=>e.subscribe(e=>r(e)),[e]),t}(y),{lenis:s,addCallback:n,removeCallback:o}=a??i??w;return(0,l.useEffect)(()=>{if(e&&n&&o&&s)return n(e,r),e(s),()=>{o(e)}},[s,n,o,r,...t,e]),s}let k=e=>{let t,r=new Set,a=(e,a)=>{let i="function"==typeof e?e(t):e;if(!Object.is(i,t)){let e=t;t=(null!=a?a:"object"!=typeof i||null===i)?i:Object.assign({},t,i),r.forEach(r=>r(t,e))}},i=()=>t,s={setState:a,getState:i,getInitialState:()=>l,subscribe:e=>(r.add(e),()=>r.delete(e))},l=t=e(a,i,s);return s},N=e=>{let t=e?k(e):k,r=e=>(function(e,t=e=>e){let r=l.default.useSyncExternalStore(e.subscribe,l.default.useCallback(()=>t(e.getState()),[e,t]),l.default.useCallback(()=>t(e.getInitialState()),[e,t]));return l.default.useDebugValue(r),r})(t,e);return Object.assign(r,t),r},M=e=>e?N(e):N,$=e=>t=>{try{let r=e(t);if(r instanceof Promise)return r;return{then:e=>$(e)(r),catch(e){return this}}}catch(e){return{then(e){return this},catch:t=>$(t)(e)}}},S=(e,t)=>(r,a,i)=>{let s,l={storage:function(e){let t;try{t=e()}catch(e){return}return{getItem:e=>{var r;let a=e=>null===e?null:JSON.parse(e,void 0),i=null!=(r=t.getItem(e))?r:null;return i instanceof Promise?i.then(a):a(i)},setItem:(e,r)=>t.setItem(e,JSON.stringify(r,void 0)),removeItem:e=>t.removeItem(e)}}(()=>window.localStorage),partialize:e=>e,version:0,merge:(e,t)=>({...t,...e}),...t},n=!1,o=0,d=new Set,c=new Set,h=l.storage;if(!h)return e((...e)=>{console.warn(`[zustand persist middleware] Unable to update item '${l.name}', the given storage is currently unavailable.`),r(...e)},a,i);let u=()=>{let e=l.partialize({...a()});return h.setItem(l.name,{state:e,version:l.version})},x=i.setState;i.setState=(e,t)=>(x(e,t),u());let p=e((...e)=>(r(...e),u()),a,i);i.getInitialState=()=>p;let m=()=>{var e,t;if(!h)return;let i=++o;n=!1,d.forEach(e=>{var t;return e(null!=(t=a())?t:p)});let x=(null==(t=l.onRehydrateStorage)?void 0:t.call(l,null!=(e=a())?e:p))||void 0;return $(h.getItem.bind(h))(l.name).then(e=>{if(e)if("number"!=typeof e.version||e.version===l.version)return[!1,e.state];else{if(l.migrate){let t=l.migrate(e.state,e.version);return t instanceof Promise?t.then(e=>[!0,e]):[!0,t]}console.error("State loaded from storage couldn't be migrated since no migrate function was provided")}return[!1,void 0]}).then(e=>{var t;if(i!==o)return;let[n,d]=e;if(r(s=l.merge(d,null!=(t=a())?t:p),!0),n)return u()}).then(()=>{i===o&&(null==x||x(a(),void 0),s=a(),n=!0,c.forEach(e=>e(s)))}).catch(e=>{i===o&&(null==x||x(void 0,e))})};return i.persist={setOptions:e=>{l={...l,...e},e.storage&&(h=e.storage)},clearStorage:()=>{null==h||h.removeItem(l.name)},getOptions:()=>l,rehydrate:()=>m(),hasHydrated:()=>n,onHydrate:e=>(d.add(e),()=>{d.delete(e)}),onFinishHydration:e=>(c.add(e),()=>{c.delete(e)})},l.skipHydration||m(),s||p},z=[{name:"xxs",mul:1},{name:"xs",mul:2},{name:"sm",mul:3},{name:"md",mul:4},{name:"lg",mul:6},{name:"xl",mul:8},{name:"xxl",mul:12},{name:"section",mul:24}],C=[{name:"sm",mul:.5},{name:"md",mul:1},{name:"lg",mul:1.5},{name:"xl",mul:2},{name:"full",px:9999}];function E(e){return z.map(({name:t,mul:r})=>({name:t,px:Math.round(e*r*100)/100}))}function L(e){return C.map(t=>({name:t.name,px:"px"in t?t.px:Math.round(e*t.mul*100)/100}))}let F={sm:{blur:4,offsetY:1,opacity:.04},md:{blur:12,offsetY:4,opacity:.08},lg:{blur:24,offsetY:8,opacity:.12}};function H(e){let t=Math.max(0,2*e),r=e=>({blur:Math.round(e.blur*t),offsetY:Math.round(e.offsetY*t*10)/10,opacity:Math.round(e.opacity*t*1e3)/1e3});return{sm:r(F.sm),md:r(F.md),lg:r(F.lg)}}function I(e){return`0 ${e.offsetY}px ${e.blur}px 0 rgba(0,0,0,${e.opacity.toFixed(3)})`}let R=[{name:"micro",mul:.4},{name:"fast",mul:.75},{name:"normal",mul:1},{name:"slow",mul:1.5},{name:"page",mul:2.5}];function T(e){return R.map(({name:t,mul:r})=>({name:t,ms:Math.round(e*r)}))}let O={"ease-out":"cubic-bezier(0.0, 0, 0.2, 1)","ease-in-out":"cubic-bezier(0.4, 0, 0.2, 1)",spring:"cubic-bezier(0.34, 1.56, 0.64, 1)",linear:"linear","ease-in":"cubic-bezier(0.4, 0, 1, 1)"};function W(e){return[{name:"default",px:e},{name:"strong",px:Math.round(2*e*2)/2}]}function _(e){return Math.min(900,Math.max(e+300,600))}function D(e){return Math.min(900,e+200)}function B(e){let t=e=>Math.round(1e3*e)/1e3;return[{name:"hover",value:t(e)},{name:"pressed",value:t(1.5*e)},{name:"focus",value:t(2*e)},{name:"disabled",value:.38},{name:"overlay",value:.5}]}let P=M()(S((e,t)=>({lang:"en",setLang:t=>e({lang:t}),toggle:()=>e({lang:"en"===t().lang?"zh":"en"})}),{name:"design-pact-lang",skipHydration:!0}));function A(){let e=P(e=>e.lang);return(t,r)=>"zh"===e?r:t}function U(e,t){return"zh"===P.getState().lang?t:e}let Y=(e,t)=>{if("number"==typeof e){if(3===t)return{mode:"rgb",r:(e>>8&15|e>>4&240)/255,g:(e>>4&15|240&e)/255,b:(15&e|e<<4&240)/255};if(4===t)return{mode:"rgb",r:(e>>12&15|e>>8&240)/255,g:(e>>8&15|e>>4&240)/255,b:(e>>4&15|240&e)/255,alpha:(15&e|e<<4&240)/255};if(6===t)return{mode:"rgb",r:(e>>16&255)/255,g:(e>>8&255)/255,b:(255&e)/255};if(8===t)return{mode:"rgb",r:(e>>24&255)/255,g:(e>>16&255)/255,b:(e>>8&255)/255,alpha:(255&e)/255}}},q={aliceblue:0xf0f8ff,antiquewhite:0xfaebd7,aqua:65535,aquamarine:8388564,azure:0xf0ffff,beige:0xf5f5dc,bisque:0xffe4c4,black:0,blanchedalmond:0xffebcd,blue:255,blueviolet:9055202,brown:0xa52a2a,burlywood:0xdeb887,cadetblue:6266528,chartreuse:8388352,chocolate:0xd2691e,coral:0xff7f50,cornflowerblue:6591981,cornsilk:0xfff8dc,crimson:0xdc143c,cyan:65535,darkblue:139,darkcyan:35723,darkgoldenrod:0xb8860b,darkgray:0xa9a9a9,darkgreen:25600,darkgrey:0xa9a9a9,darkkhaki:0xbdb76b,darkmagenta:9109643,darkolivegreen:5597999,darkorange:0xff8c00,darkorchid:0x9932cc,darkred:9109504,darksalmon:0xe9967a,darkseagreen:9419919,darkslateblue:4734347,darkslategray:3100495,darkslategrey:3100495,darkturquoise:52945,darkviolet:9699539,deeppink:0xff1493,deepskyblue:49151,dimgray:6908265,dimgrey:6908265,dodgerblue:2003199,firebrick:0xb22222,floralwhite:0xfffaf0,forestgreen:2263842,fuchsia:0xff00ff,gainsboro:0xdcdcdc,ghostwhite:0xf8f8ff,gold:0xffd700,goldenrod:0xdaa520,gray:8421504,green:32768,greenyellow:0xadff2f,grey:8421504,honeydew:0xf0fff0,hotpink:0xff69b4,indianred:0xcd5c5c,indigo:4915330,ivory:0xfffff0,khaki:0xf0e68c,lavender:0xe6e6fa,lavenderblush:0xfff0f5,lawngreen:8190976,lemonchiffon:0xfffacd,lightblue:0xadd8e6,lightcoral:0xf08080,lightcyan:0xe0ffff,lightgoldenrodyellow:0xfafad2,lightgray:0xd3d3d3,lightgreen:9498256,lightgrey:0xd3d3d3,lightpink:0xffb6c1,lightsalmon:0xffa07a,lightseagreen:2142890,lightskyblue:8900346,lightslategray:7833753,lightslategrey:7833753,lightsteelblue:0xb0c4de,lightyellow:0xffffe0,lime:65280,limegreen:3329330,linen:0xfaf0e6,magenta:0xff00ff,maroon:8388608,mediumaquamarine:6737322,mediumblue:205,mediumorchid:0xba55d3,mediumpurple:9662683,mediumseagreen:3978097,mediumslateblue:8087790,mediumspringgreen:64154,mediumturquoise:4772300,mediumvioletred:0xc71585,midnightblue:1644912,mintcream:0xf5fffa,mistyrose:0xffe4e1,moccasin:0xffe4b5,navajowhite:0xffdead,navy:128,oldlace:0xfdf5e6,olive:8421376,olivedrab:7048739,orange:0xffa500,orangered:0xff4500,orchid:0xda70d6,palegoldenrod:0xeee8aa,palegreen:0x98fb98,paleturquoise:0xafeeee,palevioletred:0xdb7093,papayawhip:0xffefd5,peachpuff:0xffdab9,peru:0xcd853f,pink:0xffc0cb,plum:0xdda0dd,powderblue:0xb0e0e6,purple:8388736,rebeccapurple:6697881,red:0xff0000,rosybrown:0xbc8f8f,royalblue:4286945,saddlebrown:9127187,salmon:0xfa8072,sandybrown:0xf4a460,seagreen:3050327,seashell:0xfff5ee,sienna:0xa0522d,silver:0xc0c0c0,skyblue:8900331,slateblue:6970061,slategray:7372944,slategrey:7372944,snow:0xfffafa,springgreen:65407,steelblue:4620980,tan:0xd2b48c,teal:32896,thistle:0xd8bfd8,tomato:0xff6347,turquoise:4251856,violet:0xee82ee,wheat:0xf5deb3,white:0xffffff,whitesmoke:0xf5f5f5,yellow:0xffff00,yellowgreen:0x9acd32},X=/^#?([0-9a-f]{8}|[0-9a-f]{6}|[0-9a-f]{4}|[0-9a-f]{3})$/i,V="([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)",G=`${V}%`,K=`(?:${V}%|${V})`,J=`(?:${V}%|${V}|none)`,Z=`(?:${V}(deg|grad|rad|turn)|${V})`,Q="\\s*,\\s*";RegExp("^"+J+"$");let ee=RegExp(`^rgba?\\(\\s*${V}${Q}${V}${Q}${V}\\s*(?:,\\s*${K}\\s*)?\\)$`),et=RegExp(`^rgba?\\(\\s*${G}${Q}${G}${Q}${G}\\s*(?:,\\s*${K}\\s*)?\\)$`),er=(e,t)=>void 0===e?void 0:"object"!=typeof e?ez(e):void 0!==e.mode?e:t?{...e,mode:t}:void 0,ea=(e="rgb")=>t=>void 0!==(t=er(t,e))?t.mode===e?t:ei[t.mode][e]?ei[t.mode][e](t):"rgb"===e?ei[t.mode].rgb(t):ei.rgb[e](ei[t.mode].rgb(t)):void 0,ei={},es={},el=[],en={},eo=e=>e,ed=e=>(ei[e.mode]={...ei[e.mode],...e.toMode},Object.keys(e.fromMode||{}).forEach(t=>{ei[t]||(ei[t]={}),ei[t][e.mode]=e.fromMode[t]}),e.ranges||(e.ranges={}),e.difference||(e.difference={}),e.channels.forEach(t=>{if(void 0===e.ranges[t]&&(e.ranges[t]=[0,1]),!e.interpolate[t])throw Error(`Missing interpolator for: ${t}`);"function"==typeof e.interpolate[t]&&(e.interpolate[t]={use:e.interpolate[t]}),e.interpolate[t].fixup||(e.interpolate[t].fixup=eo)}),es[e.mode]=e,(e.parse||[]).forEach(t=>{eh(t,e.mode)}),ea(e.mode)),ec=e=>es[e],eh=(e,t)=>{if("string"==typeof e){if(!t)throw Error("'mode' required when 'parser' is a string");en[e]=t}else"function"==typeof e&&0>el.indexOf(e)&&el.push(e)},eu=/[^\x00-\x7F]|[a-zA-Z_]/,ex=/[^\x00-\x7F]|[-\w]/,ep="function",em="ident",ef="number",eg="percentage",eb="none",ey="alpha",ev=0;function ew(e){let t=e[ev],r=e[ev+1];return"-"===t||"+"===t?/\d/.test(r)||"."===r&&/\d/.test(e[ev+2]):"."===t?/\d/.test(r):/\d/.test(t)}function ej(e){if(ev>=e.length)return!1;let t=e[ev];if(eu.test(t))return!0;if("-"===t){if(e.length-ev<2)return!1;let t=e[ev+1];if("-"===t||eu.test(t))return!0}return!1}let ek={deg:1,rad:180/Math.PI,grad:.9,turn:360};function eN(e){let t="";if(("-"===e[ev]||"+"===e[ev])&&(t+=e[ev++]),t+=eM(e),"."===e[ev]&&/\d/.test(e[ev+1])&&(t+=e[ev++]+eM(e)),("e"===e[ev]||"E"===e[ev])&&(("-"===e[ev+1]||"+"===e[ev+1])&&/\d/.test(e[ev+2])?t+=e[ev++]+e[ev++]+eM(e):/\d/.test(e[ev+1])&&(t+=e[ev++]+eM(e))),ej(e)){let r=e$(e);return"deg"===r||"rad"===r||"turn"===r||"grad"===r?{type:"hue",value:t*ek[r]}:void 0}return"%"===e[ev]?(ev++,{type:eg,value:+t}):{type:ef,value:+t}}function eM(e){let t="";for(;/\d/.test(e[ev]);)t+=e[ev++];return t}function e$(e){let t="";for(;ev<e.length&&ex.test(e[ev]);)t+=e[ev++];return t}function eS(e,t){let r,a=[];for(;e._i<e.length;){if((r=e[e._i++]).type===eb||r.type===ef||r.type===ey||r.type===eg||t&&"hue"===r.type){a.push(r);continue}if(")"===r.type){if(e._i<e.length)return;continue}return}if(!(a.length<3)&&!(a.length>4)){if(4===a.length){if(a[3].type!==ey)return;a[3]=a[3].value}return 3===a.length&&a.push({type:eb,value:void 0}),a.every(e=>e.type!==ey)?a:void 0}}let ez=e=>{let t;if("string"!=typeof e)return;let r=function(e=""){let t,r=e.trim(),a=[];for(ev=0;ev<r.length;){if("\n"===(t=r[ev++])||"	"===t||" "===t){for(;ev<r.length&&("\n"===r[ev]||"	"===r[ev]||" "===r[ev]);)ev++;continue}if(","===t)return;if(")"===t){a.push({type:")"});continue}if("+"===t){if(ev--,ew(r)){a.push(eN(r));continue}return}if("-"===t){if(ev--,ew(r)){a.push(eN(r));continue}if(ej(r)){a.push({type:em,value:e$(r)});continue}return}if("."===t){if(ev--,ew(r)){a.push(eN(r));continue}return}if("/"===t){let e;for(;ev<r.length&&("\n"===r[ev]||"	"===r[ev]||" "===r[ev]);)ev++;if(ew(r)&&"hue"!==(e=eN(r)).type){a.push({type:ey,value:e});continue}if(ej(r)&&"none"===e$(r)){a.push({type:ey,value:{type:eb,value:void 0}});continue}return}if(/\d/.test(t)){ev--,a.push(eN(r));continue}if(eu.test(t)){ev--,a.push(function(e){let t=e$(e);return"("===e[ev]?(ev++,{type:ep,value:t}):"none"===t?{type:eb,value:void 0}:{type:em,value:t}}(r));continue}return}return a}(e),a=r?function(e,t){e._i=0;let r=e[e._i++];if(!r||r.type!==ep)return;let a=eS(e,t);if(a)return a.unshift(r.value),a}(r,!0):void 0,i=0,s=el.length;for(;i<s;)if(void 0!==(t=el[i++](e,a)))return t;return r?function(e){e._i=0;let t=e[e._i++];if(!t||t.type!==ep||"color"!==t.value||(t=e[e._i++]).type!==em)return;let r=en[t.value];if(!r)return;let a={mode:r},i=eS(e,!1);if(!i)return;let s=ec(r).channels;for(let e=0,t,r;e<s.length;e++)t=i[e],r=s[e],t.type!==eb&&(a[r]=t.type===ef?t.value:t.value/100,"alpha"===r&&(a[r]=Math.max(0,Math.min(1,a[r]))));return a}(r):void 0},eC=(t=(e,t,r)=>e+r*(t-e),e=>{let r=(e=>{let t=[];for(let r=0;r<e.length-1;r++){let a=e[r],i=e[r+1];void 0===a&&void 0===i?t.push(void 0):void 0!==a&&void 0!==i?t.push([a,i]):t.push(void 0!==a?[a,a]:[i,i])}return t})(e);return e=>{let a=e*r.length,i=e>=1?r.length-1:Math.max(Math.floor(a),0),s=r[i];return void 0===s?void 0:t(s[0],s[1],a-i)}}),eE=e=>{let t=!1,r=e.map(e=>void 0!==e?(t=!0,e):1);return t?r:e},eL={mode:"rgb",channels:["r","g","b","alpha"],parse:[function(e,t){if(!t||"rgb"!==t[0]&&"rgba"!==t[0])return;let r={mode:"rgb"},[,a,i,s,l]=t;if("hue"!==a.type&&"hue"!==i.type&&"hue"!==s.type)return a.type!==eb&&(r.r=a.type===ef?a.value/255:a.value/100),i.type!==eb&&(r.g=i.type===ef?i.value/255:i.value/100),s.type!==eb&&(r.b=s.type===ef?s.value/255:s.value/100),l.type!==eb&&(r.alpha=Math.min(1,Math.max(0,l.type===ef?l.value:l.value/100))),r},e=>{let t;return(t=e.match(X))?Y(parseInt(t[1],16),t[1].length):void 0},e=>{let t,r={mode:"rgb"};if(t=e.match(ee))void 0!==t[1]&&(r.r=t[1]/255),void 0!==t[2]&&(r.g=t[2]/255),void 0!==t[3]&&(r.b=t[3]/255);else{if(!(t=e.match(et)))return;void 0!==t[1]&&(r.r=t[1]/100),void 0!==t[2]&&(r.g=t[2]/100),void 0!==t[3]&&(r.b=t[3]/100)}return void 0!==t[4]?r.alpha=Math.max(0,Math.min(1,t[4]/100)):void 0!==t[5]&&(r.alpha=Math.max(0,Math.min(1,+t[5]))),r},e=>Y(q[e.toLowerCase()],6),e=>"transparent"===e?{mode:"rgb",r:0,g:0,b:0,alpha:0}:void 0,"srgb"],serialize:"srgb",interpolate:{r:eC,g:eC,b:eC,alpha:{use:eC,fixup:eE}},gamut:!0,white:{r:1,g:1,b:1},black:{r:0,g:0,b:0}},eF=(e=0)=>Math.pow(Math.abs(e),563/256)*Math.sign(e),eH=e=>{let t=eF(e.r),r=eF(e.g),a=eF(e.b),i={mode:"xyz65",x:.5766690429101305*t+.1855582379065463*r+.1882286462349947*a,y:.297344975250536*t+.6273635662554661*r+.0752914584939979*a,z:.0270313613864123*t+.0706888525358272*r+.9913375368376386*a};return void 0!==e.alpha&&(i.alpha=e.alpha),i},eI=e=>Math.pow(Math.abs(e),256/563)*Math.sign(e),eR=({x:e,y:t,z:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i={mode:"a98",r:eI(2.0415879038107465*e-.5650069742788597*t-.3447313507783297*r),g:eI(-.9692436362808798*e+1.8759675015077206*t+.0415550574071756*r),b:eI(.0134442806320312*e-.1183623922310184*t+1.0151749943912058*r)};return void 0!==a&&(i.alpha=a),i},eT=(e=0)=>{let t=Math.abs(e);return t<=.04045?e/12.92:(Math.sign(e)||1)*Math.pow((t+.055)/1.055,2.4)},eO=({r:e,g:t,b:r,alpha:a})=>{let i={mode:"lrgb",r:eT(e),g:eT(t),b:eT(r)};return void 0!==a&&(i.alpha=a),i},eW=e=>{let{r:t,g:r,b:a,alpha:i}=eO(e),s={mode:"xyz65",x:.4123907992659593*t+.357584339383878*r+.1804807884018343*a,y:.2126390058715102*t+.715168678767756*r+.0721923153607337*a,z:.0193308187155918*t+.119194779794626*r+.9505321522496607*a};return void 0!==i&&(s.alpha=i),s},e_=(e=0)=>{let t=Math.abs(e);return t>.0031308?(Math.sign(e)||1)*(1.055*Math.pow(t,1/2.4)-.055):12.92*e},eD=({r:e,g:t,b:r,alpha:a},i="rgb")=>{let s={mode:i,r:e_(e),g:e_(t),b:e_(r)};return void 0!==a&&(s.alpha=a),s},eB=({x:e,y:t,z:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=eD({r:3.2409699419045226*e-1.537383177570094*t-.4986107602930034*r,g:-.9692436362808796*e+1.8759675015077204*t+.0415550574071756*r,b:.0556300796969936*e-.2039769588889765*t+1.0569715142428784*r});return void 0!==a&&(i.alpha=a),i},eP={...eL,mode:"a98",parse:["a98-rgb"],serialize:"a98-rgb",fromMode:{rgb:e=>eR(eW(e)),xyz65:eR},toMode:{rgb:e=>eB(eH(e)),xyz65:eH}},eA=e=>(e%=360)<0?e+360:e,eU=e=>{let t;return t=e=>180>=Math.abs(e)?e:e-360*Math.sign(e),e.map((r,a,i)=>{if(void 0===r)return r;let s=eA(r);return 0===a||void 0===e[a-1]?s:t(s-eA(i[a-1]))}).reduce((e,t)=>(e.length&&void 0!==t&&void 0!==e[e.length-1]?e.push(t+e[e.length-1]):e.push(t),e),[])},eY=Math.PI/180,eq=180/Math.PI,eX=-1.78277*.29227-.1347134789,eV=(e,t)=>{if(void 0===e.h||void 0===t.h||!e.s||!t.s)return 0;let r=eA(e.h),a=Math.sin((eA(t.h)-r+360)/2*Math.PI/180);return 2*Math.sqrt(e.s*t.s)*a},eG=(e,t)=>{if(void 0===e.h||void 0===t.h||!e.c||!t.c)return 0;let r=eA(e.h),a=Math.sin((eA(t.h)-r+360)/2*Math.PI/180);return 2*Math.sqrt(e.c*t.c)*a},eK=e=>{let t=e.reduce((e,t)=>{if(void 0!==t){let r=t*Math.PI/180;e.sin+=Math.sin(r),e.cos+=Math.cos(r)}return e},{sin:0,cos:0}),r=180*Math.atan2(t.sin,t.cos)/Math.PI;return r<0?360+r:r},eJ={mode:"cubehelix",channels:["h","s","l","alpha"],parse:["--cubehelix"],serialize:"--cubehelix",ranges:{h:[0,360],s:[0,4.614],l:[0,1]},fromMode:{rgb:({r:e,g:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=(eX*r+-1.7884503806*e-3.5172982438*t)/(eX+-1.7884503806-3.5172982438),s=r-i,l=-((1.97294*(t-i)- -.29227*s)/.90649),n={mode:"cubehelix",l:i,s:0===i||1===i?void 0:Math.sqrt(s*s+l*l)/(1.97294*i*(1-i))};return n.s&&(n.h=Math.atan2(l,s)*eq-120),void 0!==a&&(n.alpha=a),n}},toMode:{rgb:({h:e,s:t,l:r,alpha:a})=>{let i={mode:"rgb"};void 0===r&&(r=0);let s=void 0===t?0:t*r*(1-r),l=Math.cos(e=(void 0===e?0:e+120)*eY),n=Math.sin(e);return i.r=r+s*(-.14861*l+1.78277*n),i.g=r+s*(-.29227*l+-.90649*n),i.b=r+s*(1.97294*l+0*n),void 0!==a&&(i.alpha=a),i}},interpolate:{h:{use:eC,fixup:eU},s:eC,l:eC,alpha:{use:eC,fixup:eE}},difference:{h:eV},average:{h:eK}},eZ=({l:e,a:t,b:r,alpha:a},i="lch")=>{void 0===t&&(t=0),void 0===r&&(r=0);let s=Math.sqrt(t*t+r*r),l={mode:i,l:e,c:s};return s&&(l.h=eA(180*Math.atan2(r,t)/Math.PI)),void 0!==a&&(l.alpha=a),l},eQ=({l:e,c:t,h:r,alpha:a},i="lab")=>{void 0===r&&(r=0);let s={mode:i,l:e,a:t?t*Math.cos(r/180*Math.PI):0,b:t?t*Math.sin(r/180*Math.PI):0};return void 0!==a&&(s.alpha=a),s},e0={X:.3457/.3585,Y:1,Z:.8251046025104602},e1={X:.3127/.329,Y:1,Z:1.0890577507598784},e2=e=>Math.pow(e,3)>.008856451679035631?Math.pow(e,3):(116*e-16)/903.2962962962963,e5=({l:e,a:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=(e+16)/116,s=t/500+i,l=i-r/200,n={mode:"xyz65",x:e2(s)*e1.X,y:e2(i)*e1.Y,z:e2(l)*e1.Z};return void 0!==a&&(n.alpha=a),n},e4=e=>eB(e5(e)),e6=e=>e>.008856451679035631?Math.cbrt(e):(903.2962962962963*e+16)/116,e3=({x:e,y:t,z:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=e6(e/e1.X),s=e6(t/e1.Y),l={mode:"lab65",l:116*s-16,a:500*(i-s),b:200*(s-e6(r/e1.Z))};return void 0!==a&&(l.alpha=a),l},e8=e=>{let t=e3(eW(e));return e.r===e.b&&e.b===e.g&&(t.a=t.b=0),t},e9=26/180*Math.PI,e7=Math.cos(e9),te=Math.sin(e9),tt=100/Math.log(1.39),tr=({l:e,c:t,h:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i={mode:"lab65",l:(Math.exp(e/tt)-1)/.0039},s=(Math.exp(.0435*t*1)-1)/.075,l=s*Math.cos(r/180*Math.PI-e9),n=s*Math.sin(r/180*Math.PI-e9);return i.a=l*e7-n/.83*te,i.b=l*te+n/.83*e7,void 0!==a&&(i.alpha=a),i},ta=({l:e,a:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=t*e7+r*te,s=.83*(r*e7-t*te),l={mode:"dlch",l:tt/1*Math.log(1+.0039*e),c:Math.log(1+.075*Math.sqrt(i*i+s*s))/.0435};return l.c&&(l.h=eA((Math.atan2(s,i)+e9)/Math.PI*180)),void 0!==a&&(l.alpha=a),l},ti=e=>tr(eZ(e,"dlch")),ts=e=>eQ(ta(e),"dlab"),tl=RegExp(`^hsla?\\(\\s*${Z}${Q}${G}${Q}${G}\\s*(?:,\\s*${K}\\s*)?\\)$`),tn={mode:"hsl",toMode:{rgb:function({h:e,s:t,l:r,alpha:a}){let i;e=eA(void 0!==e?e:0),void 0===t&&(t=0),void 0===r&&(r=0);let s=r+t*(r<.5?r:1-r),l=s-(s-r)*2*Math.abs(e/60%2-1);switch(Math.floor(e/60)){case 0:i={r:s,g:l,b:2*r-s};break;case 1:i={r:l,g:s,b:2*r-s};break;case 2:i={r:2*r-s,g:s,b:l};break;case 3:i={r:2*r-s,g:l,b:s};break;case 4:i={r:l,g:2*r-s,b:s};break;case 5:i={r:s,g:2*r-s,b:l};break;default:i={r:2*r-s,g:2*r-s,b:2*r-s}}return i.mode="rgb",void 0!==a&&(i.alpha=a),i}},fromMode:{rgb:function({r:e,g:t,b:r,alpha:a}){void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=Math.max(e,t,r),s=Math.min(e,t,r),l={mode:"hsl",s:i===s?0:(i-s)/(1-Math.abs(i+s-1)),l:.5*(i+s)};return i-s!=0&&(l.h=(i===e?(t-r)/(i-s)+(t<r)*6:i===t?(r-e)/(i-s)+2:(e-t)/(i-s)+4)*60),void 0!==a&&(l.alpha=a),l}},channels:["h","s","l","alpha"],ranges:{h:[0,360]},gamut:"rgb",parse:[function(e,t){if(!t||"hsl"!==t[0]&&"hsla"!==t[0])return;let r={mode:"hsl"},[,a,i,s,l]=t;if(a.type!==eb){if(a.type===eg)return;r.h=a.value}if(i.type!==eb){if("hue"===i.type)return;r.s=i.value/100}if(s.type!==eb){if("hue"===s.type)return;r.l=s.value/100}return l.type!==eb&&(r.alpha=Math.min(1,Math.max(0,l.type===ef?l.value:l.value/100))),r},e=>{let t=e.match(tl);if(!t)return;let r={mode:"hsl"};return void 0!==t[3]?r.h=+t[3]:void 0!==t[1]&&void 0!==t[2]&&(r.h=((e,t)=>{switch(t){case"deg":return+e;case"rad":return e/Math.PI*180;case"grad":return e/10*9;case"turn":return 360*e}})(t[1],t[2])),void 0!==t[4]&&(r.s=Math.min(Math.max(0,t[4]/100),1)),void 0!==t[5]&&(r.l=Math.min(Math.max(0,t[5]/100),1)),void 0!==t[6]?r.alpha=Math.max(0,Math.min(1,t[6]/100)):void 0!==t[7]&&(r.alpha=Math.max(0,Math.min(1,+t[7]))),r}],serialize:e=>`hsl(${void 0!==e.h?e.h:"none"} ${void 0!==e.s?100*e.s+"%":"none"} ${void 0!==e.l?100*e.l+"%":"none"}${e.alpha<1?` / ${e.alpha}`:""})`,interpolate:{h:{use:eC,fixup:eU},s:eC,l:eC,alpha:{use:eC,fixup:eE}},difference:{h:eV},average:{h:eK}};function to({h:e,s:t,v:r,alpha:a}){let i;e=eA(void 0!==e?e:0),void 0===t&&(t=0),void 0===r&&(r=0);let s=Math.abs(e/60%2-1);switch(Math.floor(e/60)){case 0:i={r:r,g:r*(1-t*s),b:r*(1-t)};break;case 1:i={r:r*(1-t*s),g:r,b:r*(1-t)};break;case 2:i={r:r*(1-t),g:r,b:r*(1-t*s)};break;case 3:i={r:r*(1-t),g:r*(1-t*s),b:r};break;case 4:i={r:r*(1-t*s),g:r*(1-t),b:r};break;case 5:i={r:r,g:r*(1-t),b:r*(1-t*s)};break;default:i={r:r*(1-t),g:r*(1-t),b:r*(1-t)}}return i.mode="rgb",void 0!==a&&(i.alpha=a),i}function td({r:e,g:t,b:r,alpha:a}){void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=Math.max(e,t,r),s=Math.min(e,t,r),l={mode:"hsv",s:0===i?0:1-s/i,v:i};return i-s!=0&&(l.h=(i===e?(t-r)/(i-s)+(t<r)*6:i===t?(r-e)/(i-s)+2:(e-t)/(i-s)+4)*60),void 0!==a&&(l.alpha=a),l}let tc={mode:"hsv",toMode:{rgb:to},parse:["--hsv"],serialize:"--hsv",fromMode:{rgb:td},channels:["h","s","v","alpha"],ranges:{h:[0,360]},gamut:"rgb",interpolate:{h:{use:eC,fixup:eU},s:eC,v:eC,alpha:{use:eC,fixup:eE}},difference:{h:eV},average:{h:eK}};function th(e){if(e<0)return 0;let t=Math.pow(e,.012683313515655966);return 1e4*Math.pow(Math.max(0,t-.8359375)/(18.8515625-18.6875*t),6.277394636015326)}function tu(e){if(e<0)return 0;let t=Math.pow(e/1e4,.1593017578125);return Math.pow((.8359375+18.8515625*t)/(1+18.6875*t),78.84375)}let tx=e=>Math.max(e/203,0),tp=({i:e,t,p:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=th(e+.008609037037932761*t+.11102962500302593*r),s=th(e-.00860903703793275*t-.11102962500302599*r),l=th(e+.5600313357106791*t-.32062717498731885*r),n={mode:"xyz65",x:tx(2.070152218389422*i-1.3263473389671556*s+.2066510476294051*l),y:tx(.3647385209748074*i+.680566024947227*s-.0453045459220346*l),z:tx(-.049747207535812*i-.0492609666966138*s+1.1880659249923042*l)};return void 0!==a&&(n.alpha=a),n},tm=(e=0)=>Math.max(203*e,0),tf=({x:e,y:t,z:r,alpha:a})=>{let i=tm(e),s=tm(t),l=tm(r),n=tu(.3592832590121217*i+.6976051147779502*s-.0358915932320289*l),o=tu(-.1920808463704995*i+1.1004767970374323*s+.0753748658519118*l),d=tu(.0070797844607477*i+.0748396662186366*s+.8433265453898765*l),c={mode:"itp",i:.5*n+.5*o,t:1.61376953125*n-3.323486328125*o+1.709716796875*d,p:4.378173828125*n-4.24560546875*o-.132568359375*d};return void 0!==a&&(c.alpha=a),c},tg=e=>{if(e<0)return 0;let t=Math.pow(e/1e4,.1593017578125);return Math.pow((.8359375+18.8515625*t)/(1+18.6875*t),134.03437499999998)},tb=(e=0)=>Math.max(203*e,0),ty=({x:e,y:t,z:r,alpha:a})=>{e=tb(e),t=tb(t);let i=1.15*e-.15*(r=tb(r)),s=.66*t+.34*e,l=tg(.41478972*i+.579999*s+.014648*r),n=tg(-.20151*i+1.120649*s+.0531008*r),o=tg(-.0166008*i+.2648*s+.6684799*r),d=(l+n)/2,c={mode:"jab",j:.44*d/(1-.56*d)-16295499532821565e-27,a:3.524*l-4.066708*n+.542708*o,b:.199076*l+1.096799*n-1.295875*o};return void 0!==a&&(c.alpha=a),c},tv=e=>{if(e<0)return 0;let t=Math.pow(e,.007460772656268216);return 1e4*Math.pow((.8359375-t)/(18.6875*t-18.8515625),6.277394636015326)},tw=({j:e,a:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=(e+16295499532821565e-27)/(.44+.56*(e+16295499532821565e-27)),s=tv(i+.13860504*t+.058047316*r),l=tv(i-.13860504*t-.058047316*r),n=tv(i-.096019242*t-.8118919*r),o={mode:"xyz65",x:(1.661373024652174*s-.914523081304348*l+.23136208173913045*n)/203,y:(-.3250758611844533*s+1.571847026732543*l-.21825383453227928*n)/203,z:(-.090982811*s-.31272829*l+1.5227666*n)/203};return void 0!==a&&(o.alpha=a),o},tj=e=>{let t=ty(eW(e));return e.r===e.b&&e.b===e.g&&(t.a=t.b=0),t},tk=e=>eB(tw(e)),tN=({j:e,a:t,b:r,alpha:a})=>{void 0===t&&(t=0),void 0===r&&(r=0);let i=Math.sqrt(t*t+r*r),s={mode:"jch",j:e,c:i};return i&&(s.h=eA(180*Math.atan2(r,t)/Math.PI)),void 0!==a&&(s.alpha=a),s},tM=({j:e,c:t,h:r,alpha:a})=>{void 0===r&&(r=0);let i={mode:"jab",j:e,a:t?t*Math.cos(r/180*Math.PI):0,b:t?t*Math.sin(r/180*Math.PI):0};return void 0!==a&&(i.alpha=a),i},t$=e=>Math.pow(e,3)>.008856451679035631?Math.pow(e,3):(116*e-16)/903.2962962962963,tS=({l:e,a:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=(e+16)/116,s=t/500+i,l=i-r/200,n={mode:"xyz50",x:t$(s)*e0.X,y:t$(i)*e0.Y,z:t$(l)*e0.Z};return void 0!==a&&(n.alpha=a),n},tz=({x:e,y:t,z:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=eD({r:3.1341359569958707*e-1.6173863321612538*t-.4906619460083532*r,g:-.978795502912089*e+1.916254567259524*t+.03344273116131949*r,b:.07195537988411677*e-.2289768264158322*t+1.405386058324125*r});return void 0!==a&&(i.alpha=a),i},tC=e=>tz(tS(e)),tE=e=>{let{r:t,g:r,b:a,alpha:i}=eO(e),s={mode:"xyz50",x:.436065742824811*t+.3851514688337912*r+.14307845442264197*a,y:.22249319175623702*t+.7168870538238823*r+.06061979053616537*a,z:.013923904500943465*t+.09708128566574634*r+.7140993584005155*a};return void 0!==i&&(s.alpha=i),s},tL=e=>e>.008856451679035631?Math.cbrt(e):(903.2962962962963*e+16)/116,tF=({x:e,y:t,z:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=tL(e/e0.X),s=tL(t/e0.Y),l={mode:"lab",l:116*s-16,a:500*(i-s),b:200*(s-tL(r/e0.Z))};return void 0!==a&&(l.alpha=a),l},tH=e=>{let t=tF(tE(e));return e.r===e.b&&e.b===e.g&&(t.a=t.b=0),t},tI={mode:"lab",toMode:{xyz50:tS,rgb:tC},fromMode:{xyz50:tF,rgb:tH},channels:["l","a","b","alpha"],ranges:{l:[0,100],a:[-125,125],b:[-125,125]},parse:[function(e,t){if(!t||"lab"!==t[0])return;let r={mode:"lab"},[,a,i,s,l]=t;if("hue"!==a.type&&"hue"!==i.type&&"hue"!==s.type)return a.type!==eb&&(r.l=Math.min(Math.max(0,a.value),100)),i.type!==eb&&(r.a=i.type===ef?i.value:125*i.value/100),s.type!==eb&&(r.b=s.type===ef?s.value:125*s.value/100),l.type!==eb&&(r.alpha=Math.min(1,Math.max(0,l.type===ef?l.value:l.value/100))),r}],serialize:e=>`lab(${void 0!==e.l?e.l:"none"} ${void 0!==e.a?e.a:"none"} ${void 0!==e.b?e.b:"none"}${e.alpha<1?` / ${e.alpha}`:""})`,interpolate:{l:eC,a:eC,b:eC,alpha:{use:eC,fixup:eE}}},tR={...tI,mode:"lab65",parse:["--lab-d65"],serialize:"--lab-d65",toMode:{xyz65:e5,rgb:e4},fromMode:{xyz65:e3,rgb:e8},ranges:{l:[0,100],a:[-125,125],b:[-125,125]}},tT={mode:"lch",toMode:{lab:eQ,rgb:e=>tC(eQ(e))},fromMode:{rgb:e=>eZ(tH(e)),lab:eZ},channels:["l","c","h","alpha"],ranges:{l:[0,100],c:[0,150],h:[0,360]},parse:[function(e,t){if(!t||"lch"!==t[0])return;let r={mode:"lch"},[,a,i,s,l]=t;if(a.type!==eb){if("hue"===a.type)return;r.l=Math.min(Math.max(0,a.value),100)}if(i.type!==eb&&(r.c=Math.max(0,i.type===ef?i.value:150*i.value/100)),s.type!==eb){if(s.type===eg)return;r.h=s.value}return l.type!==eb&&(r.alpha=Math.min(1,Math.max(0,l.type===ef?l.value:l.value/100))),r}],serialize:e=>`lch(${void 0!==e.l?e.l:"none"} ${void 0!==e.c?e.c:"none"} ${void 0!==e.h?e.h:"none"}${e.alpha<1?` / ${e.alpha}`:""})`,interpolate:{h:{use:eC,fixup:eU},c:eC,l:eC,alpha:{use:eC,fixup:eE}},difference:{h:eG},average:{h:eK}},tO={...tT,mode:"lch65",parse:["--lch-d65"],serialize:"--lch-d65",toMode:{lab65:e=>eQ(e,"lab65"),rgb:e=>e4(eQ(e,"lab65"))},fromMode:{rgb:e=>eZ(e8(e),"lch65"),lab65:e=>eZ(e,"lch65")},ranges:{l:[0,100],c:[0,150],h:[0,360]}},tW=({l:e,u:t,v:r,alpha:a})=>{void 0===t&&(t=0),void 0===r&&(r=0);let i=Math.sqrt(t*t+r*r),s={mode:"lchuv",l:e,c:i};return i&&(s.h=eA(180*Math.atan2(r,t)/Math.PI)),void 0!==a&&(s.alpha=a),s},t_=({l:e,c:t,h:r,alpha:a})=>{void 0===r&&(r=0);let i={mode:"luv",l:e,u:t?t*Math.cos(r/180*Math.PI):0,v:t?t*Math.sin(r/180*Math.PI):0};return void 0!==a&&(i.alpha=a),i},tD=(e,t,r)=>4*e/(e+15*t+3*r),tB=(e,t,r)=>9*t/(e+15*t+3*r),tP=tD(e0.X,e0.Y,e0.Z),tA=tB(e0.X,e0.Y,e0.Z),tU=({x:e,y:t,z:r,alpha:a})=>{let i;void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let s=(i=t/e0.Y)<=.008856451679035631?903.2962962962963*i:116*Math.cbrt(i)-16,l=tD(e,t,r),n=tB(e,t,r);isFinite(l)&&isFinite(n)?(l=13*s*(l-tP),n=13*s*(n-tA)):s=l=n=0;let o={mode:"luv",l:s,u:l,v:n};return void 0!==a&&(o.alpha=a),o},tY=(r=e0.X,4*r/(r+15*e0.Y+3*e0.Z)),tq=(a=e0.X,9*(i=e0.Y)/(a+15*i+3*e0.Z)),tX=({l:e,u:t,v:r,alpha:a})=>{if(void 0===e&&(e=0),0===e)return{mode:"xyz50",x:0,y:0,z:0};void 0===t&&(t=0),void 0===r&&(r=0);let i=t/(13*e)+tY,s=r/(13*e)+tq,l=e0.Y*(e<=8?e/903.2962962962963:Math.pow((e+16)/116,3)),n={mode:"xyz50",x:9*i*l/(4*s),y:l,z:l*(12-3*i-20*s)/(4*s)};return void 0!==a&&(n.alpha=a),n},tV={...eL,mode:"lrgb",toMode:{rgb:eD},fromMode:{rgb:eO},parse:["srgb-linear"],serialize:"srgb-linear"},tG=({r:e,g:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=Math.cbrt(.412221469470763*e+.5363325372617348*t+.0514459932675022*r),s=Math.cbrt(.2119034958178252*e+.6806995506452344*t+.1073969535369406*r),l=Math.cbrt(.0883024591900564*e+.2817188391361215*t+.6299787016738222*r),n={mode:"oklab",l:.210454268309314*i+.7936177747023054*s-.0040720430116193*l,a:1.9779985324311684*i-2.42859224204858*s+.450593709617411*l,b:.0259040424655478*i+.7827717124575296*s-.8086757549230774*l};return void 0!==a&&(n.alpha=a),n},tK=e=>{let t=tG(eO(e));return e.r===e.b&&e.b===e.g&&(t.a=t.b=0),t},tJ=({l:e,a:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=Math.pow(e+.3963377773761749*t+.2158037573099136*r,3),s=Math.pow(e-.1055613458156586*t-.0638541728258133*r,3),l=Math.pow(e-.0894841775298119*t-1.2914855480194092*r,3),n={mode:"lrgb",r:4.076741636075957*i-3.3077115392580616*s+.2309699031821044*l,g:-1.2684379732850317*i+2.6097573492876887*s-.3413193760026573*l,b:-.0041960761386756*i-.7034186179359362*s+1.7076146940746117*l};return void 0!==a&&(n.alpha=a),n},tZ=e=>eD(tJ(e));function tQ(e){return .5*(1.206/1.03*e-.206+Math.sqrt((1.206/1.03*e-.206)*(1.206/1.03*e-.206)+1.206/1.03*.12*e))}function t0(e){return(e*e+.206*e)/(1.206/1.03*(e+.03))}function t1(e,t){let r,a,i,s,l,n,o,d,c,h,u,x,p,m,f,g,b,y=(-1.88170328*e-.80936493*t>1?(r=1.19086277,a=1.76576728,i=.59662641,s=.75515197,l=.56771245,n=4.0767416621,o=-3.3077115913,d=.2309699292):1.81444104*e-1.19445276*t>1?(r=.73956515,a=-.45954404,i=.08285427,s=.1254107,l=.14503204,n=-1.2684380046,o=2.6097574011,d=-.3413193965):(r=1.35733652,a=-.00915799,i=-1.1513021,s=-.50559606,l=.00692167,n=-.0041960863,o=-.7034186147,d=1.707614701),c=r+a*e+i*t+s*e*e+l*e*t,h=.3963377774*e+.2158037573*t,u=-.1055613458*e-.0638541728*t,x=-.0894841775*e-1.291485548*t,g=n*((p=1+c*h)*p*p)+o*((m=1+c*u)*m*m)+d*((f=1+c*x)*f*f),c-=g*(b=3*h*p*p*n+3*u*m*m*o+3*x*f*f*d)/(b*b-.5*g*(6*h*h*p*n+6*u*u*m*o+6*x*x*f*d))),v=tJ({l:1,a:y*e,b:y*t}),w=Math.cbrt(1/Math.max(v.r,v.g,v.b));return[w,w*y]}function t2(e,t,r=null){r||(r=t1(e,t));let a=r[0],i=r[1];return[i/a,i/(1-a)]}function t5(e,t,r){let a=t1(t,r),i=function(e,t,r,a,i=null){let s;if(i||(i=t1(e,t)),(r-a)*i[1]-(i[0]-a)*1<=0)s=i[1]*a/(+i[0]+i[1]*(a-r));else{s=i[1]*(a-1)/(+(i[0]-1)+i[1]*(a-r));{let i=r-a,l=.3963377774*e+.2158037573*t,n=-.1055613458*e-.0638541728*t,o=-.0894841775*e-1.291485548*t,d=i+ +l,c=i+ +n,h=i+ +o;{let e=a*(1-s)+s*r,t=+s,i=e+t*l,u=e+t*n,x=e+t*o,p=i*i*i,m=u*u*u,f=x*x*x,g=3*d*i*i,b=3*c*u*u,y=3*h*x*x,v=6*d*d*i,w=6*c*c*u,j=6*h*h*x,k=4.0767416621*p-3.3077115913*m+.2309699292*f-1,N=4.0767416621*g-3.3077115913*b+.2309699292*y,M=N/(N*N-.5*k*(4.0767416621*v-3.3077115913*w+.2309699292*j)),$=-k*M,S=-1.2684380046*p+2.6097574011*m-.3413193965*f-1,z=-1.2684380046*g+2.6097574011*b-.3413193965*y,C=z/(z*z-.5*S*(-1.2684380046*v+2.6097574011*w-.3413193965*j)),E=-S*C,L=-.0041960863*p-.7034186147*m+1.707614701*f-1,F=-.0041960863*g-.7034186147*b+1.707614701*y,H=F/(F*F-.5*L*(-.0041960863*v-.7034186147*w+1.707614701*j)),I=-L*H;s+=Math.min($=M>=0?$:1e6,Math.min(E=C>=0?E:1e6,I=H>=0?I:1e6))}}}return s}(t,r,e,e,a),s=t2(t,r,a),l=.11516993+1/(7.4477897+4.1590124*r+t*(-2.19557347+1.75198401*r+t*(-2.13704948-10.02301043*r+t*(-4.24894561+5.38770819*r+4.69891013*t)))),n=.11239642+1/(1.6132032-.68124379*r+t*(.40370612+.90148123*r+t*(-.27087943+.6122399*r+t*(.00299215-.45399568*r-.14661872*t)))),o=i/Math.min(e*s[0],(1-e)*s[1]),d=e*l,c=(1-e)*n,h=.9*o*Math.sqrt(Math.sqrt(1/(1/(d*d*d*d)+1/(c*c*c*c))));return[Math.sqrt(1/(1/((d=.4*e)*d)+1/((c=(1-e)*.8)*c))),h,i]}function t4(e){let t,r=void 0!==e.l?e.l:0,a=void 0!==e.a?e.a:0,i=void 0!==e.b?e.b:0,s={mode:"okhsl",l:tQ(r)};void 0!==e.alpha&&(s.alpha=e.alpha);let l=Math.sqrt(a*a+i*i);if(!l)return s.s=0,s;let[n,o,d]=t5(r,a/l,i/l);if(l<o){let e=.8*n;t=(l-0)/(e+(1-e/o)*(l-0))*.8}else{let e=.2*o*o*1.5625/n;t=.8+.2*((l-o)/(e+(1-e/(d-o))*(l-o)))}return t&&(s.s=t,s.h=eA(180*Math.atan2(i,a)/Math.PI)),s}function t6(e){let t,r,a,i,s=void 0!==e.h?e.h:0,l=void 0!==e.s?e.s:0,n=void 0!==e.l?e.l:0,o={mode:"oklab",l:t0(n)};if(void 0!==e.alpha&&(o.alpha=e.alpha),!l||1===n)return o.a=o.b=0,o;let d=Math.cos(s/180*Math.PI),c=Math.sin(s/180*Math.PI),[h,u,x]=t5(o.l,d,c);l<.8?(t=1.25*l,r=0,i=1-(a=.8*h)/u):(t=5*(l-.8),r=u,i=1-(a=.2*u*u*1.5625/h)/(x-u));let p=r+t*a/(1-i*t);return o.a=p*d,o.b=p*c,o}let t3={...tn,mode:"okhsl",channels:["h","s","l","alpha"],parse:["--okhsl"],serialize:"--okhsl",fromMode:{oklab:t4,rgb:e=>t4(tK(e))},toMode:{oklab:t6,rgb:e=>tZ(t6(e))}};function t8(e){let t=void 0!==e.l?e.l:0,r=void 0!==e.a?e.a:0,a=void 0!==e.b?e.b:0,i=Math.sqrt(r*r+a*a),s=i?r/i:1,l=i?a/i:1,[n,o]=t2(s,l),d=o/(i+t*o),c=d*t,h=d*i,u=t0(c),x=h*u/c,p=tJ({l:u,a:s*x,b:l*x}),m=Math.cbrt(1/Math.max(p.r,p.g,p.b,0));t/=m;let f={mode:"okhsv",s:(i=i/m*tQ(t)/t)?(.5+o)*h/(.5*o+o*(1-.5/n)*h):0,v:(t=tQ(t))?t/c:0};return f.s&&(f.h=eA(180*Math.atan2(a,r)/Math.PI)),void 0!==e.alpha&&(f.alpha=e.alpha),f}function t9(e){let t={mode:"oklab"};void 0!==e.alpha&&(t.alpha=e.alpha);let r=void 0!==e.h?e.h:0,a=void 0!==e.s?e.s:0,i=void 0!==e.v?e.v:0,s=Math.cos(r/180*Math.PI),l=Math.sin(r/180*Math.PI),[n,o]=t2(s,l),d=1-.5/n,c=1-.5*a/(.5+o-o*d*a),h=a*o*.5/(.5+o-o*d*a),u=t0(c),x=h*u/c,p=tJ({l:u,a:s*x,b:l*x}),m=Math.cbrt(1/Math.max(p.r,p.g,p.b,0)),f=t0(i*c),g=h*f/c;return t.l=f*m,t.a=g*s*m,t.b=g*l*m,t}let t7={...tc,mode:"okhsv",channels:["h","s","v","alpha"],parse:["--okhsv"],serialize:"--okhsv",fromMode:{oklab:t8,rgb:e=>t8(tK(e))},toMode:{oklab:t9,rgb:e=>tZ(t9(e))}},re={...tI,mode:"oklab",toMode:{lrgb:tJ,rgb:tZ},fromMode:{lrgb:tG,rgb:tK},ranges:{l:[0,1],a:[-.4,.4],b:[-.4,.4]},parse:[function(e,t){if(!t||"oklab"!==t[0])return;let r={mode:"oklab"},[,a,i,s,l]=t;if("hue"!==a.type&&"hue"!==i.type&&"hue"!==s.type)return a.type!==eb&&(r.l=Math.min(Math.max(0,a.type===ef?a.value:a.value/100),1)),i.type!==eb&&(r.a=i.type===ef?i.value:.4*i.value/100),s.type!==eb&&(r.b=s.type===ef?s.value:.4*s.value/100),l.type!==eb&&(r.alpha=Math.min(1,Math.max(0,l.type===ef?l.value:l.value/100))),r}],serialize:e=>`oklab(${void 0!==e.l?e.l:"none"} ${void 0!==e.a?e.a:"none"} ${void 0!==e.b?e.b:"none"}${e.alpha<1?` / ${e.alpha}`:""})`},rt={...tT,mode:"oklch",toMode:{oklab:e=>eQ(e,"oklab"),rgb:e=>tZ(eQ(e,"oklab"))},fromMode:{rgb:e=>eZ(tK(e),"oklch"),oklab:e=>eZ(e,"oklch")},parse:[function(e,t){if(!t||"oklch"!==t[0])return;let r={mode:"oklch"},[,a,i,s,l]=t;if(a.type!==eb){if("hue"===a.type)return;r.l=Math.min(Math.max(0,a.type===ef?a.value:a.value/100),1)}if(i.type!==eb&&(r.c=Math.max(0,i.type===ef?i.value:.4*i.value/100)),s.type!==eb){if(s.type===eg)return;r.h=s.value}return l.type!==eb&&(r.alpha=Math.min(1,Math.max(0,l.type===ef?l.value:l.value/100))),r}],serialize:e=>`oklch(${void 0!==e.l?e.l:"none"} ${void 0!==e.c?e.c:"none"} ${void 0!==e.h?e.h:"none"}${e.alpha<1?` / ${e.alpha}`:""})`,ranges:{l:[0,1],c:[0,.4],h:[0,360]}},rr=e=>{let{r:t,g:r,b:a,alpha:i}=eO(e),s={mode:"xyz65",x:.486570948648216*t+.265667693169093*r+.1982172852343625*a,y:.2289745640697487*t+.6917385218365062*r+.079286914093745*a,z:0*t+.0451133818589026*r+1.043944368900976*a};return void 0!==i&&(s.alpha=i),s},ra=({x:e,y:t,z:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=eD({r:2.4934969119414263*e-.9313836179191242*t-.402710784450717*r,g:-.8294889695615749*e+1.7626640603183465*t+.0236246858419436*r,b:.0358458302437845*e-.0761723892680418*t+.9568845240076871*r},"p3");return void 0!==a&&(i.alpha=a),i},ri={...eL,mode:"p3",parse:["display-p3"],serialize:"display-p3",fromMode:{rgb:e=>ra(eW(e)),xyz65:ra},toMode:{rgb:e=>eB(rr(e)),xyz65:rr}},rs=e=>{let t=Math.abs(e);return t>=1/512?Math.sign(e)*Math.pow(t,1/1.8):16*e},rl=({x:e,y:t,z:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i={mode:"prophoto",r:rs(1.3457868816471585*e-.2555720873797946*t-.0511018649755453*r),g:rs(-.5446307051249019*e+1.5082477428451466*t+.0205274474364214*r),b:rs(0*e+0*t+1.2119675456389452*r)};return void 0!==a&&(i.alpha=a),i},rn=(e=0)=>{let t=Math.abs(e);return t>=16/512?Math.sign(e)*Math.pow(t,1.8):e/16},ro=e=>{let t=rn(e.r),r=rn(e.g),a=rn(e.b),i={mode:"xyz50",x:.7977666449006423*t+.1351812974005331*r+.0313477341283922*a,y:.2880748288194013*t+.7118352342418731*r+899369387256e-16*a,z:0*t+0*r+.8251046025104602*a};return void 0!==e.alpha&&(i.alpha=e.alpha),i},rd={...eL,mode:"prophoto",parse:["prophoto-rgb"],serialize:"prophoto-rgb",fromMode:{xyz50:rl,rgb:e=>rl(tE(e))},toMode:{xyz50:ro,rgb:e=>tz(ro(e))}},rc=e=>{let t=Math.abs(e);return t>.018053968510807?(Math.sign(e)||1)*(1.09929682680944*Math.pow(t,.45)-(1.09929682680944-1)):4.5*e},rh=({x:e,y:t,z:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i={mode:"rec2020",r:rc(1.7166511879712683*e-.3556707837763925*t-.2533662813736599*r),g:rc(-.6666843518324893*e+1.6164812366349395*t+.0157685458139111*r),b:rc(.0176398574453108*e-.0427706132578085*t+.9421031212354739*r)};return void 0!==a&&(i.alpha=a),i},ru=(e=0)=>{let t=Math.abs(e);return t<.08124285829863151?e/4.5:(Math.sign(e)||1)*Math.pow((t+1.09929682680944-1)/1.09929682680944,1/.45)},rx=e=>{let t=ru(e.r),r=ru(e.g),a=ru(e.b),i={mode:"xyz65",x:.6369580483012911*t+.1446169035862083*r+.1688809751641721*a,y:.262700212011267*t+.6779980715188708*r+.059301716469862*a,z:0*t+.0280726930490874*r+1.0609850577107909*a};return void 0!==e.alpha&&(i.alpha=e.alpha),i},rp={...eL,mode:"rec2020",fromMode:{xyz65:rh,rgb:e=>rh(eW(e))},toMode:{xyz65:rx,rgb:e=>eB(rx(e))},parse:["rec2020"],serialize:"rec2020"},rm=Math.cbrt(.0037930732552754493),rf=e=>Math.cbrt(e)-rm,rg=e=>Math.pow(e+rm,3),rb={mode:"xyb",channels:["x","y","b","alpha"],parse:["--xyb"],serialize:"--xyb",toMode:{rgb:({x:e,y:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=rg(e+t)-.0037930732552754493,s=rg(t-e)-.0037930732552754493,l=rg(r+t)-.0037930732552754493,n=eD({r:11.031566904639861*i-9.866943908131562*s-.16462299650829934*l,g:-3.2541473810744237*i+4.418770377582723*s-.16462299650829934*l,b:-3.6588512867136815*i+2.7129230459360922*s+1.9459282407775895*l});return void 0!==a&&(n.alpha=a),n}},fromMode:{rgb:e=>{let{r:t,g:r,b:a,alpha:i}=eO(e),s=rf(.3*t+.622*r+.078*a+.0037930732552754493),l=rf(.23*t+.692*r+.078*a+.0037930732552754493),n={mode:"xyb",x:(s-l)/2,y:(s+l)/2,b:rf(.2434226892454782*t+.2047674442449682*r+.5518098665095535*a+.0037930732552754493)-(s+l)/2};return void 0!==i&&(n.alpha=i),n}},ranges:{x:[-.0154,.0281],y:[0,.8453],b:[-.2778,.388]},interpolate:{x:eC,y:eC,b:eC,alpha:{use:eC,fixup:eE}}},ry={mode:"yiq",toMode:{rgb:({y:e,i:t,q:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i={mode:"rgb",r:e+.95608445*t+.6208885*r,g:e-.27137664*t-.6486059*r,b:e-1.10561724*t+1.70250126*r};return void 0!==a&&(i.alpha=a),i}},fromMode:{rgb:({r:e,g:t,b:r,alpha:a})=>{void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i={mode:"yiq",y:.29889531*e+.58662247*t+.11448223*r,i:.59597799*e-.2741761*t-.32180189*r,q:.21147017*e-.52261711*t+.31114694*r};return void 0!==a&&(i.alpha=a),i}},channels:["y","i","q","alpha"],parse:["--yiq"],serialize:"--yiq",ranges:{i:[-.595,.595],q:[-.522,.522]},interpolate:{y:eC,i:eC,q:eC,alpha:{use:eC,fixup:eE}}};ed(eP),ed(eJ),ed({mode:"dlab",parse:["--din99o-lab"],serialize:"--din99o-lab",toMode:{lab65:ti,rgb:e=>e4(ti(e))},fromMode:{lab65:ts,rgb:e=>ts(e8(e))},channels:["l","a","b","alpha"],ranges:{l:[0,100],a:[-40.09,45.501],b:[-40.469,44.344]},interpolate:{l:eC,a:eC,b:eC,alpha:{use:eC,fixup:eE}}}),ed({mode:"dlch",parse:["--din99o-lch"],serialize:"--din99o-lch",toMode:{lab65:tr,dlab:e=>eQ(e,"dlab"),rgb:e=>e4(tr(e))},fromMode:{lab65:ta,dlab:e=>eZ(e,"dlch"),rgb:e=>ta(e8(e))},channels:["l","c","h","alpha"],ranges:{l:[0,100],c:[0,51.484],h:[0,360]},interpolate:{l:eC,c:eC,h:{use:eC,fixup:eU},alpha:{use:eC,fixup:eE}},difference:{h:eG},average:{h:eK}}),ed({mode:"hsi",toMode:{rgb:function({h:e,s:t,i:r,alpha:a}){let i;e=eA(void 0!==e?e:0),void 0===t&&(t=0),void 0===r&&(r=0);let s=Math.abs(e/60%2-1);switch(Math.floor(e/60)){case 0:i={r:r*(1+t*(3/(2-s)-1)),g:r*(1+t*(3*(1-s)/(2-s)-1)),b:r*(1-t)};break;case 1:i={r:r*(1+t*(3*(1-s)/(2-s)-1)),g:r*(1+t*(3/(2-s)-1)),b:r*(1-t)};break;case 2:i={r:r*(1-t),g:r*(1+t*(3/(2-s)-1)),b:r*(1+t*(3*(1-s)/(2-s)-1))};break;case 3:i={r:r*(1-t),g:r*(1+t*(3*(1-s)/(2-s)-1)),b:r*(1+t*(3/(2-s)-1))};break;case 4:i={r:r*(1+t*(3*(1-s)/(2-s)-1)),g:r*(1-t),b:r*(1+t*(3/(2-s)-1))};break;case 5:i={r:r*(1+t*(3/(2-s)-1)),g:r*(1-t),b:r*(1+t*(3*(1-s)/(2-s)-1))};break;default:i={r:r*(1-t),g:r*(1-t),b:r*(1-t)}}return i.mode="rgb",void 0!==a&&(i.alpha=a),i}},parse:["--hsi"],serialize:"--hsi",fromMode:{rgb:function({r:e,g:t,b:r,alpha:a}){void 0===e&&(e=0),void 0===t&&(t=0),void 0===r&&(r=0);let i=Math.max(e,t,r),s=Math.min(e,t,r),l={mode:"hsi",s:e+t+r===0?0:1-3*s/(e+t+r),i:(e+t+r)/3};return i-s!=0&&(l.h=(i===e?(t-r)/(i-s)+(t<r)*6:i===t?(r-e)/(i-s)+2:(e-t)/(i-s)+4)*60),void 0!==a&&(l.alpha=a),l}},channels:["h","s","i","alpha"],ranges:{h:[0,360]},gamut:"rgb",interpolate:{h:{use:eC,fixup:eU},s:eC,i:eC,alpha:{use:eC,fixup:eE}},difference:{h:eV},average:{h:eK}}),ed(tn),ed(tc),ed({mode:"hwb",toMode:{rgb:function({h:e,w:t,b:r,alpha:a}){if(void 0===t&&(t=0),void 0===r&&(r=0),t+r>1){let e=t+r;t/=e,r/=e}return to({h:e,s:1===r?1:1-t/(1-r),v:1-r,alpha:a})}},fromMode:{rgb:function(e){let t=td(e);if(void 0===t)return;let r=void 0!==t.s?t.s:0,a=void 0!==t.v?t.v:0,i={mode:"hwb",w:(1-r)*a,b:1-a};return void 0!==t.h&&(i.h=t.h),void 0!==t.alpha&&(i.alpha=t.alpha),i}},channels:["h","w","b","alpha"],ranges:{h:[0,360]},gamut:"rgb",parse:[function(e,t){if(!t||"hwb"!==t[0])return;let r={mode:"hwb"},[,a,i,s,l]=t;if(a.type!==eb){if(a.type===eg)return;r.h=a.value}if(i.type!==eb){if("hue"===i.type)return;r.w=i.value/100}if(s.type!==eb){if("hue"===s.type)return;r.b=s.value/100}return l.type!==eb&&(r.alpha=Math.min(1,Math.max(0,l.type===ef?l.value:l.value/100))),r}],serialize:e=>`hwb(${void 0!==e.h?e.h:"none"} ${void 0!==e.w?100*e.w+"%":"none"} ${void 0!==e.b?100*e.b+"%":"none"}${e.alpha<1?` / ${e.alpha}`:""})`,interpolate:{h:{use:eC,fixup:eU},w:eC,b:eC,alpha:{use:eC,fixup:eE}},difference:{h:(e,t)=>{if(void 0===e.h||void 0===t.h)return 0;let r=eA(e.h),a=eA(t.h);return Math.abs(a-r)>180?r-(a-360*Math.sign(a-r)):a-r}},average:{h:eK}}),ed({mode:"itp",channels:["i","t","p","alpha"],parse:["--ictcp"],serialize:"--ictcp",toMode:{xyz65:tp,rgb:e=>eB(tp(e))},fromMode:{xyz65:tf,rgb:e=>tf(eW(e))},ranges:{i:[0,.581],t:[-.369,.272],p:[-.164,.331]},interpolate:{i:eC,t:eC,p:eC,alpha:{use:eC,fixup:eE}}}),ed({mode:"jab",channels:["j","a","b","alpha"],parse:["--jzazbz"],serialize:"--jzazbz",fromMode:{rgb:tj,xyz65:ty},toMode:{rgb:tk,xyz65:tw},ranges:{j:[0,.222],a:[-.109,.129],b:[-.185,.134]},interpolate:{j:eC,a:eC,b:eC,alpha:{use:eC,fixup:eE}}}),ed({mode:"jch",parse:["--jzczhz"],serialize:"--jzczhz",toMode:{jab:tM,rgb:e=>tk(tM(e))},fromMode:{rgb:e=>tN(tj(e)),jab:tN},channels:["j","c","h","alpha"],ranges:{j:[0,.221],c:[0,.19],h:[0,360]},interpolate:{h:{use:eC,fixup:eU},c:eC,j:eC,alpha:{use:eC,fixup:eE}},difference:{h:eG},average:{h:eK}}),ed(tI),ed(tR),ed(tT),ed(tO),ed({mode:"lchuv",toMode:{luv:t_,rgb:e=>tz(tX(t_(e)))},fromMode:{rgb:e=>tW(tU(tE(e))),luv:tW},channels:["l","c","h","alpha"],parse:["--lchuv"],serialize:"--lchuv",ranges:{l:[0,100],c:[0,176.956],h:[0,360]},interpolate:{h:{use:eC,fixup:eU},c:eC,l:eC,alpha:{use:eC,fixup:eE}},difference:{h:eG},average:{h:eK}}),ed(tV),ed({mode:"luv",toMode:{xyz50:tX,rgb:e=>tz(tX(e))},fromMode:{xyz50:tU,rgb:e=>tU(tE(e))},channels:["l","u","v","alpha"],parse:["--luv"],serialize:"--luv",ranges:{l:[0,100],u:[-84.936,175.042],v:[-125.882,87.243]},interpolate:{l:eC,u:eC,v:eC,alpha:{use:eC,fixup:eE}}}),ed(t3),ed(t7),ed(re),ed(rt),ed(ri),ed(rd),ed(rp),ed(eL),ed(rb),ed({mode:"xyz50",parse:["xyz-d50"],serialize:"xyz-d50",toMode:{rgb:tz,lab:tF},fromMode:{rgb:tE,lab:tS},channels:["x","y","z","alpha"],ranges:{x:[0,.964],y:[0,.999],z:[0,.825]},interpolate:{x:eC,y:eC,z:eC,alpha:{use:eC,fixup:eE}}}),ed({mode:"xyz65",toMode:{rgb:eB,xyz50:e=>{let{x:t,y:r,z:a,alpha:i}=e;void 0===t&&(t=0),void 0===r&&(r=0),void 0===a&&(a=0);let s={mode:"xyz50",x:1.0479298208405488*t+.0229467933410191*r-.0501922295431356*a,y:.0296278156881593*t+.990434484573249*r-.0170738250293851*a,z:-.0092430581525912*t+.0150551448965779*r+.7518742899580008*a};return void 0!==i&&(s.alpha=i),s}},fromMode:{rgb:eW,xyz50:e=>{let{x:t,y:r,z:a,alpha:i}=e;void 0===t&&(t=0),void 0===r&&(r=0),void 0===a&&(a=0);let s={mode:"xyz65",x:.9554734527042182*t-.0230985368742614*r+.0632593086610217*a,y:-.0283697069632081*t+1.0099954580058226*r+.021041398966943*a,z:.0123140016883199*t-.0205076964334779*r+1.3303659366080753*a};return void 0!==i&&(s.alpha=i),s}},ranges:{x:[0,.95],y:[0,1],z:[0,1.088]},channels:["x","y","z","alpha"],parse:["xyz","xyz-d65"],serialize:"xyz-d65",interpolate:{x:eC,y:eC,z:eC,alpha:{use:eC,fixup:eE}}}),ed(ry),((e=4)=>t=>{let r;return"number"==typeof t?Math.round(t*(r=Math.pow(10,r=e)))/r:t})(2);let rv=e=>Math.round(255*Math.max(0,Math.min(1,e||0))),rw=ea("rgb");ea("hsl");let rj=ea("oklch"),rk=ea("rgb");function rN(e){let t=rj(ez(e));return t?{...t,h:t.h??0}:{mode:"oklch",l:0,c:0,h:0}}function rM(e){let t=rk(e);if(!t)return"#000000";let r=e=>Math.max(0,Math.min(1,e));return(e=>{if(void 0!==e)return"#"+(0x1000000|rv(e.r)<<16|rv(e.g)<<8|rv(e.b)).toString(16).slice(1)})(rw({...t,r:r(t.r),g:r(t.g),b:r(t.b)}))||"#000000"}function r$(e,t){let r=rN(e);return rM({mode:"oklch",l:Math.max(0,Math.min(1,r.l+t.dL)),c:Math.max(0,r.c+t.dC),h:((r.h??0)+t.dH+360)%360})}function rS(e){let t=rk(ez(e));if(!t)return 0;let r=e=>e<=.03928?e/12.92:Math.pow((e+.055)/1.055,2.4);return .2126*r(t.r)+.7152*r(t.g)+.0722*r(t.b)}function rz(e){return(e=>{let t=er(e);if(!t)return;let r=ec(t.mode);if(!r.serialize||"string"==typeof r.serialize){let e=`color(${r.serialize||`--${t.mode}`} `;return r.channels.forEach((r,a)=>{"alpha"!==r&&(e+=(a?" ":"")+(void 0!==t[r]?t[r]:"none"))}),void 0!==t.alpha&&t.alpha<1&&(e+=` / ${t.alpha}`),e+")"}if("function"==typeof r.serialize)return r.serialize(t)})(rN(e))||""}let rC=["success","warning","error","info"],rE=(e,t)=>r$(e.baseHex,t),rL={base:16,ratio:1.25,fontFamily:"Inter, system-ui, sans-serif",headingFamily:"Inter, system-ui, sans-serif",fontWeight:400,lineHeight:1.5,letterSpacing:0},rF={base:4},rH={base:8},rI={base:200,easing:"ease-out"},rR={base:1},rT={base:.08},rO={intensity:.5,advanced:!1,...H(.5)},rW={enabled:!1,overrides:{}},r_=M()(S((e,t)=>({colors:[],typography:rL,globals:{dL:0,dC:0,dH:0},dark:rW,schemes:[],activeSchemeId:null,rolesUncertain:!1,recommendations:[],activeBrand:null,spacing:rF,radius:rH,shadow:rO,motion:rI,border:rR,opacity:rT,setColors:t=>e(()=>({colors:t.map((e,r)=>{var a;return{id:`c${r}`,hex:e.hex,baseHex:e.hex,proportion:e.proportion,role:(a=t.length,0===r?"background":1===r?"primary":2===r?"foreground":3===r?"accent":r>=a-1?"muted":"unassigned")}}),globals:{dL:0,dC:0,dH:0},activeBrand:null,activeSchemeId:null,rolesUncertain:!0,dark:{enabled:!1,overrides:{}}})),loadTokens:(t,r=null)=>e(()=>({colors:t.map((e,t)=>({...e,id:`c${t}`})),globals:{dL:0,dC:0,dH:0},activeBrand:r,activeSchemeId:null,rolesUncertain:!1,dark:{enabled:!1,overrides:{}}})),updateColor:(t,r)=>e(e=>({colors:e.colors.map(e=>e.id===t?{...e,...r,baseHex:r.hex??e.baseHex}:e)})),setRole:(t,r)=>e(e=>({colors:e.colors.map(e=>e.id===t?{...e,role:r}:e),rolesUncertain:!1})),setGlobal:t=>e(e=>({globals:{...e.globals,...t}})),resetGlobals:()=>e(()=>({globals:{dL:0,dC:0,dH:0}})),setTypography:t=>e(e=>({typography:{...e.typography,...t}})),setRecommendations:t=>e(()=>({recommendations:t})),setSpacing:t=>e(e=>({spacing:{...e.spacing,...t}})),setRadius:t=>e(e=>({radius:{...e.radius,...t}})),setShadowIntensity:t=>e(e=>({shadow:{...e.shadow,intensity:t,advanced:!1,...H(t)}})),setShadowAdvanced:t=>e(e=>({shadow:{...e.shadow,advanced:t}})),setShadowLevel:(t,r)=>e(e=>({shadow:{...e.shadow,advanced:!0,[t]:{...e.shadow[t],...r}}})),setMotion:t=>e(e=>({motion:{...e.motion,...t}})),setBorder:t=>e(e=>({border:{...e.border,...t}})),setOpacity:t=>e(e=>({opacity:{...e.opacity,...t}})),saveScheme:r=>{let a=t(),i=`s${Date.now().toString(36)}${Math.random().toString(36).slice(2,6)}`,s={id:i,name:r.trim()||U(`Scheme ${a.schemes.length+1}`,`方案 ${a.schemes.length+1}`),createdAt:Date.now(),colors:a.colors.map(e=>({...e})),typography:{...a.typography},globals:{...a.globals},spacing:{...a.spacing},radius:{...a.radius},shadow:{...a.shadow,sm:{...a.shadow.sm},md:{...a.shadow.md},lg:{...a.shadow.lg}},motion:{...a.motion},border:{...a.border},opacity:{...a.opacity},dark:{enabled:a.dark.enabled,overrides:{...a.dark.overrides}},activeBrand:a.activeBrand};return e(e=>({schemes:[...e.schemes,s].slice(-8),activeSchemeId:i})),i},loadScheme:r=>{let a=t().schemes.find(e=>e.id===r);a&&e(()=>({colors:a.colors.map(e=>({...e})),typography:{...a.typography},globals:{...a.globals},spacing:{...a.spacing},radius:{...a.radius},shadow:{...a.shadow,sm:{...a.shadow.sm},md:{...a.shadow.md},lg:{...a.shadow.lg}},motion:{...a.motion},border:{...a.border},opacity:{...a.opacity},dark:{enabled:a.dark.enabled,overrides:{...a.dark.overrides}},activeBrand:a.activeBrand,activeSchemeId:r}))},deleteScheme:t=>e(e=>({schemes:e.schemes.filter(e=>e.id!==t),activeSchemeId:e.activeSchemeId===t?null:e.activeSchemeId})),setDarkEnabled:t=>e(e=>({dark:{...e.dark,enabled:t}})),setDarkOverride:(t,r)=>e(e=>{let a={...e.dark.overrides};return null===r?delete a[t]:a[t]=r,{dark:{...e.dark,overrides:a}}}),reset:()=>e(()=>({colors:[],typography:rL,globals:{dL:0,dC:0,dH:0},dark:rW,activeBrand:null,activeSchemeId:null}))}),{name:"design-pact-tokens",skipHydration:!0})),rD=M(e=>({palettes:[],matches:[],setPalettes:t=>e({palettes:t}),setMatches:t=>e({matches:t}),clear:()=>e({palettes:[],matches:[]})})),rB=["airbnb","airtable","apple","binance","bmw","bmw-m","bugatti","cal","claude","clay","clickhouse","cohere","coinbase","composio","cursor","elevenlabs","expo","ferrari","figma","framer","hashicorp","ibm","intercom","kraken","lamborghini","linear.app","lovable","mastercard","meta","minimax","mintlify","miro","mistral.ai","mongodb","nike","notion","nvidia","ollama","opencode.ai","pinterest","playstation","posthog","raycast","renault","replicate","resend","revolut","runwayml","sanity","sentry","shopify","slack","spacex","spotify","starbucks","stripe","supabase","superhuman","tesla","theverge","together.ai","uber","vercel","vodafone","voltagent","warp","webflow","wired","wise","x.ai","zapier"];function rP(e){return e.split(/[-.]/).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" ")}let rA=null;async function rU(e){return(await rY(e)).colors}async function rY(e){let t=(await function(){if(!rA){let e=fetch("/templates.json").then(async e=>{if(!e.ok)throw Error(U(`Failed to load the template library (${e.status})`,`无法加载模板库 (${e.status})`));return await e.json()});rA=e,e.catch(()=>{rA===e&&(rA=null)})}return rA}()).templates[e];if(!t)throw Error(U(`Failed to load the ${e} template`,`无法加载 ${e} 模板`));return{colors:t.colors.map(e=>({id:rX(),hex:e.hex,baseHex:e.hex,proportion:1,role:e.role,name:e.name})),typography:t.typography,spacing:t.spacing,radius:t.radius}}let rq=0,rX=()=>`t${Date.now().toString(36)}${(++rq).toString(36)}`,rV=["background","foreground","primary","accent","muted","border"],rG=/^#?[0-9a-fA-F]{6}$/;function rK(e){let[t,r,...a]=e.split("~"),i=r?.trim()||void 0,s=a.join("~").trim()||void 0,l=t.split(/[,\-\s]+/).map(e=>e.trim()).filter(e=>rG.test(e)).map(e=>(e.startsWith("#")?e:`#${e}`).toLowerCase()).slice(0,rV.length);return l.length<3?null:{palette:l.map((e,t)=>({id:`c${t}`,hex:e,baseHex:e,proportion:1,role:rV[t]??"unassigned"})),name:i,description:s}}function rJ({children:e}){let[t,r]=(0,l.useState)(!1);return((0,l.useEffect)(()=>{let e=!1,t=()=>{!function(){let e=new URLSearchParams(window.location.search),t=e.getAll("p");if(0===t.length){let r=e.get("palette");r&&(t=[r])}let r=function(e){let t=[...e.getAll("m"),...e.getAll("match")].join(",");if(!t)return[];let r=new Set(rB),a=new Set,i=[];for(let e of t.split(/[,\s]+/)){let t=e.trim().toLowerCase();t&&r.has(t)&&!a.has(t)&&(a.add(t),i.push(t))}return i}(e);if(0===t.length&&0===r.length)return;let a=t.map(rK).filter(e=>null!==e);if(0!==a.length||0!==r.length)if(window.history.replaceState(null,"",window.location.pathname+window.location.hash),r.length>0&&rD.getState().setMatches(r),1===a.length){let{palette:e}=a[0];r_.getState().loadTokens(e,null),0===r.length&&setTimeout(()=>document.getElementById("step-edit")?.scrollIntoView({behavior:"smooth",block:"start"}),350)}else a.length>1&&rD.getState().setPalettes(a)}(),e||r(!0)};try{let e=null!=localStorage.getItem("design-pact-lang");P.persist.rehydrate(),e||P.getState().setLang(function(){try{let e=new URLSearchParams(window.location.search).get("lang");if("zh"===e||"en"===e)return e}catch{}return(navigator.language||"").toLowerCase().startsWith("zh")?"zh":"en"}())}catch{}try{let e=r_.persist.rehydrate();e&&"function"==typeof e.then?e.then(t,t):t()}catch{t()}return()=>{e=!0}},[]),t)?(0,s.jsx)(s.Fragment,{children:e}):(0,s.jsx)("div",{className:"grid place-items-center py-16 text-sm text-neutral-500",children:"Loading…"})}function rZ(e,t){let r=e.map(e=>({...e,hex:rE(e,t)})),a=e=>r.find(t=>t.role===e)?.hex,i=[...r].sort((e,t)=>t.proportion-e.proportion),s=e=>i[Math.min(e,i.length-1)]?.hex??"#888888",l=a("background")??s(0),n=a("primary")??s(1),o=a("foreground")??s(2),d=a("accent")??s(3),c=a("muted")??s(4),h=a("border")??c,u=rS(l),x=r$(l,{dL:u<.4?.05:-.03,dC:0,dH:0});return{bg:l,surface:x,primary:n,fg:o,accent:d,muted:c,border:h}}function rQ(e,t){let r=e.startsWith("#")?e.slice(1):e,a=3===r.length?r.split("").map(e=>e+e).join(""):r.padEnd(6,"0").slice(0,6),i=parseInt(a.slice(0,2),16),s=parseInt(a.slice(2,4),16),l=parseInt(a.slice(4,6),16);return`rgba(${i},${s},${l},${t})`}function r0(e,t,r,a,i){return`M${e},${t+i} a${i},${i} 0 0 1 ${i},${-i} h${r-2*i} a${i},${i} 0 0 1 ${i},${i} v${a-i} h${-r} z`}function r1(){return(0,s.jsx)("defs",{children:(0,s.jsxs)("filter",{id:"card-shadow",x:"-20%",y:"-20%",width:"140%",height:"140%",children:[(0,s.jsx)("feGaussianBlur",{in:"SourceAlpha",stdDeviation:"3"}),(0,s.jsx)("feOffset",{dy:"2",result:"offsetblur"}),(0,s.jsx)("feComponentTransfer",{children:(0,s.jsx)("feFuncA",{type:"linear",slope:"0.08"})}),(0,s.jsxs)("feMerge",{children:[(0,s.jsx)("feMergeNode",{}),(0,s.jsx)("feMergeNode",{in:"SourceGraphic"})]})]})})}function r2({p:e}){return(0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{width:800,height:48,fill:e.surface}),(0,s.jsx)("rect",{y:47,width:800,height:1,fill:e.border}),(0,s.jsx)("rect",{x:20,y:16,width:16,height:16,fill:e.primary,rx:4}),(0,s.jsx)("rect",{x:44,y:20,width:56,height:8,fill:rQ(e.fg,.85),rx:2}),(0,s.jsx)("rect",{x:132,y:20,width:36,height:8,fill:rQ(e.fg,.5),rx:2}),(0,s.jsx)("rect",{x:184,y:20,width:44,height:8,fill:rQ(e.fg,.5),rx:2}),(0,s.jsx)("rect",{x:244,y:20,width:32,height:8,fill:rQ(e.fg,.5),rx:2}),(0,s.jsx)("rect",{x:320,y:12,width:220,height:24,fill:e.bg,stroke:e.border,rx:5}),(0,s.jsx)("circle",{cx:332,cy:24,r:4,fill:"none",stroke:rQ(e.fg,.4),strokeWidth:1.5}),(0,s.jsx)("rect",{x:340,y:20,width:60,height:8,fill:rQ(e.fg,.22),rx:2}),(0,s.jsx)("circle",{cx:672,cy:24,r:5,fill:"none",stroke:rQ(e.fg,.45),strokeWidth:1.2}),(0,s.jsx)("rect",{x:690,y:13,width:70,height:22,fill:e.primary,rx:5}),(0,s.jsx)("rect",{x:702,y:20,width:46,height:8,fill:rQ(e.bg,.85),rx:2}),(0,s.jsx)("circle",{cx:778,cy:24,r:10,fill:rQ(e.accent,.6)})]})}function r5({p:e}){return(0,s.jsxs)("svg",{viewBox:"0 0 800 520",style:{display:"block",width:"100%",height:"100%"},children:[(0,s.jsx)(r1,{}),(0,s.jsx)("rect",{width:800,height:520,fill:e.bg}),(0,s.jsx)(r2,{p:e}),(0,s.jsx)("rect",{x:48,y:80,width:88,height:20,fill:rQ(e.accent,.18),rx:10}),(0,s.jsx)("circle",{cx:60,cy:90,r:3,fill:e.accent}),(0,s.jsx)("rect",{x:72,y:87,width:54,height:6,fill:e.accent,rx:2}),(0,s.jsx)("rect",{x:48,y:114,width:300,height:26,fill:e.fg,rx:3}),(0,s.jsx)("rect",{x:48,y:148,width:236,height:26,fill:e.fg,rx:3}),(0,s.jsx)("rect",{x:48,y:190,width:300,height:10,fill:rQ(e.fg,.45),rx:2}),(0,s.jsx)("rect",{x:48,y:208,width:260,height:10,fill:rQ(e.fg,.45),rx:2}),(0,s.jsx)("rect",{x:48,y:226,width:180,height:10,fill:rQ(e.fg,.45),rx:2}),(0,s.jsx)("rect",{x:48,y:258,width:140,height:38,fill:e.primary,rx:8}),(0,s.jsx)("rect",{x:70,y:272,width:88,height:10,fill:rQ(e.bg,.85),rx:2}),(0,s.jsx)("rect",{x:200,y:258,width:120,height:38,fill:"none",stroke:e.border,strokeWidth:1.5,rx:8}),(0,s.jsx)("rect",{x:220,y:272,width:80,height:10,fill:rQ(e.fg,.55),rx:2}),(0,s.jsx)("rect",{x:48,y:316,width:108,height:8,fill:rQ(e.fg,.32),rx:2}),(0,s.jsx)("g",{children:[0,1,2,3].map(t=>(0,s.jsx)("circle",{cx:170+14*t,cy:320,r:8,fill:rQ(e.accent,.35+.1*t),stroke:e.bg,strokeWidth:1.5},t))}),(0,s.jsx)("rect",{x:232,y:316,width:88,height:8,fill:rQ(e.fg,.35),rx:2}),(0,s.jsx)("g",{filter:"url(#card-shadow)",children:(0,s.jsx)("rect",{x:420,y:72,width:328,height:224,fill:e.surface,stroke:e.border,rx:14})}),(0,s.jsx)("rect",{x:440,y:94,width:120,height:9,fill:rQ(e.fg,.55),rx:2}),(0,s.jsx)("rect",{x:440,y:110,width:80,height:7,fill:rQ(e.fg,.25),rx:2}),(0,s.jsx)("rect",{x:440,y:132,width:288,height:88,fill:rQ(e.accent,.08),rx:8}),(0,s.jsx)("path",{d:"M 452 200 L 488 168 L 524 184 L 560 142 L 596 156 L 632 124 L 668 138 L 712 110",fill:"none",stroke:e.accent,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),[488,524,560,596,632,668,712].map((t,r)=>(0,s.jsx)("circle",{cx:t,cy:[168,184,142,156,124,138,110][r],r:2.5,fill:e.accent},r)),(0,s.jsx)("rect",{x:440,y:232,width:88,height:48,fill:rQ(e.primary,.08),rx:6}),(0,s.jsx)("rect",{x:448,y:242,width:32,height:6,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:448,y:256,width:56,height:14,fill:e.primary,rx:2}),(0,s.jsx)("rect",{x:540,y:232,width:88,height:48,fill:rQ(e.accent,.08),rx:6}),(0,s.jsx)("rect",{x:548,y:242,width:32,height:6,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:548,y:256,width:56,height:14,fill:e.accent,rx:2}),(0,s.jsx)("rect",{x:640,y:232,width:88,height:48,fill:rQ(e.muted,.25),rx:6}),(0,s.jsx)("rect",{x:648,y:242,width:32,height:6,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:648,y:256,width:48,height:14,fill:rQ(e.fg,.7),rx:2}),(0,s.jsx)("rect",{x:0,y:316,width:800,height:148,fill:rQ(e.muted,.12)}),(0,s.jsx)("rect",{x:0,y:316,width:800,height:1,fill:e.border}),(0,s.jsx)("rect",{x:320,y:332,width:160,height:14,fill:rQ(e.fg,.7),rx:3}),(0,s.jsx)("rect",{x:344,y:354,width:112,height:9,fill:rQ(e.fg,.3),rx:2}),[0,1,2].map(t=>(0,s.jsxs)("g",{transform:`translate(${44+244*t}, 380)`,filter:"url(#card-shadow)",children:[(0,s.jsx)("rect",{width:216,height:68,fill:e.surface,stroke:e.border,rx:10}),(0,s.jsx)("circle",{cx:28,cy:34,r:14,fill:rQ(e.accent,.16)}),(0,s.jsx)("circle",{cx:28,cy:34,r:6,fill:e.accent}),(0,s.jsx)("rect",{x:52,y:20,width:88,height:10,fill:e.fg,rx:2}),(0,s.jsx)("rect",{x:52,y:38,width:148,height:7,fill:rQ(e.fg,.32),rx:2}),(0,s.jsx)("rect",{x:52,y:50,width:120,height:7,fill:rQ(e.fg,.32),rx:2})]},t)),(0,s.jsx)("rect",{x:0,y:464,width:800,height:56,fill:rQ(e.fg,.04)}),(0,s.jsx)("rect",{x:20,y:482,width:16,height:16,fill:rQ(e.primary,.55),rx:4}),(0,s.jsx)("rect",{x:44,y:486,width:56,height:8,fill:rQ(e.fg,.4),rx:2}),[0,1,2,3].map(t=>(0,s.jsx)("rect",{x:140+76*t,y:486,width:56,height:8,fill:rQ(e.fg,.25),rx:2},t)),(0,s.jsx)("circle",{cx:696,cy:490,r:9,fill:rQ(e.fg,.1)}),(0,s.jsx)("circle",{cx:722,cy:490,r:9,fill:rQ(e.fg,.1)}),(0,s.jsx)("circle",{cx:748,cy:490,r:9,fill:rQ(e.fg,.1)}),(0,s.jsx)("circle",{cx:774,cy:490,r:9,fill:rQ(e.fg,.1)})]})}function r4({p:e}){let t=[24,280,536];return(0,s.jsxs)("svg",{viewBox:"0 0 800 520",style:{display:"block",width:"100%",height:"100%"},children:[(0,s.jsx)(r1,{}),(0,s.jsx)("rect",{width:800,height:520,fill:e.bg}),(0,s.jsx)(r2,{p:e}),(0,s.jsx)("rect",{x:24,y:64,width:120,height:14,fill:e.fg,rx:3}),(0,s.jsx)("rect",{x:24,y:84,width:200,height:9,fill:rQ(e.fg,.4),rx:2}),[0,1,2,3,4].map(t=>(0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:400+76*t,y:68,width:68,height:22,fill:0===t?rQ(e.primary,.12):"none",stroke:0===t?e.primary:e.border,strokeWidth:1,rx:11}),(0,s.jsx)("rect",{x:414+76*t,y:74,width:40,height:9,fill:0===t?e.primary:rQ(e.fg,.32),rx:2})]},t)),[108,316].flatMap((r,a)=>t.map((t,i)=>(0,s.jsxs)("g",{transform:`translate(${t}, ${r})`,children:[(0,s.jsx)("g",{filter:"url(#card-shadow)",children:(0,s.jsx)("rect",{width:232,height:192,fill:e.surface,stroke:e.border,rx:12})}),(0,s.jsx)("path",{d:r0(0,0,232,104,12),fill:rQ(e.accent,.12)}),(0,s.jsx)("circle",{cx:92,cy:60,r:20,fill:rQ(e.accent,.35)}),(0,s.jsx)("circle",{cx:132,cy:44,r:28,fill:rQ(e.primary,.3)}),(0,s.jsx)("rect",{x:16,y:16,width:42,height:16,fill:e.bg,rx:8}),(0,s.jsx)("rect",{x:24,y:22,width:26,height:4,fill:e.primary,rx:2}),(0,s.jsx)("rect",{x:16,y:118,width:150,height:11,fill:e.fg,rx:2}),(0,s.jsx)("rect",{x:16,y:136,width:196,height:7,fill:rQ(e.fg,.32),rx:2}),(0,s.jsx)("rect",{x:16,y:148,width:160,height:7,fill:rQ(e.fg,.32),rx:2}),(0,s.jsx)("circle",{cx:24,cy:174,r:8,fill:rQ(e.muted,.5)}),(0,s.jsx)("rect",{x:38,y:170,width:60,height:8,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:176,y:164,width:44,height:20,fill:e.primary,rx:10}),(0,s.jsx)("rect",{x:186,y:170,width:24,height:8,fill:rQ(e.bg,.85),rx:2})]},`${a}-${i}`)))]})}function r6({p:e}){return(0,s.jsxs)("svg",{viewBox:"0 0 800 520",style:{display:"block",width:"100%",height:"100%"},children:[(0,s.jsx)(r1,{}),(0,s.jsx)("rect",{width:800,height:520,fill:e.bg}),(0,s.jsx)("rect",{x:0,y:0,width:360,height:520,fill:e.primary}),(0,s.jsx)("circle",{cx:88,cy:440,r:140,fill:rQ(e.bg,.06)}),(0,s.jsx)("circle",{cx:280,cy:460,r:64,fill:rQ(e.accent,.18)}),(0,s.jsx)("circle",{cx:48,cy:84,r:38,fill:rQ(e.bg,.1)}),(0,s.jsx)("rect",{x:48,y:48,width:28,height:28,fill:rQ(e.bg,.95),rx:7}),(0,s.jsx)("rect",{x:56,y:56,width:12,height:12,fill:e.primary,rx:3}),(0,s.jsx)("rect",{x:84,y:56,width:72,height:12,fill:rQ(e.bg,.85),rx:2}),(0,s.jsx)("rect",{x:48,y:172,width:260,height:20,fill:rQ(e.bg,.92),rx:3}),(0,s.jsx)("rect",{x:48,y:200,width:220,height:20,fill:rQ(e.bg,.92),rx:3}),(0,s.jsx)("rect",{x:48,y:228,width:180,height:20,fill:rQ(e.bg,.92),rx:3}),(0,s.jsx)("rect",{x:48,y:266,width:264,height:9,fill:rQ(e.bg,.55),rx:2}),(0,s.jsx)("rect",{x:48,y:282,width:232,height:9,fill:rQ(e.bg,.55),rx:2}),(0,s.jsx)("rect",{x:48,y:298,width:196,height:9,fill:rQ(e.bg,.55),rx:2}),(0,s.jsx)("rect",{x:48,y:344,width:264,height:104,fill:rQ(e.bg,.12),rx:10}),(0,s.jsx)("circle",{cx:68,cy:364,r:9,fill:rQ(e.bg,.45)}),(0,s.jsx)("rect",{x:86,y:358,width:60,height:8,fill:rQ(e.bg,.7),rx:2}),(0,s.jsx)("rect",{x:86,y:372,width:88,height:6,fill:rQ(e.bg,.4),rx:2}),(0,s.jsx)("rect",{x:64,y:394,width:232,height:7,fill:rQ(e.bg,.6),rx:2}),(0,s.jsx)("rect",{x:64,y:408,width:212,height:7,fill:rQ(e.bg,.6),rx:2}),(0,s.jsx)("rect",{x:64,y:422,width:176,height:7,fill:rQ(e.bg,.6),rx:2}),(0,s.jsx)("rect",{x:408,y:56,width:48,height:10,fill:rQ(e.fg,.45),rx:2}),(0,s.jsx)("rect",{x:700,y:52,width:44,height:18,fill:rQ(e.fg,.06),rx:9}),(0,s.jsx)("rect",{x:708,y:58,width:28,height:6,fill:e.accent,rx:2}),(0,s.jsx)("rect",{x:420,y:96,width:28,height:28,fill:e.primary,rx:7}),(0,s.jsx)("rect",{x:428,y:104,width:12,height:12,fill:rQ(e.bg,.9),rx:3}),(0,s.jsx)("rect",{x:420,y:140,width:156,height:16,fill:e.fg,rx:3}),(0,s.jsx)("rect",{x:420,y:166,width:220,height:9,fill:rQ(e.fg,.42),rx:2}),[{label:56,hint:132},{label:76,hint:96},{label:92,hint:116}].map((t,r)=>{let a=194+60*r,i=1===r;return(0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:420,y:a,width:t.label,height:9,fill:rQ(e.fg,.6),rx:2}),(0,s.jsx)("rect",{x:420,y:a+14,width:320,height:36,fill:e.bg,stroke:i?e.primary:e.border,strokeWidth:i?1.5:1,rx:6}),(0,s.jsx)("rect",{x:432,y:a+25,width:t.hint,height:9,fill:rQ(e.fg,i?.72:.25),rx:2}),2===r&&(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("circle",{cx:722,cy:a+32,r:5,fill:"none",stroke:rQ(e.fg,.4),strokeWidth:1.2}),(0,s.jsx)("rect",{x:720,y:a+35,width:4,height:6,fill:rQ(e.fg,.4),rx:1})]})]},r)}),(0,s.jsx)("rect",{x:420,y:382,width:14,height:14,fill:e.bg,stroke:e.border,rx:3}),(0,s.jsx)("rect",{x:442,y:386,width:56,height:8,fill:rQ(e.fg,.5),rx:2}),(0,s.jsx)("rect",{x:680,y:386,width:60,height:8,fill:e.accent,rx:2}),(0,s.jsx)("rect",{x:420,y:406,width:320,height:42,fill:e.primary,rx:8}),(0,s.jsx)("rect",{x:548,y:423,width:64,height:10,fill:rQ(e.bg,.9),rx:2}),(0,s.jsx)("rect",{x:420,y:432,width:145,height:1,fill:e.border}),(0,s.jsx)("rect",{x:572,y:428,width:16,height:8,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:595,y:432,width:145,height:1,fill:e.border}),(0,s.jsx)("rect",{x:420,y:448,width:154,height:36,fill:e.bg,stroke:e.border,rx:6}),(0,s.jsx)("circle",{cx:444,cy:466,r:6,fill:rQ(e.fg,.5)}),(0,s.jsx)("rect",{x:460,y:462,width:56,height:8,fill:rQ(e.fg,.55),rx:2}),(0,s.jsx)("rect",{x:586,y:448,width:154,height:36,fill:e.bg,stroke:e.border,rx:6}),(0,s.jsx)("circle",{cx:610,cy:466,r:6,fill:rQ(e.fg,.5)}),(0,s.jsx)("rect",{x:626,y:462,width:56,height:8,fill:rQ(e.fg,.55),rx:2})]})}function r3({p:e}){return(0,s.jsxs)("svg",{viewBox:"0 0 800 520",style:{display:"block",width:"100%",height:"100%"},children:[(0,s.jsx)(r1,{}),(0,s.jsx)("rect",{width:800,height:520,fill:e.bg}),(0,s.jsx)("rect",{width:200,height:520,fill:e.primary}),(0,s.jsx)("rect",{x:16,y:14,width:20,height:20,fill:rQ(e.bg,.92),rx:5}),(0,s.jsx)("rect",{x:44,y:20,width:84,height:10,fill:rQ(e.bg,.6),rx:2}),(0,s.jsx)("rect",{x:0,y:56,width:200,height:1,fill:rQ(e.bg,.15)}),Array.from({length:6}).map((t,r)=>{let a=0===r;return(0,s.jsxs)("g",{children:[a&&(0,s.jsx)("rect",{x:8,y:68+38*r,width:184,height:30,fill:rQ(e.bg,.18),rx:6}),(0,s.jsx)("rect",{x:20,y:75+38*r,width:14,height:14,fill:rQ(e.bg,a?.9:.45),rx:3}),(0,s.jsx)("rect",{x:42,y:78+38*r,width:64+r%3*14,height:8,fill:rQ(e.bg,a?.9:.4),rx:2})]},r)}),(0,s.jsx)("rect",{x:12,y:464,width:176,height:44,fill:rQ(e.bg,.1),rx:8}),(0,s.jsx)("circle",{cx:28,cy:486,r:12,fill:rQ(e.bg,.45)}),(0,s.jsx)("rect",{x:48,y:479,width:72,height:9,fill:rQ(e.bg,.6),rx:2}),(0,s.jsx)("rect",{x:48,y:492,width:48,height:7,fill:rQ(e.bg,.32),rx:2}),(0,s.jsx)("rect",{x:200,y:0,width:600,height:48,fill:e.surface}),(0,s.jsx)("rect",{x:200,y:47,width:600,height:1,fill:e.border}),(0,s.jsx)("rect",{x:220,y:16,width:108,height:14,fill:rQ(e.fg,.65),rx:2}),(0,s.jsx)("rect",{x:220,y:34,width:64,height:8,fill:rQ(e.fg,.32),rx:2}),(0,s.jsx)("circle",{cx:704,cy:24,r:6,fill:"none",stroke:rQ(e.fg,.4),strokeWidth:1.2}),(0,s.jsx)("rect",{x:724,y:13,width:56,height:22,fill:e.primary,rx:5}),(0,s.jsx)("rect",{x:732,y:20,width:40,height:8,fill:rQ(e.bg,.85),rx:2}),[0,1,2,3].map(t=>{let r=216+146*t,a=0===t;return(0,s.jsxs)("g",{filter:"url(#card-shadow)",children:[(0,s.jsx)("rect",{x:r,y:56,width:130,height:84,fill:e.surface,stroke:e.border,rx:10}),(0,s.jsx)("rect",{x:r+14,y:68,width:48,height:8,fill:rQ(e.fg,.5),rx:2}),(0,s.jsx)("rect",{x:r+14,y:82,width:68+4*t,height:22,fill:a?e.primary:rQ(e.fg,.85),rx:3}),(0,s.jsx)("path",{d:`M ${r+14} 130 L ${r+30} 122 L ${r+46} 126 L ${r+62} 118 L ${r+78} 122 L ${r+94} 112 L ${r+116} 116`,fill:"none",stroke:t%2==0?e.accent:e.primary,strokeWidth:1.5,strokeLinecap:"round"}),(0,s.jsx)("rect",{x:r+96,y:68,width:24,height:14,fill:rQ(t%2==0?e.accent:e.primary,.18),rx:3}),(0,s.jsx)("rect",{x:r+101,y:72,width:14,height:6,fill:t%2==0?e.accent:e.primary,rx:2})]},t)}),(0,s.jsx)("g",{filter:"url(#card-shadow)",children:(0,s.jsx)("rect",{x:216,y:152,width:568,height:196,fill:e.surface,stroke:e.border,rx:10})}),(0,s.jsx)("rect",{x:230,y:166,width:84,height:11,fill:rQ(e.fg,.6),rx:2}),(0,s.jsx)("rect",{x:230,y:181,width:140,height:7,fill:rQ(e.fg,.3),rx:2}),[{label:56,color:e.primary},{label:48,color:e.accent}].map((t,r)=>(0,s.jsxs)("g",{children:[(0,s.jsx)("circle",{cx:660+70*r,cy:172,r:3,fill:t.color}),(0,s.jsx)("rect",{x:668+70*r,y:168,width:t.label,height:8,fill:rQ(e.fg,.4),rx:2})]},r)),[0,1,2,3].map(t=>(0,s.jsx)("rect",{x:230,y:206+32*t,width:540,height:1,fill:rQ(e.fg,.05)},t)),(0,s.jsx)("path",{d:"M 230 320 L 230 280 L 296 256 L 362 270 L 428 240 L 494 252 L 560 224 L 626 234 L 692 212 L 740 232 L 740 320 Z",fill:rQ(e.primary,.15)}),(0,s.jsx)("path",{d:"M 230 280 L 296 256 L 362 270 L 428 240 L 494 252 L 560 224 L 626 234 L 692 212 L 740 232",fill:"none",stroke:e.primary,strokeWidth:2,strokeLinejoin:"round",strokeLinecap:"round"}),(0,s.jsx)("path",{d:"M 230 300 L 296 290 L 362 286 L 428 276 L 494 272 L 560 258 L 626 268 L 692 252 L 740 260",fill:"none",stroke:e.accent,strokeWidth:1.5,strokeLinejoin:"round",strokeDasharray:"3 2"}),[0,1,2,3,4,5,6].map(t=>(0,s.jsx)("rect",{x:222+80*t,y:336,width:28,height:6,fill:rQ(e.fg,.2),rx:2},t)),(0,s.jsx)("g",{filter:"url(#card-shadow)",children:(0,s.jsx)("rect",{x:216,y:362,width:568,height:148,fill:e.surface,stroke:e.border,rx:10})}),(0,s.jsx)("path",{d:r0(216,362,568,32,10),fill:rQ(e.muted,.2)}),[0,1,2,3].map(t=>(0,s.jsx)("rect",{x:232+132*t,y:374,width:64+8*t,height:9,fill:rQ(e.fg,.45),rx:2},t)),[0,1,2].map(t=>(0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:216,y:394+36*t,width:568,height:1,fill:e.border}),(0,s.jsx)("circle",{cx:242,cy:410+36*t,r:9,fill:rQ(e.accent,.3+.15*t)}),(0,s.jsx)("rect",{x:258,y:406+36*t,width:52+8*t,height:8,fill:rQ(e.fg,.55),rx:2}),(0,s.jsx)("rect",{x:258,y:418+36*t,width:36,height:6,fill:rQ(e.fg,.28),rx:2}),[1,2].map(r=>(0,s.jsx)("rect",{x:232+(r+1)*132,y:409+36*t,width:48+4*t,height:8,fill:rQ(e.fg,.32),rx:2},r)),(0,s.jsx)("rect",{x:716,y:406+36*t,width:52,height:16,fill:1===t?rQ(e.accent,.18):rQ(e.primary,.14),rx:8}),(0,s.jsx)("rect",{x:726,y:411+36*t,width:32,height:6,fill:1===t?e.accent:e.primary,rx:2})]},t))]})}function r8({p:e}){return(0,s.jsxs)("svg",{viewBox:"0 0 800 520",style:{display:"block",width:"100%",height:"100%"},children:[(0,s.jsx)(r1,{}),(0,s.jsx)("rect",{width:800,height:520,fill:e.bg}),(0,s.jsx)(r2,{p:e}),(0,s.jsx)("rect",{x:0,y:48,width:800,height:148,fill:rQ(e.accent,.08)}),(0,s.jsx)("rect",{x:0,y:48,width:800,height:1,fill:e.border}),(0,s.jsx)("rect",{x:152,y:66,width:36,height:6,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:194,y:66,width:48,height:6,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:248,y:66,width:60,height:6,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:152,y:84,width:64,height:18,fill:rQ(e.accent,.2),rx:9}),(0,s.jsx)("rect",{x:164,y:91,width:40,height:6,fill:e.accent,rx:2}),(0,s.jsx)("rect",{x:152,y:112,width:496,height:22,fill:e.fg,rx:3}),(0,s.jsx)("rect",{x:152,y:140,width:400,height:22,fill:e.fg,rx:3}),(0,s.jsx)("circle",{cx:165,cy:180,r:13,fill:rQ(e.primary,.35)}),(0,s.jsx)("rect",{x:184,y:170,width:88,height:9,fill:rQ(e.fg,.55),rx:2}),(0,s.jsx)("rect",{x:184,y:184,width:120,height:7,fill:rQ(e.fg,.3),rx:2}),(0,s.jsx)("rect",{x:0,y:196,width:800,height:1,fill:e.border}),(0,s.jsx)("rect",{x:152,y:216,width:496,height:11,fill:rQ(e.fg,.7),rx:2}),(0,s.jsx)("rect",{x:152,y:232,width:480,height:11,fill:rQ(e.fg,.7),rx:2}),(0,s.jsx)("rect",{x:152,y:248,width:440,height:11,fill:rQ(e.fg,.7),rx:2}),[0,1,2,3].map(t=>(0,s.jsx)("rect",{x:152,y:276+16*t,width:3===t?376:t%2==0?496:468,height:8,fill:rQ(e.fg,.32),rx:2},t)),(0,s.jsx)("rect",{x:152,y:356,width:496,height:64,fill:rQ(e.muted,.2),rx:8}),(0,s.jsx)("circle",{cx:212,cy:388,r:16,fill:rQ(e.accent,.3)}),(0,s.jsx)("rect",{x:236,y:380,width:120,height:9,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:236,y:394,width:80,height:6,fill:rQ(e.fg,.25),rx:2}),(0,s.jsx)("rect",{x:152,y:426,width:200,height:6,fill:rQ(e.fg,.3),rx:2}),(0,s.jsx)("rect",{x:152,y:448,width:496,height:56,fill:rQ(e.accent,.08),rx:8}),(0,s.jsx)("rect",{x:156,y:448,width:3,height:56,fill:e.accent,rx:1.5}),(0,s.jsx)("rect",{x:176,y:462,width:448,height:10,fill:rQ(e.fg,.55),rx:2}),(0,s.jsx)("rect",{x:176,y:480,width:240,height:10,fill:rQ(e.fg,.55),rx:2}),(0,s.jsx)("g",{filter:"url(#card-shadow)",children:(0,s.jsx)("rect",{x:672,y:216,width:132,height:84,fill:e.surface,stroke:e.border,rx:10})}),(0,s.jsx)("rect",{x:684,y:228,width:72,height:9,fill:rQ(e.fg,.55),rx:2}),(0,s.jsx)("rect",{x:684,y:244,width:108,height:1,fill:e.border}),[0,1,2].map(t=>(0,s.jsxs)("g",{children:[(0,s.jsx)("circle",{cx:690,cy:262+16*t,r:3,fill:e.accent}),(0,s.jsx)("rect",{x:698,y:259+16*t,width:70-t%3*8,height:7,fill:rQ(e.fg,.4),rx:2})]},t)),(0,s.jsx)("rect",{x:672,y:316,width:64,height:9,fill:rQ(e.fg,.5),rx:2}),[0,1,2,3].map(t=>(0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:672+t%2*70,y:336+26*Math.floor(t/2),width:62,height:18,fill:rQ(e.primary,.1),rx:9}),(0,s.jsx)("rect",{x:684+t%2*70,y:343+26*Math.floor(t/2),width:38-t%3*6,height:6,fill:e.primary,rx:2})]},t))]})}function r9({p:e}){return(0,s.jsxs)("svg",{viewBox:"0 0 800 520",style:{display:"block",width:"100%",height:"100%"},children:[(0,s.jsx)(r1,{}),(0,s.jsx)("rect",{width:800,height:520,fill:e.bg}),(0,s.jsx)(r2,{p:e}),(0,s.jsx)("rect",{x:260,y:72,width:280,height:20,fill:e.fg,rx:3}),(0,s.jsx)("rect",{x:200,y:102,width:400,height:9,fill:rQ(e.fg,.45),rx:2}),(0,s.jsx)("rect",{x:308,y:122,width:184,height:28,fill:rQ(e.muted,.25),rx:14}),(0,s.jsx)("rect",{x:312,y:126,width:88,height:20,fill:e.bg,rx:10}),(0,s.jsx)("rect",{x:330,y:132,width:52,height:8,fill:e.fg,rx:2}),(0,s.jsx)("rect",{x:408,y:132,width:68,height:8,fill:rQ(e.fg,.45),rx:2}),[{name:56,price:32,popular:!1,features:6,primary:!1},{name:72,price:40,popular:!0,features:6,primary:!0},{name:64,price:48,popular:!1,features:6,primary:!1}].map((t,r)=>{let a=46+244*r,i=t.popular?132:144,l=t.popular?328:304;return(0,s.jsxs)("g",{filter:"url(#card-shadow)",children:[(0,s.jsx)("rect",{x:a,y:i,width:220,height:l,fill:e.surface,stroke:t.popular?e.primary:e.border,strokeWidth:t.popular?2:1,rx:14}),t.popular&&(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("rect",{x:a+110-36,y:i-12,width:72,height:20,fill:e.primary,rx:10}),(0,s.jsx)("rect",{x:a+110-18,y:i-6,width:36,height:8,fill:rQ(e.bg,.9),rx:2})]}),(0,s.jsx)("rect",{x:a+24,y:i+28,width:t.name,height:12,fill:e.fg,rx:2}),(0,s.jsx)("rect",{x:a+24,y:i+48,width:172,height:8,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:a+24,y:i+62,width:140,height:8,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:a+24,y:i+86,width:12,height:22,fill:rQ(e.fg,.5),rx:2}),(0,s.jsx)("rect",{x:a+40,y:i+80,width:t.price,height:32,fill:e.fg,rx:3}),(0,s.jsx)("rect",{x:a+40+t.price+8,y:i+98,width:32,height:10,fill:rQ(e.fg,.4),rx:2}),(0,s.jsx)("rect",{x:a+24,y:i+124,width:172,height:1,fill:e.border}),Array.from({length:t.features}).map((r,l)=>(0,s.jsxs)("g",{children:[(0,s.jsx)("circle",{cx:a+32,cy:i+144+22*l,r:6,fill:rQ(t.popular?e.primary:e.accent,.15)}),(0,s.jsx)("path",{d:`M ${a+29} ${i+144+22*l} l 2 2 l 4 -4`,stroke:t.popular?e.primary:e.accent,strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round",fill:"none"}),(0,s.jsx)("rect",{x:a+46,y:i+140+22*l,width:140-13*l%36,height:8,fill:rQ(e.fg,.55),rx:2})]},l)),(0,s.jsx)("rect",{x:a+20,y:i+l-52,width:180,height:36,fill:t.primary?e.primary:"none",stroke:t.primary?"none":e.border,strokeWidth:1.5,rx:8}),(0,s.jsx)("rect",{x:a+110-32,y:i+l-52+14,width:64,height:8,fill:t.primary?rQ(e.bg,.9):rQ(e.fg,.7),rx:2})]},r)})]})}function r7({kind:e,palette:t}){switch(e){case"landing":return(0,s.jsx)(r5,{p:t});case"card":return(0,s.jsx)(r4,{p:t});case"form":return(0,s.jsx)(r6,{p:t});case"dashboard":return(0,s.jsx)(r3,{p:t});case"article":return(0,s.jsx)(r8,{p:t});case"pricing":return(0,s.jsx)(r9,{p:t})}}let ae=e=>e.toString(16).padStart(2,"0");async function at(e,t=6){var r;let a=await (r=e,new Promise((e,t)=>{let a=URL.createObjectURL(r),i=new Image;i.onload=()=>{URL.revokeObjectURL(a),e(i)},i.onerror=e=>{URL.revokeObjectURL(a),t(e)},i.src=a})),i=Math.min(1,200/Math.max(a.width,a.height)),s=Math.max(1,Math.round(a.width*i)),l=Math.max(1,Math.round(a.height*i)),n=document.createElement("canvas");n.width=s,n.height=l;let o=n.getContext("2d",{willReadFrequently:!0});if(!o)throw Error("canvas 2d context unavailable");o.drawImage(a,0,0,s,l);let d=o.getImageData(0,0,s,l).data,c=new Map;for(let e=0;e<d.length;e+=4){if(d[e+3]<128)continue;let t=d[e],r=d[e+1],a=d[e+2],i=t>>3<<10|r>>3<<5|a>>3,s=c.get(i);s?(s.r+=t,s.g+=r,s.b+=a,s.n+=1):c.set(i,{r:t,g:r,b:a,n:1})}let h=[...c.values()].sort((e,t)=>t.n-e.n),u=[];for(let e of h){let r=e.r/e.n,a=e.g/e.n,i=e.b/e.n,s=u.find(e=>38>Math.hypot(e.r/e.n-r,e.g/e.n-a,e.b/e.n-i));if(s?(s.r+=e.r,s.g+=e.g,s.b+=e.b,s.n+=e.n):u.push({...e}),u.length>=4*t)break}let x=u.slice(0,t),p=x.reduce((e,t)=>e+t.n,0)||1;return x.map(e=>{let t,r,a;return{hex:(t=Math.round(e.r/e.n),r=Math.round(e.g/e.n),a=Math.round(e.b/e.n),`#${ae(t)}${ae(r)}${ae(a)}`),proportion:e.n/p}})}function ar({onSuccess:e}){let t=A(),r=r_(e=>e.setColors),[a,i]=(0,l.useState)(!1),[n,o]=(0,l.useState)(null),[d,c]=(0,l.useState)(null),h=(0,l.useCallback)(async t=>{i(!0),o(null);try{var a;let i=await (a=t,new Promise((e,t)=>{let r=new FileReader;r.onload=()=>e(String(r.result)),r.onerror=t,r.readAsDataURL(a)}));c(i);let s=await at(t,6);r(s),e?.(i)}catch(e){o(e instanceof Error?e.message:"Failed to extract palette")}finally{i(!1)}},[r,e]);return(0,s.jsxs)("div",{onDrop:e=>{e.preventDefault();let t=e.dataTransfer.files?.[0];t&&t.type.startsWith("image/")&&h(t)},onDragOver:e=>e.preventDefault(),onPaste:e=>{let t=[...e.clipboardData.items].find(e=>e.type.startsWith("image/"));if(t){let e=t.getAsFile();e&&h(e)}},tabIndex:0,className:"relative grid place-items-center rounded-xl border-2 border-dashed border-neutral-300 bg-neutral-50 p-6 text-center transition hover:border-neutral-400 focus:border-neutral-500 focus:outline-none dark:border-neutral-700 dark:bg-neutral-900 dark:hover:border-neutral-500",style:{minHeight:160},children:[d?(0,s.jsx)("img",{src:d,alt:"uploaded",className:"max-h-36 rounded-lg shadow"}):(0,s.jsxs)("div",{className:"space-y-1",children:[(0,s.jsx)("div",{className:"text-sm font-medium",children:t("Drop an image / paste / choose a file","拖入图片 / 粘贴 / 选择文件")}),(0,s.jsx)("div",{className:"text-xs text-neutral-500",children:t("Extract dominant colors into design tokens","提取主色生成 design tokens")})]}),(0,s.jsx)("input",{suppressHydrationWarning:!0,type:"file",accept:"image/*",onChange:e=>{let t=e.target.files?.[0];t&&h(t)},className:"absolute inset-0 cursor-pointer opacity-0"}),a&&(0,s.jsx)("div",{className:"absolute inset-0 grid place-items-center rounded-xl bg-white/70 text-sm dark:bg-black/70",children:t("Extracting…","提取中…")}),n&&(0,s.jsx)("div",{className:"absolute bottom-2 left-2 right-2 rounded bg-red-50 p-2 text-xs text-red-700 dark:bg-red-950 dark:text-red-300",children:n})]})}let aa=new Map,ai=new Map;function as({brands:e,onPicked:t,className:r="grid grid-cols-2 gap-2.5 sm:grid-cols-3 md:grid-cols-5 lg:grid-cols-6 xl:grid-cols-8",emptyHint:a}){let i=A(),n=r_(e=>e.loadTokens),o=r_(e=>e.setTypography),d=r_(e=>e.setSpacing),c=r_(e=>e.setRadius),h=r_(e=>e.activeBrand),[u,x]=(0,l.useState)(null),[p,m]=(0,l.useState)(""),f=async e=>{if(!u){x(e),m("");try{let{colors:r,typography:a,spacing:s,radius:l}=await rY(e);if(0===r.length)throw Error(i("No colors extracted","未提取到颜色"));n(r,e),a&&Object.keys(a).length>0&&o(a),s&&Object.keys(s).length>0&&d(s),l&&Object.keys(l).length>0&&c(l),t?.(e)}catch(e){m(e instanceof Error?e.message:i("Load failed","加载失败"))}finally{x(null)}}};return(0,s.jsxs)("div",{className:"space-y-2",children:[(0,s.jsx)("div",{className:r,children:0===e.length?(0,s.jsx)("p",{className:"col-span-full p-3 text-xs text-neutral-400",children:a??i("No matching brands","无匹配品牌")}):e.map(e=>(0,s.jsx)(al,{brand:e,loading:u===e,active:h===e,disabled:null!==u,onSelect:()=>f(e)},e))}),p&&(0,s.jsx)("p",{className:"text-xs text-red-500",children:p})]})}function al({brand:e,loading:t,active:r,disabled:a,onSelect:i}){let n=(0,l.useRef)(null),o=function(e,t){let[r,a]=(0,l.useState)(()=>aa.get(e)),[i,s]=(0,l.useState)(e);return i!==e&&(s(e),a(aa.get(e))),(0,l.useEffect)(()=>{if(aa.has(e))return;let r=!1,i=()=>{(function(e){let t=ai.get(e);if(t)return t;let r=rU(e).then(t=>{let r=t.map(e=>e.hex).slice(0,6);return aa.set(e,r),ai.delete(e),r}).catch(t=>{throw ai.delete(e),t});return ai.set(e,r),r})(e).then(e=>{r||a(e)}).catch(()=>{})};if(!t?.current)return i(),()=>{r=!0};let s=new IntersectionObserver(e=>{e.some(e=>e.isIntersecting)&&(s.disconnect(),i())},{rootMargin:"200px"});return s.observe(t.current),()=>{r=!0,s.disconnect()}},[e,t]),r}(e,n);return(0,s.jsxs)("button",{ref:n,onClick:i,disabled:a,"aria-pressed":r,className:`group flex flex-col gap-2 rounded-lg border p-2 text-left transition disabled:cursor-wait ${r?"border-neutral-900 bg-neutral-50 ring-2 ring-neutral-900 dark:border-white dark:bg-neutral-900 dark:ring-white":"border-neutral-200 bg-white hover:border-neutral-900 hover:shadow-sm dark:border-neutral-800 dark:bg-neutral-900 dark:hover:border-white"}`,children:[(0,s.jsx)("div",{className:"flex h-6 gap-0.5 overflow-hidden rounded",children:o?o.map((e,t)=>(0,s.jsx)("div",{className:"flex-1",style:{background:e}},t)):(0,s.jsx)("div",{className:"flex-1 animate-pulse bg-neutral-100 dark:bg-neutral-800"})}),(0,s.jsxs)("div",{className:"flex items-center justify-between",children:[(0,s.jsx)("span",{className:"truncate text-[11px] font-medium",children:rP(e)}),(0,s.jsx)("span",{className:"shrink-0 text-[10px] text-neutral-400",children:t?"…":r?"✓":""})]})]})}function an({onPicked:e}){let t=A(),[r,a]=(0,l.useState)(""),i=(0,l.useMemo)(()=>{let e=r.toLowerCase().trim();return e?rB.filter(t=>t.includes(e)||rP(t).toLowerCase().includes(e)):rB},[r]);return(0,s.jsxs)("div",{className:"space-y-3",children:[(0,s.jsx)("input",{type:"text",placeholder:t("Search brands (e.g. stripe, notion…)","搜索品牌（如 stripe、notion…）"),value:r,onChange:e=>a(e.target.value),className:"w-full rounded-lg border border-neutral-300 bg-white px-3 py-1.5 text-xs outline-none focus:border-neutral-500 dark:border-neutral-700 dark:bg-neutral-900 dark:focus:border-neutral-500"}),(0,s.jsx)(as,{brands:i,onPicked:e})]})}let ao=new Set(["primary","accent","background","foreground","muted","border"]),ad=/^#[0-9a-fA-F]{6}$/,ac=e=>e&&"object"==typeof e&&!Array.isArray(e)?e:void 0,ah=e=>ac(e)?.$value,au=e=>{if("number"==typeof e&&Number.isFinite(e))return e;if("string"==typeof e){let t=/^(-?\d+(?:\.\d+)?)/.exec(e.trim());if(t)return parseFloat(t[1])}};function ax({onSuccess:e}){let t=A(),[r,a]=(0,l.useState)(""),[i,n]=(0,l.useState)(""),[o,d]=(0,l.useState)(!1),c=r=>{n("");try{var a;let t,i=(a=r,function(e){let t;try{t=ac(JSON.parse(e))}catch{throw Error(U("Not a valid JSON file","不是有效的 JSON 文件"))}if(!t)throw Error(U("Not a valid JSON file","不是有效的 JSON 文件"));let r=ac(t.color);if(!r)throw Error(U("Missing the color group — is this a design.md exported by this tool?","缺少 color 分组——这不是本工具导出的 design.md？"));let a=[],i=[];for(let[e,t]of Object.entries(r)){let r=ah(t);if("string"!=typeof r||!ad.test(r))continue;let s=r.toLowerCase();a.push({id:e,hex:s,baseHex:s,proportion:1,role:ao.has(e)?e:"unassigned",name:e});let l=ac(ac(ac(t)?.$extensions)?.["design-pact"])?.dark;i.push("string"==typeof l&&ad.test(l)?l.toLowerCase():void 0)}if(0===a.length)throw Error(U("No recognizable colors in the color group","color 分组里没有可识别的颜色"));let s={colors:a};i.some(e=>void 0!==e)&&(s.darkHexes=i);let l=ac(t.typography);if(l){let e={},t=ac(ac(l.$extensions)?.["design-pact"]),r=au(t?.base),a=au(t?.ratio);r&&(e.base=r),a&&(e.ratio=a);let i=ac(l.fontFamily),n=ah(i?.body),o=ah(i?.heading);"string"==typeof n&&n&&(e.fontFamily=n),"string"==typeof o&&o&&(e.headingFamily=o);let d=au(ah(l.fontWeight));d&&(e.fontWeight=d);let c=au(ah(l.lineHeight));c&&(e.lineHeight=c);let h=au(ah(l.letterSpacing));void 0!==h&&(e.letterSpacing=h),Object.keys(e).length>0&&(s.typography=e)}let n=au(ah(ac(t.spacing)?.xxs));n&&(s.spacing={base:n});let o=au(ah(ac(t.borderRadius)?.md));o&&(s.radius={base:o});let d=au(ah(ac(t.borderWidth)?.default));d&&(s.border={base:d});let c=au(ah(ac(t.opacity)?.hover));c&&(s.opacity={base:c});let h=ac(t.shadow);if(h){let e={};for(let t of["sm","md","lg"]){let r=ah(h[t]);if("string"!=typeof r)continue;let a=/^0\s+(-?[\d.]+)px\s+([\d.]+)px\s+0\s+rgba\(0,\s*0,\s*0,\s*([\d.]+)\)$/.exec(r.trim());a&&(e[t]={offsetY:parseFloat(a[1]),blur:parseFloat(a[2]),opacity:parseFloat(a[3])})}e.sm&&e.md&&e.lg&&(s.shadow={intensity:.5,advanced:!0,sm:e.sm,md:e.md,lg:e.lg})}let u=ac(t.motion);if(u){let e={},t=au(ah(u["duration-normal"]));t&&(e.base=t);let r=ah(u.easing);if("string"==typeof r){let t=Object.keys(O).find(e=>O[e]===r.trim()||e===r.trim());t&&(e.easing=t)}Object.keys(e).length>0&&(s.motion=e)}return s}(((t=a.match(/```json\s*\n([\s\S]*?)\n```/i))?t[1]:null)??a)),s=r_.getState();if(s.loadTokens(i.colors,null),i.typography&&s.setTypography(i.typography),i.spacing&&s.setSpacing(i.spacing),i.radius&&s.setRadius(i.radius),i.motion&&s.setMotion(i.motion),i.border&&s.setBorder(i.border),i.opacity&&s.setOpacity(i.opacity),i.shadow&&r_.setState({shadow:i.shadow}),i.darkHexes){let e={};i.darkHexes.forEach((t,r)=>{t&&(e[`c${r}`]=t)}),r_.setState({dark:{enabled:!0,overrides:e}})}e?.()}catch(e){n(e instanceof Error?e.message:t("Parse failed","解析失败"))}},h=async e=>{e&&c(await e.text())};return(0,s.jsxs)("div",{className:"space-y-3",children:[(0,s.jsx)("p",{className:"text-xs text-neutral-500 dark:text-neutral-400",children:t("Import a design.md you downloaded earlier to restore the whole design system.","导入之前下载的 design.md，恢复整套设计系统。")}),(0,s.jsxs)("label",{onDragOver:e=>{e.preventDefault(),d(!0)},onDragLeave:()=>d(!1),onDrop:e=>{e.preventDefault(),d(!1),h(e.dataTransfer.files?.[0])},className:`block cursor-pointer rounded-lg border border-dashed px-4 py-6 text-center text-sm transition ${o?"border-neutral-900 bg-neutral-50 text-neutral-900 dark:border-white dark:bg-neutral-900 dark:text-white":"border-neutral-300 text-neutral-500 hover:border-neutral-500 dark:border-neutral-700 dark:text-neutral-400"}`,children:[o?t("Release to import design.md","松开导入 design.md"):t("Click to choose, or drag design.md here","点击选择，或拖拽 design.md 到这里"),(0,s.jsx)("input",{type:"file",accept:".md,text/markdown",className:"hidden",onChange:e=>void h(e.target.files?.[0])})]}),(0,s.jsxs)("div",{className:"space-y-2",children:[(0,s.jsx)("textarea",{value:r,onChange:e=>a(e.target.value),placeholder:t("Or paste design.md contents directly…","或直接粘贴 design.md 内容…"),rows:4,className:"w-full resize-none rounded-lg border border-neutral-300 bg-white p-3 font-mono text-xs outline-none transition focus:border-neutral-500 dark:border-neutral-700 dark:bg-neutral-900"}),(0,s.jsx)("button",{onClick:()=>c(r),disabled:!r.trim(),className:"rounded-lg bg-neutral-900 px-4 py-2 text-sm font-medium text-white transition hover:bg-neutral-700 disabled:cursor-not-allowed disabled:opacity-40 dark:bg-white dark:text-black dark:hover:bg-neutral-200",children:t("Import","导入")})]}),i&&(0,s.jsx)("div",{className:"rounded-lg bg-red-50 px-4 py-3 text-xs text-red-700 dark:bg-red-950 dark:text-red-300",children:i})]})}function ap({onSuccess:e}={}){let t=A(),[r,a]=(0,l.useState)("template");return(0,s.jsxs)("div",{children:[(0,s.jsx)("div",{className:"mb-3 flex gap-1 border-b border-neutral-200 dark:border-neutral-800",children:[["template",t("Templates","模板")],["image",t("Image","图片")],["json",t("Import agent palette","导入 agent 配色")]].map(([e,t])=>(0,s.jsx)("button",{onClick:()=>a(e),className:`-mb-px border-b-2 px-3 py-1.5 text-sm ${r===e?"border-neutral-900 font-medium dark:border-white":"border-transparent text-neutral-500 hover:text-neutral-900 dark:hover:text-white"}`,children:t},e))}),"template"===r?(0,s.jsx)(an,{onPicked:()=>e?.()}):"image"===r?(0,s.jsx)(ar,{onSuccess:()=>e?.()}):(0,s.jsx)(ax,{onSuccess:()=>e?.()})]})}let am={dL:0,dC:0,dH:0},af=["background","primary","accent","foreground","muted","border"];function ag({onLoaded:e}){let t=rD(e=>e.palettes),r=rD(e=>e.matches),a=r_(e=>e.loadTokens),i=t.length>0,n=A(),[o,d]=(0,l.useState)(null),[c,h]=(0,l.useState)(!i),u=()=>{d(null),e()};return(0,s.jsx)("section",{id:"step-describe",className:"flex min-h-screen snap-start flex-col justify-center px-6 py-16",children:(0,s.jsxs)("div",{className:"mx-auto w-full max-w-[1440px] space-y-6",children:[(0,s.jsxs)("header",{className:"max-w-2xl space-y-2",children:[(0,s.jsx)("p",{className:"text-xs font-medium uppercase tracking-wider text-neutral-400",children:"Step 1 / 5"}),(0,s.jsx)("h1",{className:"text-3xl font-semibold tracking-tight",children:i?n("Pick a palette","选一套配色"):n("Start a design system","开始一套设计系统")}),(0,s.jsx)("p",{className:"text-sm leading-relaxed text-neutral-500 dark:text-neutral-400",children:i?(0,s.jsx)(s.Fragment,{children:n("Click one to load it and fine-tune in Colors — you can come back and switch anytime.","点一套即载入、进入「调色」微调，可随时回来换选。")}):(0,s.jsx)(s.Fragment,{children:n("Pick a starting point: a brand template, extract from an image, or import a palette from your agent.","选个起点：品牌模板、上传图片取色，或导入 agent 给的配色。")})})]}),i&&(0,s.jsx)("div",{className:"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3",children:t.map((t,r)=>(0,s.jsx)(ab,{index:r,candidate:t,selected:o===r,onPick:()=>{a(t.palette,null),d(r),e()}},r))}),r.length>0&&(0,s.jsxs)("section",{className:"space-y-3 rounded-xl border border-neutral-200 p-4 dark:border-neutral-800",children:[(0,s.jsxs)("header",{className:"space-y-1",children:[(0,s.jsx)("h2",{className:"text-sm font-semibold",children:n("Same-category real products","同类真实产品")}),(0,s.jsx)("p",{className:"text-xs text-neutral-500 dark:text-neutral-400",children:n(`Real brand designs in the same category as your product (${r.length} total). Click any to apply its colors and fonts, or keep using the palettes above.`,`和你的产品同类型的真实品牌设计（共 ${r.length} 个）。可点任意一个直接套用它的配色与字体，或继续用上面的方案。`)})]}),(0,s.jsx)(as,{brands:r,onPicked:u,className:"grid grid-cols-2 gap-2.5 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5"})]}),(0,s.jsxs)("details",{open:c,onToggle:e=>h(e.currentTarget.open),className:"rounded-xl border border-neutral-200 dark:border-neutral-800",children:[(0,s.jsxs)("summary",{className:"cursor-pointer select-none list-none px-4 py-3 text-sm font-medium text-neutral-600 transition hover:text-neutral-900 dark:text-neutral-400 dark:hover:text-white",children:[r.length>0?n("All brand templates / image / import palette","全部品牌模板 / 图片 / 导入配色"):n("Or: start from a brand template / image / imported palette","或：从品牌模板 / 图片 / 导入配色开始"),(0,s.jsxs)("span",{className:"ml-1 text-neutral-400",children:["（",c?n("collapse","收起"):n("expand","展开"),"）"]})]}),(0,s.jsx)("div",{className:"border-t border-neutral-200 p-3 dark:border-neutral-800",children:(0,s.jsx)(ap,{onSuccess:u})})]}),(0,s.jsx)("p",{className:"max-w-2xl text-xs text-neutral-400",children:n("When it's dialed in, download design.md from Export and drop it back in your project for the agent to build UI from.","调好后在「导出」区下载 design.md，丢回项目让 agent 据此生成 UI。")})]})})}function ab({index:e,candidate:t,selected:r,onPick:a}){let{palette:i,name:n,description:o}=t,d=A(),c=(0,l.useMemo)(()=>rZ(i,am),[i]),h=(0,l.useMemo)(()=>[...i].sort((e,t)=>af.indexOf(e.role)-af.indexOf(t.role)).map(e=>e.hex),[i]);return(0,s.jsxs)("button",{onClick:a,"aria-pressed":r,className:`group relative flex flex-col overflow-hidden rounded-xl border p-2 text-left transition ${r?"border-neutral-900 ring-2 ring-neutral-900 dark:border-white dark:ring-white":"border-neutral-200 bg-white hover:border-neutral-900 hover:shadow-md dark:border-neutral-800 dark:bg-neutral-900 dark:hover:border-white"}`,children:[r&&(0,s.jsxs)("span",{className:"absolute right-2 top-2 z-10 rounded-full bg-neutral-900 px-2 py-0.5 text-[10px] font-medium text-white dark:bg-white dark:text-black",children:["✓ ",d("Selected","已选")]}),(0,s.jsx)("div",{className:"aspect-[800/520] overflow-hidden rounded-lg border border-neutral-200 dark:border-neutral-800",children:(0,s.jsx)(r7,{kind:"landing",palette:c})}),(0,s.jsxs)("div",{className:"space-y-1.5 px-1 pb-0.5 pt-2",children:[(0,s.jsxs)("div",{className:"flex items-center justify-between gap-2",children:[(0,s.jsx)("span",{className:"truncate text-sm font-medium text-neutral-900 dark:text-white",children:n??d(`Palette ${e+1}`,`方案 ${e+1}`)}),(0,s.jsx)("span",{className:`shrink-0 text-xs ${r?"font-medium text-neutral-900 dark:text-white":"text-neutral-400 group-hover:text-neutral-900 dark:group-hover:text-white"}`,children:r?d("Selected","已选"):d("Pick this →","选这套 →")})]}),o&&(0,s.jsx)("p",{className:"line-clamp-2 text-xs leading-relaxed text-neutral-500 dark:text-neutral-400",children:o}),(0,s.jsx)("span",{className:"flex h-3.5 overflow-hidden rounded",children:h.map((e,t)=>(0,s.jsx)("span",{className:"flex-1",style:{background:e}},t))})]})]})}let ay=[{id:"step-describe",en:"Start",zh:"开始"},{id:"step-edit",en:"Colors",zh:"调色"},{id:"step-typography",en:"Type",zh:"字体"},{id:"step-tokens",en:"Details",zh:"细节"},{id:"step-motion",en:"Motion",zh:"动效"},{id:"step-export",en:"Export",zh:"导出"}];function av(){let e=r_(e=>e.colors.length>0),t=A(),r=j(),[a,i]=(0,l.useState)("step-describe"),[n,o]=(0,l.useState)(null),d=e?ay:ay.slice(0,1);(0,l.useEffect)(()=>{let e=0,t=()=>{e=0;let t=d[0].id;for(let e of d){let r=document.getElementById(e.id);if(r)if(r.getBoundingClientRect().top-96<=0)t=e.id;else break}window.innerHeight+window.scrollY>=document.documentElement.scrollHeight-4&&(t=d[d.length-1].id),i(t)},r=()=>{e||(e=requestAnimationFrame(t))};return t(),window.addEventListener("scroll",r,{passive:!0}),window.addEventListener("resize",r,{passive:!0}),()=>{window.removeEventListener("scroll",r),window.removeEventListener("resize",r),e&&cancelAnimationFrame(e)}},[d]);let c=e=>{if(r)r.scrollTo(`#${e}`,{duration:1.2,offset:-64});else{let t=document.getElementById(e);t&&window.scrollTo({top:t.offsetTop+-64,behavior:"smooth"})}},h=Math.max(0,d.findIndex(e=>e.id===a)),u=d[h],x=u?t(u.en,u.zh):"";return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("nav",{"aria-label":t("Workflow navigation","工作流导航"),className:"fixed inset-x-0 bottom-0 z-40 border-t border-neutral-200 bg-white/90 backdrop-blur min-[1600px]:hidden dark:border-neutral-800 dark:bg-black/85",children:(0,s.jsxs)("div",{className:"flex items-center gap-3 px-4 py-2.5",children:[(0,s.jsx)("div",{className:"flex flex-1 items-center gap-1.5",children:d.map((e,r)=>{let i=a===e.id;return(0,s.jsx)("button",{onClick:()=>c(e.id),"aria-label":t(e.en,e.zh),"aria-current":i?"step":void 0,className:"flex-1 cursor-pointer py-1.5",children:(0,s.jsx)("span",{className:`block h-1 rounded-full transition-all duration-300 ease-out ${i?"bg-neutral-900 dark:bg-white":r<h?"bg-neutral-400 dark:bg-neutral-500":"bg-neutral-200 dark:bg-neutral-700"}`})},e.id)})}),(0,s.jsxs)("span",{className:"animate-nav-label shrink-0 text-xs font-medium text-neutral-900 tabular-nums dark:text-white",children:[x,(0,s.jsxs)("span",{className:"ml-1 text-neutral-400",children:[h+1,"/",d.length]})]},a)]})}),(0,s.jsx)("nav",{"aria-label":t("Workflow navigation","工作流导航"),onMouseLeave:()=>o(null),className:"fixed right-5 top-16 z-40 hidden flex-col items-end gap-3 min-[1600px]:flex",children:d.map(e=>{let r=a===e.id,i=r||n===e.id;return(0,s.jsxs)("button",{onClick:()=>c(e.id),onMouseEnter:()=>o(e.id),"aria-current":r?"step":void 0,"aria-label":t(e.en,e.zh),className:"group relative flex h-4 cursor-pointer items-center justify-end",children:[(0,s.jsx)("span",{className:`whitespace-nowrap text-xs leading-none transition-opacity duration-200 ${i?"opacity-100":"opacity-0"} ${r?"font-semibold text-neutral-900 dark:text-white":"text-neutral-700 dark:text-neutral-200"}`,children:t(e.en,e.zh)}),(0,s.jsx)("span",{"aria-hidden":!0,className:`pointer-events-none absolute right-0 top-1/2 h-0.5 w-3.5 -translate-y-1/2 rounded-full bg-neutral-300 transition-opacity duration-200 dark:bg-neutral-600 ${i?"opacity-0":"opacity-100"}`})]},e.id)})})]})}function aw(){return(aw=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e}).apply(this,arguments)}function aj(e,t){if(null==e)return{};var r,a,i={},s=Object.keys(e);for(a=0;a<s.length;a++)t.indexOf(r=s[a])>=0||(i[r]=e[r]);return i}function ak(e){var t=(0,l.useRef)(e),r=(0,l.useRef)(function(e){t.current&&t.current(e)});return t.current=e,r.current}var aN,aM=function(e,t,r){return void 0===t&&(t=0),void 0===r&&(r=1),e>r?r:e<t?t:e},a$=function(e){return"touches"in e},aS=function(e){return e&&e.ownerDocument.defaultView||self},az=function(e,t,r){var a=e.getBoundingClientRect(),i=a$(t)?function(e,t){for(var r=0;r<e.length;r++)if(e[r].identifier===t)return e[r];return e[0]}(t.touches,r):t;return{left:aM((i.pageX-(a.left+aS(e).pageXOffset))/a.width),top:aM((i.pageY-(a.top+aS(e).pageYOffset))/a.height)}},aC=function(e){a$(e)||e.preventDefault()},aE=l.default.memo(function(e){var t=e.onMove,r=e.onKey,a=aj(e,["onMove","onKey"]),i=(0,l.useRef)(null),s=ak(t),n=ak(r),o=(0,l.useRef)(null),d=(0,l.useRef)(!1),c=(0,l.useMemo)(function(){var e=function(e){aC(e),(a$(e)?e.touches.length>0:e.buttons>0)&&i.current?s(az(i.current,e,o.current)):r(!1)},t=function(){return r(!1)};function r(r){var a=d.current,s=aS(i.current),l=r?s.addEventListener:s.removeEventListener;l(a?"touchmove":"mousemove",e),l(a?"touchend":"mouseup",t)}return[function(e){var t=e.nativeEvent,a=i.current;if(a&&(aC(t),(!d.current||a$(t))&&a)){if(a$(t)){d.current=!0;var l=t.changedTouches||[];l.length&&(o.current=l[0].identifier)}a.focus(),s(az(a,t,o.current)),r(!0)}},function(e){var t=e.which||e.keyCode;t<37||t>40||(e.preventDefault(),n({left:39===t?.05:37===t?-.05:0,top:40===t?.05:38===t?-.05:0}))},r]},[n,s]),h=c[0],u=c[1],x=c[2];return(0,l.useEffect)(function(){return x},[x]),l.default.createElement("div",aw({},a,{onTouchStart:h,onMouseDown:h,className:"react-colorful__interactive",ref:i,onKeyDown:u,tabIndex:0,role:"slider"}))}),aL=function(e){return e.filter(Boolean).join(" ")},aF=function(e){var t=e.color,r=e.left,a=e.top,i=aL(["react-colorful__pointer",e.className]);return l.default.createElement("div",{className:i,style:{top:100*(void 0===a?.5:a)+"%",left:100*r+"%"}},l.default.createElement("div",{className:"react-colorful__pointer-fill",style:{backgroundColor:t}}))},aH=function(e,t,r){return void 0===t&&(t=0),void 0===r&&(r=Math.pow(10,t)),Math.round(r*e)/r},aI=function(e){return"#"===e[0]&&(e=e.substring(1)),e.length<6?{r:parseInt(e[0]+e[0],16),g:parseInt(e[1]+e[1],16),b:parseInt(e[2]+e[2],16),a:4===e.length?aH(parseInt(e[3]+e[3],16)/255,2):1}:{r:parseInt(e.substring(0,2),16),g:parseInt(e.substring(2,4),16),b:parseInt(e.substring(4,6),16),a:8===e.length?aH(parseInt(e.substring(6,8),16)/255,2):1}},aR=function(e){var t=e.s,r=e.v,a=e.a,i=(200-t)*r/100;return{h:aH(e.h),s:aH(i>0&&i<200?t*r/100/(i<=100?i:200-i)*100:0),l:aH(i/2),a:aH(a,2)}},aT=function(e){var t=aR(e);return"hsl("+t.h+", "+t.s+"%, "+t.l+"%)"},aO=function(e){var t=e.h,r=e.s,a=e.v,i=e.a;t=t/360*6,r/=100,a/=100;var s=Math.floor(t),l=a*(1-r),n=a*(1-(t-s)*r),o=a*(1-(1-t+s)*r),d=s%6;return{r:aH(255*[a,n,l,l,o,a][d]),g:aH(255*[o,a,a,n,l,l][d]),b:aH(255*[l,l,o,a,a,n][d]),a:aH(i,2)}},aW=function(e){var t=e.toString(16);return t.length<2?"0"+t:t},a_=function(e){var t=e.r,r=e.g,a=e.b,i=e.a,s=i<1?aW(aH(255*i)):"";return"#"+aW(t)+aW(r)+aW(a)+s},aD=function(e){var t=e.r,r=e.g,a=e.b,i=e.a,s=Math.max(t,r,a),l=s-Math.min(t,r,a),n=l?s===t?(r-a)/l:s===r?2+(a-t)/l:4+(t-r)/l:0;return{h:aH(60*(n<0?n+6:n)),s:aH(s?l/s*100:0),v:aH(s/255*100),a:i}},aB=l.default.memo(function(e){var t=e.hue,r=e.onChange,a=aL(["react-colorful__hue",e.className]);return l.default.createElement("div",{className:a},l.default.createElement(aE,{onMove:function(e){r({h:360*e.left})},onKey:function(e){r({h:aM(t+360*e.left,0,360)})},"aria-label":"Hue","aria-valuenow":aH(t),"aria-valuemax":"360","aria-valuemin":"0"},l.default.createElement(aF,{className:"react-colorful__hue-pointer",left:t/360,color:aT({h:t,s:100,v:100,a:1})})))}),aP=l.default.memo(function(e){var t=e.hsva,r=e.onChange,a={backgroundColor:aT({h:t.h,s:100,v:100,a:1})};return l.default.createElement("div",{className:"react-colorful__saturation",style:a},l.default.createElement(aE,{onMove:function(e){r({s:100*e.left,v:100-100*e.top})},onKey:function(e){r({s:aM(t.s+100*e.left,0,100),v:aM(t.v-100*e.top,0,100)})},"aria-label":"Color","aria-valuetext":"Saturation "+aH(t.s)+"%, Brightness "+aH(t.v)+"%"},l.default.createElement(aF,{className:"react-colorful__saturation-pointer",top:1-t.v/100,left:t.s/100,color:aT(t)})))}),aA=function(e,t){if(e===t)return!0;for(var r in e)if(e[r]!==t[r])return!1;return!0},aU="u">typeof window?l.useLayoutEffect:l.useEffect,aY=new Map,aq=function(e){aU(function(){var t=e.current?e.current.ownerDocument:document;if(void 0!==t&&!aY.has(t)){var r=t.createElement("style");r.innerHTML='.react-colorful{position:relative;display:flex;flex-direction:column;width:200px;height:200px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}.react-colorful__saturation{position:relative;flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(0deg,#000,transparent),linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.react-colorful__alpha-gradient,.react-colorful__pointer-fill{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;border-radius:inherit}.react-colorful__alpha-gradient,.react-colorful__saturation{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.react-colorful__alpha,.react-colorful__hue{position:relative;height:24px}.react-colorful__hue{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.react-colorful__last-control{border-radius:0 0 8px 8px}.react-colorful__interactive{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:inherit;outline:none;touch-action:none}.react-colorful__pointer{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}.react-colorful__interactive:focus .react-colorful__pointer{transform:translate(-50%,-50%) scale(1.1)}.react-colorful__alpha,.react-colorful__alpha-pointer{background-color:#fff;background-image:url(\'data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>\')}.react-colorful__saturation-pointer{z-index:3}.react-colorful__hue-pointer{z-index:2}',aY.set(t,r);var a=aN||("u">typeof __webpack_nonce__?__webpack_nonce__:void 0);a&&r.setAttribute("nonce",a),t.head.appendChild(r)}},[])},aX=function(e){var t,r,a,i,s,n=e.className,o=e.colorModel,d=e.color,c=void 0===d?o.defaultColor:d,h=e.onChange,u=aj(e,["className","colorModel","color","onChange"]),x=(0,l.useRef)(null);aq(x);var p=(t=ak(h),a=(r=(0,l.useState)(function(){return o.toHsva(c)}))[0],i=r[1],s=(0,l.useRef)({color:c,hsva:a}),(0,l.useEffect)(function(){if(!o.equal(c,s.current.color)){var e=o.toHsva(c);s.current={hsva:e,color:c},i(e)}},[c,o]),(0,l.useEffect)(function(){var e;aA(a,s.current.hsva)||o.equal(e=o.fromHsva(a),s.current.color)||(s.current={hsva:a,color:e},t(e))},[a,o,t]),[a,(0,l.useCallback)(function(e){i(function(t){return Object.assign({},t,e)})},[])]),m=p[0],f=p[1],g=aL(["react-colorful",n]);return l.default.createElement("div",aw({},u,{ref:x,className:g}),l.default.createElement(aP,{hsva:m,onChange:f}),l.default.createElement(aB,{hue:m.h,onChange:f,className:"react-colorful__last-control"}))},aV={defaultColor:"000",toHsva:function(e){return aD(aI(e))},fromHsva:function(e){return a_(aO({h:e.h,s:e.s,v:e.v,a:1}))},equal:function(e,t){return e.toLowerCase()===t.toLowerCase()||aA(aI(e),aI(t))}},aG=function(e){return l.default.createElement(aX,aw({},e,{colorModel:aV}))};let aK=(e,t,r)=>Math.max(t,Math.min(r,e));function aJ(e,t){let r=e.find(e=>"background"===e.role)??e[0];return!!r&&rN(rE(r,t)).l<.5}function aZ(e,t,r){return r[e.id]??function(e,t){let r,a=rN(e),i=1-a.l,s=a.c;switch(t){case"background":r=a.l>=.5?aK(i,.14,.24):aK(i,.92,.985),s=Math.min(a.c,.04);break;case"foreground":r=a.l<.5?aK(i,.85,.97):aK(i,.12,.3);break;case"border":r=a.l>=.5?aK(i,.25,.38):aK(i,.7,.85),s=Math.min(a.c,.04);break;case"muted":r=aK(i,.55,.75);break;case"primary":case"accent":r=a.l<.55?aK(a.l+.18,.55,.8):a.l;break;default:r=aK(i,.2,.9)}return rM({mode:"oklch",l:r,c:s,h:a.h??0})}(rE(e,t),e.role)}function aQ(e,t,r){let a=e.map(e=>{let r=rE(e,t);return{...e,hex:r,baseHex:r}}),i=e.map(e=>{let a=aZ(e,t,r);return{...e,hex:a,baseHex:a}});return aJ(e,t)?{light:i,dark:a}:{light:a,dark:i}}let a0=["background","primary","foreground","accent","muted","border","unassigned"],a1={background:"bg-neutral-100 text-neutral-600 dark:bg-neutral-800 dark:text-neutral-300",primary:"bg-blue-100 text-blue-700 dark:bg-blue-900/40 dark:text-blue-300",foreground:"bg-neutral-800 text-white dark:bg-neutral-200 dark:text-neutral-900",accent:"bg-purple-100 text-purple-700 dark:bg-purple-900/40 dark:text-purple-300",muted:"bg-neutral-200 text-neutral-500 dark:bg-neutral-700 dark:text-neutral-400",border:"bg-neutral-100 text-neutral-500 ring-1 ring-neutral-300 dark:bg-neutral-900 dark:ring-neutral-700",unassigned:"bg-neutral-100 text-neutral-400 dark:bg-neutral-800 dark:text-neutral-500"},a2=126;function a5({globals:e,colors:t,onChange:r,onReset:a}){let i=A(),n=(0,l.useRef)(null),o=(0,l.useRef)(!1),d=(0,l.useRef)(null),c=(0,l.useRef)(e.dH);(0,l.useEffect)(()=>{c.current=e.dH},[e.dH]);let h=Math.min(1,Math.sqrt(Math.max(0,e.dC)/.08))*a2,u=e.dH*Math.PI/180,x=150+Math.cos(u)*h,p=150+Math.sin(u)*h,m=(0,l.useMemo)(()=>{let e=t.find(e=>"primary"===e.role),r=e?.baseHex??t.find(e=>rN(e.baseHex).c>.02)?.baseHex;return r?rN(r).h??0:null},[t]),f=(0,l.useMemo)(()=>{let e="radial-gradient(circle at 50% 50%,  rgba(140,140,140,0.92) 0%,  rgba(120,120,120,0.0) 46%)";if(null===m)return e;let t=[];for(let e=0;e<=24;e++){let r=e/24*360,a=rM({mode:"oklch",l:.65,c:.16,h:((m+ +(r>180?r-360:r))%360+360)%360});t.push(`${a} ${r.toFixed(1)}deg`)}return`${e}, conic-gradient(from 90deg, ${t.join(", ")})`},[m]),g=(0,l.useMemo)(()=>{if(null===m)return[];let r=a2-4,a=t.find(e=>"primary"===e.role)?.id,i=[];for(let s of t){if(s.id===a||"unassigned"===s.role)continue;let t=rN(s.baseHex);if(t.c<.02)continue;let l=(((((t.h??0)+e.dH)%360+360)%360-m)%360+540)%360-180;if(Math.abs(l)>180)continue;let n=l*Math.PI/180;i.push({id:s.id,hex:rE(s,e),x:150+Math.cos(n)*r,y:150+Math.sin(n)*r})}return i},[t,e,m]),b=(e,t)=>{let r=n.current?.getBoundingClientRect();if(!r)return null;let a=e-r.left-150,i=t-r.top-150;return{dx:a,dy:i,d:Math.sqrt(a*a+i*i)}},y=e=>{let t=Math.min(e,a2)/a2;return parseFloat((t*t*.08).toFixed(4))};return(0,s.jsxs)("section",{className:"rounded-xl border border-neutral-200 p-3 dark:border-neutral-800",children:[(0,s.jsxs)("div",{className:"mb-3 flex items-center justify-between",children:[(0,s.jsx)("h3",{className:"text-xs font-semibold",children:i("Global harmony (OKLCH)","全局协调调节 (OKLCH)")}),(0,s.jsx)("div",{className:"flex gap-2",children:(0,s.jsx)("button",{onClick:a,className:"rounded border border-neutral-300 px-2 py-0.5 text-xs hover:bg-neutral-100 dark:border-neutral-700 dark:hover:bg-neutral-800",children:i("Reset","重置")})})]}),(0,s.jsxs)("div",{className:"flex items-center gap-4",children:[(0,s.jsxs)("div",{className:"relative shrink-0",style:{width:300,height:300},children:[(0,s.jsx)("div",{className:"absolute inset-0 rounded-full border border-neutral-300 dark:border-neutral-600",style:{background:f}}),(0,s.jsxs)("svg",{ref:n,width:300,height:300,className:"absolute inset-0 cursor-crosshair select-none",onMouseDown:e=>{e.preventDefault(),o.current=!0;let t=b(e.clientX,e.clientY);if(t){let a={dC:y(t.d)};t.d>1&&(a.dH=parseFloat((+(180*Math.atan2(t.dy,t.dx)/Math.PI)).toFixed(1))),d.current={x:e.clientX,y:e.clientY},r(a)}let a=e=>{if(!o.current||!d.current)return;let t=b(e.clientX,e.clientY),a=b(d.current.x,d.current.y);if(!t||!a)return;let i={dC:y(t.d)},s=180*Math.atan2(a.dy,a.dx)/Math.PI,l=180*Math.atan2(t.dy,t.dx)/Math.PI-s;l>180&&(l-=360),l<-180&&(l+=360),i.dH=parseFloat((((parseFloat((c.current+ +l).toFixed(1))+180)%360+360)%360-180).toFixed(1)),c.current=i.dH,d.current={x:e.clientX,y:e.clientY},r(i)},i=()=>{o.current=!1,d.current=null,document.removeEventListener("mousemove",a),document.removeEventListener("mouseup",i)};document.addEventListener("mousemove",a),document.addEventListener("mouseup",i)},children:[(0,s.jsx)("circle",{cx:150,cy:150,r:a2,fill:"none",stroke:"rgba(255,255,255,0.22)",strokeWidth:1}),g.map(e=>(0,s.jsx)("circle",{cx:e.x,cy:e.y,r:4.5,fill:e.hex,stroke:"rgba(255,255,255,0.85)",strokeWidth:1.5,style:{filter:"drop-shadow(0 1px 2px rgba(0,0,0,0.4))"}},e.id)),(0,s.jsx)("circle",{cx:150,cy:150,r:2.5,fill:"rgba(255,255,255,0.65)"}),h>5&&(0,s.jsx)("line",{x1:150,y1:150,x2:x,y2:p,stroke:"rgba(255,255,255,0.55)",strokeWidth:1,strokeDasharray:"3 2"}),(0,s.jsx)("circle",{cx:x,cy:p,r:7,fill:"white",stroke:"rgba(0,0,0,0.22)",strokeWidth:1.5,style:{filter:"drop-shadow(0 1px 3px rgba(0,0,0,0.35))"}})]})]}),(0,s.jsxs)("div",{className:"flex flex-1 flex-col gap-3",children:[(0,s.jsxs)("label",{className:"flex flex-col gap-1 text-xs",children:[(0,s.jsxs)("span",{className:"flex items-center justify-between font-medium",children:[(0,s.jsx)("span",{children:i("Lightness ΔL","亮度 ΔL")}),(0,s.jsx)("span",{className:"font-mono text-neutral-500",children:e.dL.toFixed(3)})]}),(0,s.jsx)("input",{type:"range",min:-.3,max:.3,step:.005,value:e.dL,onChange:e=>r({dL:parseFloat(e.target.value)}),className:"accent-neutral-900 dark:accent-white"})]}),(0,s.jsxs)("dl",{className:"grid grid-cols-[auto_1fr] gap-x-2 gap-y-0.5 font-mono text-[10px]",children:[(0,s.jsx)("dt",{className:"text-neutral-400",children:"ΔH"}),(0,s.jsxs)("dd",{className:"text-neutral-600 dark:text-neutral-300",children:[e.dH.toFixed(1),"°"]}),(0,s.jsx)("dt",{className:"text-neutral-400",children:"ΔC"}),(0,s.jsx)("dd",{className:"text-neutral-600 dark:text-neutral-300",children:e.dC.toFixed(3)})]}),(0,s.jsx)("p",{className:"text-[10px] leading-snug text-neutral-400",children:i("Drag outward to add chroma (quadratic); the angle rotates hue (full 360°). Dots on the ring are each color's current hue.","向外拖动增加饱和度偏移（平方渐进），方向旋转色相（完整 360°）。圆环上的小点为各颜色当前色相位置。")})]})]})]})}let a4={background:0,primary:1,foreground:2,accent:3,muted:4,border:5,unassigned:6},a6=new Set(["background","primary"]);function a3({token:e,globals:t,isSelected:r,onToggle:a,hero:i,oppositeHex:l}){let n=A(),o=rE(e,t);return(0,s.jsxs)("button",{onClick:a,className:`overflow-hidden rounded-lg border text-left transition ${i?"col-span-2":"col-span-1"} ${r?"border-neutral-900 ring-2 ring-neutral-900 dark:border-white dark:ring-white":"border-neutral-200 hover:border-neutral-400 dark:border-neutral-800 dark:hover:border-neutral-600"}`,children:[(0,s.jsx)("div",{className:`relative w-full ${i?"h-24":"h-16"}`,style:{background:o},children:l&&(0,s.jsx)("span",{className:`absolute bottom-0 right-0 ${i?"h-9 w-9":"h-7 w-7"}`,style:{background:l,clipPath:"polygon(100% 0, 100% 100%, 0 100%)"},title:n(`Other face ${l}`,`另一面 ${l}`)})}),(0,s.jsxs)("div",{className:"px-2 py-1.5",children:[(0,s.jsx)("div",{className:"font-mono text-[10px] text-neutral-700 dark:text-neutral-300",children:o}),(0,s.jsx)("div",{className:`mt-1 inline-block rounded px-1.5 py-0.5 text-[9px] font-medium ${a1[e.role]}`,children:e.name??e.role})]})]})}function a8({token:e,globals:t,onUpdate:r,onRoleChange:a,onClose:i,paired:n,oppositeLabel:o,oppositeHex:d,oppositeOverridden:c,onOppositeChange:h,onOppositeReset:u}){let x=A(),p=rE(e,t),[m,f]=(0,l.useState)(e.baseHex),[g,b]=(0,l.useState)(!1),[y,v]=(0,l.useState)(e.id);return y!==e.id&&(v(e.id),f(e.baseHex),b(!1)),(0,s.jsxs)("div",{className:"mt-2 space-y-3 rounded-lg border border-neutral-200 p-3 dark:border-neutral-800",children:[(0,s.jsxs)("div",{className:"flex items-center justify-between",children:[(0,s.jsx)("span",{className:"font-mono text-xs font-medium",children:p}),(0,s.jsx)("button",{onClick:i,className:"rounded px-1.5 py-0.5 text-xs text-neutral-400 hover:bg-neutral-100 hover:text-neutral-900 dark:hover:bg-neutral-800 dark:hover:text-white",children:x("Collapse","收起")})]}),(0,s.jsx)("div",{children:(0,s.jsxs)("button",{onClick:()=>b(e=>!e),title:x("Click to change the role","点击调整用途"),className:`inline-flex items-center gap-1 rounded px-1.5 py-0.5 text-[10px] font-medium ${a1[e.role]}`,children:[e.role,(0,s.jsx)("span",{className:"opacity-50",children:g?"▴":"▾"})]})}),g&&(0,s.jsx)("div",{className:"flex flex-wrap gap-1",children:a0.map(t=>(0,s.jsx)("button",{onClick:()=>a(t),className:`rounded px-2 py-0.5 text-[10px] font-medium transition ${e.role===t?a1[t]+" ring-1 ring-current":"bg-neutral-100 text-neutral-500 hover:bg-neutral-200 dark:bg-neutral-800 dark:text-neutral-400 dark:hover:bg-neutral-700"}`,children:t},t))}),(0,s.jsxs)("div",{className:"flex flex-col gap-3 sm:flex-row sm:items-start",children:[(0,s.jsx)(aG,{color:m,onChange:e=>{f(e),r(e)}}),(0,s.jsx)("p",{className:"text-xs text-neutral-500",children:x("Editing this color resets its baseline — global adjustments start from the new value.","编辑此颜色会重置其基线 — 全局调节将以新值为起点。")})]}),n&&(0,s.jsxs)("div",{className:"flex items-center gap-2 border-t border-neutral-100 pt-3 dark:border-neutral-800",children:[(0,s.jsx)("span",{className:"text-[10px] text-neutral-500 dark:text-neutral-400",children:x(`${o} pair`,`${o}对应`)}),(0,s.jsx)("label",{className:"relative h-6 w-9 cursor-pointer overflow-hidden rounded border border-neutral-200 dark:border-neutral-700",style:{background:d},title:x(`Click to tweak the ${o}`,`点击微调${o}`),children:(0,s.jsx)("input",{type:"color",value:d,onChange:e=>h(e.target.value),className:"absolute inset-0 cursor-pointer opacity-0"})}),(0,s.jsx)("span",{className:"font-mono text-[10px] text-neutral-600 dark:text-neutral-300",children:d}),(0,s.jsx)("span",{className:"text-[10px] text-neutral-400",children:c?x("overridden","已覆盖"):x("auto","自动")}),c&&(0,s.jsx)("button",{onClick:u,className:"text-[10px] text-neutral-400 underline-offset-2 hover:underline",children:x("Reset","重置")})]})]})}function a9(){let e=r_(e=>e.dark.enabled),t=r_(e=>e.setDarkEnabled),r=r_(e=>e.colors.length>0),a=A();return r?(0,s.jsx)("button",{onClick:()=>t(!e),"aria-pressed":e,title:a("Generate a light/dark pair for every color, exported as @media (prefers-color-scheme)","为每个颜色生成亮暗配对，导出 @media (prefers-color-scheme)"),className:`shrink-0 rounded-full border px-3 py-1 text-xs transition ${e?"border-neutral-900 bg-neutral-900 text-white dark:border-white dark:bg-white dark:text-black":"border-neutral-300 text-neutral-600 hover:border-neutral-900 hover:text-neutral-900 dark:border-neutral-700 dark:text-neutral-400 dark:hover:border-white dark:hover:text-white"}`,children:e?a("✓ Light/dark pair","✓ 亮暗配对"):a("Light/dark pair","亮暗配对")}):null}function a7(){let e=r_(e=>e.colors),t=r_(e=>e.globals),r=r_(e=>e.dark),a=r_(e=>e.rolesUncertain),i=r_(e=>e.setGlobal),n=r_(e=>e.resetGlobals),o=r_(e=>e.updateColor),d=r_(e=>e.setRole),c=r_(e=>e.setDarkOverride),h=A(),[u,x]=(0,l.useState)(null),p=e.find(e=>e.id===u)??null,m=aJ(e,t)?h("light","亮色"):h("dark","暗色");return 0===e.length?null:(0,s.jsxs)("div",{className:"space-y-4",children:[(0,s.jsx)(a5,{globals:t,colors:e,onChange:i,onReset:n}),(0,s.jsxs)("section",{className:"rounded-xl border border-neutral-200 p-3 dark:border-neutral-800",children:[(0,s.jsxs)("h3",{className:"text-xs font-semibold",children:[h("Colors","颜色")," (",e.length,")"]}),a&&(0,s.jsx)("p",{className:"mb-2.5 mt-1 text-[10px] leading-relaxed text-amber-600 dark:text-amber-500",children:h("Color roles were guessed by proportion from the image/URL and may be off — click a swatch, then its role badge to correct it.","颜色用途是从图片/网址按比例自动推测的，可能不准 — 点色块后点用途标签可校正。")}),(0,s.jsx)("div",{className:`grid grid-cols-2 gap-2 sm:grid-cols-4 ${a?"":"mt-2.5"}`,children:[...e].sort((e,t)=>(a4[e.role]??9)-(a4[t.role]??9)).map(e=>(0,s.jsx)(a3,{token:e,globals:t,isSelected:u===e.id,onToggle:()=>x(u===e.id?null:e.id),hero:a6.has(e.role),oppositeHex:r.enabled?aZ(e,t,r.overrides):null},e.id))}),p&&(0,s.jsx)(a8,{token:p,globals:t,onUpdate:e=>o(p.id,{hex:e}),onRoleChange:e=>d(p.id,e),onClose:()=>x(null),paired:r.enabled,oppositeLabel:m,oppositeHex:aZ(p,t,r.overrides),oppositeOverridden:p.id in r.overrides,onOppositeChange:e=>c(p.id,e),onOppositeReset:()=>c(p.id,null)})]})]})}let ie=["background","primary","accent","foreground","muted","border"];function it(){let e=A(),t=r_(e=>e.colors),r=r_(e=>e.schemes),a=r_(e=>e.activeSchemeId),i=r_(e=>e.saveScheme),n=r_(e=>e.loadScheme),o=r_(e=>e.deleteScheme),[d,c]=(0,l.useState)(""),[h,u]=(0,l.useState)(!1);(0,l.useEffect)(()=>{let e=()=>u(window.scrollY>.6*window.innerHeight);return e(),window.addEventListener("scroll",e,{passive:!0}),()=>window.removeEventListener("scroll",e)},[]);let x=t.length>0&&h,p=()=>{i(d),c("")};return(0,s.jsx)("div",{"aria-hidden":!x,className:`fixed inset-x-0 top-0 z-40 border-b border-neutral-200 bg-white/85 backdrop-blur transition-transform duration-300 dark:border-neutral-800 dark:bg-black/80 ${x?"translate-y-0":"-translate-y-full"}`,children:(0,s.jsxs)("div",{className:"mx-auto flex max-w-[1440px] items-center gap-2 px-1 py-2",children:[(0,s.jsx)("span",{className:"shrink-0 text-xs font-semibold",children:e("Schemes","方案")}),(0,s.jsx)("input",{value:d,onChange:e=>c(e.target.value),onKeyDown:e=>"Enter"===e.key&&p(),placeholder:e(`Scheme ${r.length+1}`,`方案 ${r.length+1}`),className:"w-24 shrink-0 rounded border border-neutral-300 bg-white px-2 py-1 text-xs outline-none focus:border-neutral-500 dark:border-neutral-700 dark:bg-neutral-900"}),(0,s.jsx)("button",{onClick:p,className:"shrink-0 rounded bg-neutral-900 px-2.5 py-1 text-xs text-white hover:bg-neutral-700 dark:bg-white dark:text-black dark:hover:bg-neutral-200",children:e("Save current","保存当前")}),(0,s.jsx)("div",{className:"scrollbar-subtle flex min-w-0 flex-1 items-center gap-1.5 overflow-x-auto",children:0===r.length?(0,s.jsx)("span",{className:"text-[10px] text-neutral-400",children:e("Save a few; switch from any section","存几套，任意板块一键切换")}):r.map(e=>(0,s.jsx)(ir,{scheme:e,active:a===e.id,onLoad:()=>n(e.id),onDelete:()=>o(e.id)},e.id))})]})})}function ir({scheme:e,active:t,onLoad:r,onDelete:a}){let i=A(),l=[...e.colors].sort((e,t)=>ie.indexOf(e.role)-ie.indexOf(t.role)).slice(0,4);return(0,s.jsxs)("span",{role:"button",tabIndex:0,"aria-pressed":t,onClick:r,onKeyDown:e=>{("Enter"===e.key||" "===e.key)&&(e.preventDefault(),r())},title:t?i("Currently loaded","当前已载入"):i("Click to load this scheme","点击载入此方案"),className:`inline-flex shrink-0 cursor-pointer items-center gap-1.5 rounded-full border py-0.5 pl-1.5 pr-1 text-xs transition ${t?"border-neutral-900 dark:border-white":"border-neutral-200 hover:border-neutral-900 dark:border-neutral-700 dark:hover:border-white"}`,children:[(0,s.jsx)("span",{className:"flex h-3.5 w-9 shrink-0 overflow-hidden rounded-sm",children:l.map(t=>(0,s.jsx)("span",{className:"flex-1",style:{background:rE(t,e.globals)}},t.id))}),(0,s.jsx)("span",{className:"max-w-24 truncate",children:e.name}),t&&(0,s.jsx)("span",{className:"text-[10px]","aria-hidden":!0,children:"✓"}),(0,s.jsx)("button",{onClick:e=>{e.stopPropagation(),a()},title:i("Delete this scheme","删除此方案"),"aria-label":i(`Delete scheme ${e.name}`,`删除方案 ${e.name}`),className:"rounded px-1 text-[10px] text-neutral-400 transition hover:text-red-600",children:"×"})]})}let ia={dL:0,dC:0,dH:0},ii={all:{en:"All",zh:"全部"},landing:{en:"Landing",zh:"落地页"},card:{en:"Cards",zh:"卡片组"},form:{en:"Form",zh:"表单"},dashboard:{en:"Dashboard",zh:"仪表盘"},article:{en:"Article",zh:"文章页"},pricing:{en:"Pricing",zh:"定价页"}},is=["all","landing","card","form","dashboard","article","pricing"],il=["landing","card","form","dashboard","article","pricing"];function io(){let e=r_(e=>e.colors),t=r_(e=>e.globals),r=r_(e=>e.dark),a=A(),[i,n]=(0,l.useState)("all"),[o,d]=(0,l.useState)(()=>aJ(r_.getState().colors,r_.getState().globals)?"dark":"light"),c=(0,l.useMemo)(()=>{if(!r.enabled)return rZ(e,t);let a=aQ(e,t,r.overrides);return rZ("dark"===o?a.dark:a.light,ia)},[e,t,r.enabled,r.overrides,o]);return 0===e.length?null:(0,s.jsxs)("div",{className:"flex flex-col gap-3",children:[(0,s.jsxs)("div",{className:"flex flex-wrap items-center gap-1",children:[is.map(e=>(0,s.jsx)("button",{onClick:()=>n(e),className:`rounded-full border px-3 py-1 text-xs transition ${i===e?"border-neutral-900 bg-neutral-900 text-white dark:border-white dark:bg-white dark:text-black":"border-neutral-300 hover:bg-neutral-100 dark:border-neutral-700 dark:hover:bg-neutral-800"}`,children:a(ii[e].en,ii[e].zh)},e)),r.enabled&&(0,s.jsx)("div",{className:"ml-auto flex gap-0.5 rounded-full border border-neutral-300 p-0.5 dark:border-neutral-700",children:["light","dark"].map(e=>(0,s.jsx)("button",{onClick:()=>d(e),"aria-pressed":o===e,className:`rounded-full px-2.5 py-0.5 text-[10px] transition ${o===e?"bg-neutral-900 text-white dark:bg-white dark:text-black":"text-neutral-500 hover:text-neutral-900 dark:hover:text-white"}`,children:"light"===e?a("Light","亮"):a("Dark","暗")},e))})]}),"all"===i?(0,s.jsx)("div",{className:"grid grid-cols-1 gap-4 rounded-xl border border-neutral-200 p-4 dark:border-neutral-800 sm:grid-cols-2",children:il.map(e=>(0,s.jsxs)("div",{className:"space-y-1.5",children:[(0,s.jsx)("p",{className:"text-xs font-medium text-neutral-500 dark:text-neutral-400",children:a(ii[e].en,ii[e].zh)}),(0,s.jsx)("div",{className:"aspect-[800/520] overflow-hidden rounded-lg border border-neutral-200 dark:border-neutral-800",children:(0,s.jsx)(r7,{kind:e,palette:c})})]},e))}):(0,s.jsx)("div",{className:"aspect-[800/520] overflow-hidden rounded-xl border border-neutral-200 dark:border-neutral-800",children:(0,s.jsx)(r7,{kind:i,palette:c})})]})}let id=[{name:"h1",step:5},{name:"h2",step:4},{name:"h3",step:3},{name:"h4",step:2},{name:"h5",step:1},{name:"body",step:0},{name:"small",step:-1},{name:"caption",step:-2}];function ic(e){return id.map(({name:t,step:r})=>{let a=Math.round(e.base*Math.pow(e.ratio,r)*100)/100;return{name:t,px:a,rem:Math.round(a/16*1e3)/1e3}})}let ih=[{id:"system",label:"System",stack:"system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif"},{id:"inter",label:"Inter",stack:"Inter, system-ui, sans-serif"},{id:"geist",label:"Geist",stack:"'Geist', system-ui, sans-serif"},{id:"serif",label:"Serif",stack:"Georgia, 'Times New Roman', serif"},{id:"mono",label:"Mono",stack:"'JetBrains Mono', ui-monospace, 'SF Mono', monospace"},{id:"cn",label:"中文",stack:"'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif"}],iu={h1:1.15,h2:1.2,h3:1.25,h4:1.3,h5:1.35,body:1.55,small:1.5,caption:1.4},ix={h1:"H1",h2:"H2",h3:"H3",h4:"H4",h5:"H5",body:"Body",small:"Small",caption:"Caption"};function ip(e){let t=ih.find(t=>t.stack===e);return t?.id??"custom"}function im(){let e=r_(e=>e.typography),t=r_(e=>e.setTypography),r=r_(e=>e.colors),a=r_(e=>e.globals),i=r.length>0,n=A(),[o,d]=(0,l.useState)("instance"),c=(0,l.useMemo)(()=>rZ(r,a),[r,a]),h=.45>rS(c.primary)?"#ffffff":"#111111",u=(0,l.useMemo)(()=>ic(e),[e]),x=ip(e.fontFamily),p=ip(e.headingFamily),m=(e,t)=>u.find(t=>t.name===e)?.px??t;if(!i)return null;let f=(e,r)=>{if("custom"===r)return;let a=ih.find(e=>e.id===r);a&&t({[e]:a.stack})};return(0,s.jsxs)("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-[minmax(320px,420px)_1fr]",children:[(0,s.jsxs)("div",{className:"space-y-5 rounded-xl border border-neutral-200 bg-white p-5 dark:border-neutral-800 dark:bg-neutral-900",children:[(0,s.jsxs)("label",{className:"block space-y-2",children:[(0,s.jsxs)("span",{className:"flex items-center justify-between text-xs font-medium",children:[(0,s.jsx)("span",{children:n("Base size","基础字号 base")}),(0,s.jsxs)("span",{className:"font-mono text-neutral-500",children:[e.base,"px"]})]}),(0,s.jsx)("input",{type:"range",min:12,max:22,step:1,value:e.base,onChange:e=>t({base:Number(e.target.value)}),className:"w-full accent-neutral-900 dark:accent-white"}),(0,s.jsxs)("div",{className:"flex justify-between text-[10px] text-neutral-400",children:[(0,s.jsx)("span",{children:"12"}),(0,s.jsx)("span",{children:"16"}),(0,s.jsx)("span",{children:"22"})]})]}),(0,s.jsxs)("label",{className:"block space-y-2",children:[(0,s.jsxs)("span",{className:"flex items-center justify-between text-xs font-medium",children:[(0,s.jsx)("span",{children:n("Scale ratio","缩放比例 ratio")}),(0,s.jsx)("span",{className:"font-mono text-neutral-500",children:e.ratio.toFixed(2)})]}),(0,s.jsx)("input",{type:"range",min:1.1,max:1.5,step:.01,value:e.ratio,onChange:e=>t({ratio:Number(e.target.value)}),className:"w-full accent-neutral-900 dark:accent-white"}),(0,s.jsxs)("div",{className:"flex justify-between text-[10px] text-neutral-400",children:[(0,s.jsx)("span",{children:n("1.10 tight","1.10 紧凑")}),(0,s.jsx)("span",{children:n("1.25 medium","1.25 适中")}),(0,s.jsx)("span",{children:n("1.50 loose","1.50 宽松")})]})]}),(0,s.jsxs)("div",{className:"space-y-2",children:[(0,s.jsx)("label",{className:"text-xs font-medium",children:n("Heading font","标题字体")}),(0,s.jsxs)("select",{value:p,onChange:e=>f("headingFamily",e.target.value),className:"w-full rounded-lg border border-neutral-300 bg-white px-3 py-1.5 text-xs dark:border-neutral-700 dark:bg-neutral-900",children:[ih.map(e=>(0,s.jsx)("option",{value:e.id,children:e.label},e.id)),(0,s.jsx)("option",{value:"custom",children:n("Custom…","自定义…")})]}),(0,s.jsx)("input",{type:"text",value:e.headingFamily,onChange:e=>t({headingFamily:e.target.value}),className:"w-full rounded-lg border border-neutral-300 bg-white px-3 py-1.5 font-mono text-[10px] text-neutral-600 dark:border-neutral-700 dark:bg-neutral-900 dark:text-neutral-400"})]}),(0,s.jsxs)("div",{className:"space-y-2",children:[(0,s.jsx)("label",{className:"text-xs font-medium",children:n("Body font","正文字体")}),(0,s.jsxs)("select",{value:x,onChange:e=>f("fontFamily",e.target.value),className:"w-full rounded-lg border border-neutral-300 bg-white px-3 py-1.5 text-xs dark:border-neutral-700 dark:bg-neutral-900",children:[ih.map(e=>(0,s.jsx)("option",{value:e.id,children:e.label},e.id)),(0,s.jsx)("option",{value:"custom",children:n("Custom…","自定义…")})]}),(0,s.jsx)("input",{type:"text",value:e.fontFamily,onChange:e=>t({fontFamily:e.target.value}),className:"w-full rounded-lg border border-neutral-300 bg-white px-3 py-1.5 font-mono text-[10px] text-neutral-600 dark:border-neutral-700 dark:bg-neutral-900 dark:text-neutral-400"})]}),(0,s.jsxs)("div",{className:"space-y-2",children:[(0,s.jsx)("label",{className:"text-xs font-medium",children:n("Weight","字重 weight")}),(0,s.jsx)("div",{className:"flex gap-1.5 flex-wrap",children:[300,400,500,600,700].map(r=>(0,s.jsx)("button",{"aria-pressed":e.fontWeight===r,onClick:()=>t({fontWeight:r}),className:`rounded-md border px-2.5 py-1 text-xs transition-colors ${e.fontWeight===r?"border-neutral-900 bg-neutral-900 text-white dark:border-white dark:bg-white dark:text-black":"border-neutral-200 text-neutral-600 hover:border-neutral-400 dark:border-neutral-800 dark:text-neutral-400"}`,children:300===r?"300 Light":400===r?"400 Regular":500===r?"500 Medium":600===r?"600 SemiBold":"700 Bold"},r))})]}),(0,s.jsxs)("div",{className:"space-y-2",children:[(0,s.jsx)("label",{className:"text-xs font-medium",children:n("Line height","行高 line-height")}),(0,s.jsx)("div",{className:"flex gap-1.5",children:[1.25,1.5,1.75,2].map(r=>(0,s.jsx)("button",{"aria-pressed":e.lineHeight===r,onClick:()=>t({lineHeight:r}),className:`rounded-md border px-2.5 py-1 text-xs transition-colors ${e.lineHeight===r?"border-neutral-900 bg-neutral-900 text-white dark:border-white dark:bg-white dark:text-black":"border-neutral-200 text-neutral-600 hover:border-neutral-400 dark:border-neutral-800 dark:text-neutral-400"}`,children:1.25===r?n("1.25 tight","1.25 紧凑"):1.5===r?n("1.5 standard","1.5 标准"):1.75===r?n("1.75 loose","1.75 宽松"):n("2.0 airy","2.0 疏散")},r))})]}),(0,s.jsxs)("div",{className:"space-y-2",children:[(0,s.jsx)("label",{className:"text-xs font-medium",children:n("Letter spacing","字间距 letter-spacing")}),(0,s.jsx)("div",{className:"flex gap-1.5",children:[-.05,0,.05].map(r=>(0,s.jsx)("button",{"aria-pressed":e.letterSpacing===r,onClick:()=>t({letterSpacing:r}),className:`rounded-md border px-2.5 py-1 text-xs transition-colors ${e.letterSpacing===r?"border-neutral-900 bg-neutral-900 text-white dark:border-white dark:bg-white dark:text-black":"border-neutral-200 text-neutral-600 hover:border-neutral-400 dark:border-neutral-800 dark:text-neutral-400"}`,children:-.05===r?n("−0.05em tight","−0.05em 紧"):0===r?n("0 normal","0 标准"):n("+0.05em wide","+0.05em 宽")},r))})]}),(0,s.jsxs)("p",{className:"text-[10px] leading-relaxed text-neutral-400",children:[n("base sets the body size; ratio is the modular scale, H1 = base × ratio","base 控制正文字号；ratio 是模块化比例尺，H1 = base × ratio"),(0,s.jsx)("sup",{children:"5"}),".",n(" Changes preview live on the right and sync to every export format."," 调整后右侧实时预览，并自动同步到「导出」的所有格式。")]})]}),(0,s.jsxs)("div",{className:"flex min-w-0 flex-col rounded-xl border border-neutral-200 bg-white dark:border-neutral-800 dark:bg-neutral-900",children:[(0,s.jsxs)("div",{className:"flex items-center justify-between border-b border-neutral-100 px-4 py-2.5 dark:border-neutral-800",children:[(0,s.jsx)("h3",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:n("Type preview","字体预览")}),(0,s.jsx)(ig,{view:o,onChange:d})]}),"basic"===o&&(0,s.jsx)("div",{className:"scrollbar-subtle overflow-x-auto",children:(0,s.jsx)("div",{className:"inline-block min-w-full space-y-2 p-6 align-top",children:id.map(({name:t})=>{let r=u.find(e=>e.name===t);if(!r)return null;let a=t.startsWith("h"),i=a?e.headingFamily:e.fontFamily,l=a?D(e.fontWeight):e.fontWeight;return(0,s.jsxs)("div",{className:"flex items-baseline gap-4 whitespace-nowrap border-b border-neutral-100 py-2 last:border-b-0 dark:border-neutral-800",children:[(0,s.jsxs)("span",{className:"w-20 shrink-0 font-mono text-[10px] text-neutral-400",children:[ix[t]??t," · ",r.px,"px"]}),(0,s.jsx)("span",{className:"text-neutral-900 dark:text-neutral-100",style:{fontFamily:i,fontSize:`${r.px}px`,fontWeight:l,lineHeight:a?iu[t]??1.4:e.lineHeight,letterSpacing:`${e.letterSpacing}em`},children:n("The Quick Brown Fox 敏捷的棕狐 0123","敏捷的棕狐 The Quick Brown Fox 0123")})]},t)})})}),"instance"===o&&(0,s.jsxs)("div",{className:"flex-1 space-y-6 rounded-b-xl p-6",style:{background:c.bg},children:[(0,s.jsxs)("article",{className:"space-y-3 rounded-xl p-5",style:{background:c.surface,border:`1px solid ${c.border}`},children:[(0,s.jsx)("h2",{style:{color:c.fg,fontFamily:e.headingFamily,fontSize:`${m("h2",32)}px`,fontWeight:D(e.fontWeight),lineHeight:iu.h2,letterSpacing:`${e.letterSpacing}em`},children:n("How design tokens change frontend collaboration","设计 Token 如何改变前端协作")}),(0,s.jsx)("p",{className:"font-mono",style:{color:c.muted,fontSize:`${m("caption",10)}px`,letterSpacing:`${e.letterSpacing}em`},children:n("May 28, 2026 · 5 min read","2026 年 5 月 28 日 · 5 分钟阅读")}),(0,s.jsx)("p",{style:{color:c.fg,fontFamily:e.fontFamily,fontSize:`${m("body",16)}px`,fontWeight:e.fontWeight,lineHeight:e.lineHeight,letterSpacing:`${e.letterSpacing}em`},children:n("Over the last decade, a frontend team's verbal conventions for color, spacing, and type got replaced by a single JSON file. Tokens give designers and engineers one shared vocabulary — and once AI joins the workflow, that vocabulary becomes the model's only entry point to your style. A good token set both produces clean CSS and lets a prompt express the visual language precisely in context.","过去十年里，前端团队对颜色、间距、字号的口头约定，被一份 JSON 文件取代。Token 让 designer 与 engineer 共用同一套词汇——而当 AI 加入协作流，这份词汇成了让模型理解风格的唯一入口。一份好的 token 集既能产出干净的 CSS，也能让 prompt 在上下文里精确表达视觉语言。")}),(0,s.jsx)("h3",{style:{color:c.fg,fontFamily:e.headingFamily,fontSize:`${m("h3",24)}px`,fontWeight:Math.min(900,e.fontWeight+200),lineHeight:iu.h3,letterSpacing:`${e.letterSpacing}em`,marginTop:"0.5em"},children:n("Three pillars of a shared vocabulary","共享词汇的三个支点")}),(0,s.jsx)("ul",{className:"list-disc space-y-1.5 pl-5",style:{color:c.fg},children:[n("Colors, spacing, and type get consistent names — no more verbal conventions","颜色、间距、字号有统一命名，不再靠口头约定"),n("Light/dark themes pair automatically — define once, apply in both","亮暗主题自动配对，一处定义、两处生效"),n("AI reads the same contract, so generated UI stays on-brand","AI 读同一份契约，生成的 UI 不会跑偏")].map(t=>(0,s.jsx)("li",{style:{fontFamily:e.fontFamily,fontSize:`${m("body",16)}px`,fontWeight:e.fontWeight,lineHeight:e.lineHeight,letterSpacing:`${e.letterSpacing}em`},children:t},t))}),(0,s.jsx)("blockquote",{style:{color:c.muted,fontFamily:e.fontFamily,fontSize:`${m("body",16)}px`,fontWeight:e.fontWeight,lineHeight:e.lineHeight,letterSpacing:`${e.letterSpacing}em`,borderLeft:`3px solid ${c.primary}`,paddingLeft:"0.75em"},children:n("“Good typography is invisible — readers just feel the flow, never noticing the type itself.”","“好的排版是隐形的——读者只感到顺畅，不会注意到字体本身。”")}),(0,s.jsx)("p",{style:{color:c.muted,fontFamily:e.fontFamily,fontSize:`${m("small",13)}px`,fontWeight:e.fontWeight,lineHeight:e.lineHeight,letterSpacing:`${e.letterSpacing}em`},children:n("Adjust weight, line height, and letter spacing on the left — this paragraph reflects it live.","调整左侧的字重、行高和字间距，这段正文会实时反映效果。")})]}),(0,s.jsxs)("div",{className:"space-y-3 rounded-xl p-5",style:{background:c.surface,border:`1px solid ${c.border}`},children:[(0,s.jsx)("h4",{style:{color:c.fg,fontFamily:e.headingFamily,fontSize:`${m("h4",20)}px`,fontWeight:Math.min(900,e.fontWeight+200),lineHeight:iu.h4,letterSpacing:`${e.letterSpacing}em`},children:n("Component labels","组件标签")}),(0,s.jsxs)("div",{className:"flex items-center gap-3",children:[(0,s.jsx)("button",{className:"rounded-md px-3 py-1.5",style:{background:c.primary,color:h,fontFamily:e.fontFamily,fontSize:`${m("small",13)}px`,fontWeight:Math.min(900,e.fontWeight+100),letterSpacing:`${e.letterSpacing}em`},children:n("Keep reading","继续阅读")}),(0,s.jsx)("a",{className:"underline-offset-2 hover:underline",style:{color:c.primary,fontFamily:e.fontFamily,fontSize:`${m("small",13)}px`,fontWeight:e.fontWeight,letterSpacing:`${e.letterSpacing}em`},children:n("Share with a colleague →","分享给同事 →")})]})]})]})]})]})}function ig({view:e,onChange:t}){let r=A();return(0,s.jsx)("div",{className:"flex gap-0.5 rounded-lg border border-neutral-200 p-0.5 dark:border-neutral-800",children:["instance","basic"].map(a=>(0,s.jsx)("button",{onClick:()=>t(a),"aria-pressed":e===a,className:`rounded px-2.5 py-1 text-[10px] transition ${e===a?"bg-neutral-900 text-white dark:bg-white dark:text-black":"text-neutral-500 hover:text-neutral-900 dark:hover:text-white"}`,children:"instance"===a?r("Instance","实例预览"):r("Basics","基础效果")},a))})}let ib=["sm","md","lg"];function iy(){let e,t,r,a=r_(e=>e.spacing),i=r_(e=>e.radius),n=r_(e=>e.shadow),o=r_(e=>e.border),d=r_(e=>e.opacity),c=r_(e=>e.colors),h=r_(e=>e.globals),u=r_(e=>e.setSpacing),x=r_(e=>e.setRadius),p=r_(e=>e.setShadowIntensity),m=r_(e=>e.setShadowAdvanced),f=r_(e=>e.setShadowLevel),g=r_(e=>e.setBorder),b=r_(e=>e.setOpacity),y=r_(e=>e.colors.length>0),v=A(),[w,j]=(0,l.useState)("instance"),k=(e=r_(e=>e.colors),t=r_(e=>e.globals),(r=e.find(e=>"primary"===e.role)??e[0])?rE(r,t):"#5e6ad2"),N=(0,l.useMemo)(()=>rZ(c,h),[c,h]),M=.45>rS(N.primary)?"#ffffff":"#111111",$=(0,l.useMemo)(()=>E(a.base),[a.base]),S=(0,l.useMemo)(()=>L(i.base),[i.base]),z=(0,l.useMemo)(()=>W(o.base),[o.base]),C=(0,l.useMemo)(()=>B(d.base),[d.base]),F=(e,t)=>$.find(t=>t.name===e)?.px??t,H=(e,t)=>S.find(t=>t.name===e)?.px??t,R=(e,t)=>z.find(t=>t.name===e)?.px??t;return y?(0,s.jsxs)("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-[minmax(360px,440px)_1fr]",children:[(0,s.jsxs)("div",{className:"space-y-6 rounded-xl border border-neutral-200 bg-white p-5 dark:border-neutral-800 dark:bg-neutral-900",children:[(0,s.jsxs)("section",{className:"space-y-3",children:[(0,s.jsxs)("header",{className:"flex items-center justify-between",children:[(0,s.jsx)("span",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:v("Spacing","间距")}),(0,s.jsxs)("span",{className:"font-mono text-xs text-neutral-500",children:["base ",a.base,"px"]})]}),(0,s.jsx)("input",{type:"range",min:2,max:8,step:1,value:a.base,onChange:e=>u({base:Number(e.target.value)}),className:"w-full accent-neutral-900 dark:accent-white"}),(0,s.jsxs)("div",{className:"flex justify-between text-[10px] text-neutral-400",children:[(0,s.jsx)("span",{children:v("Tight 2","紧凑 2")}),(0,s.jsx)("span",{children:v("Common 4","常用 4")}),(0,s.jsx)("span",{children:v("Loose 8","宽松 8")})]})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-3",children:[(0,s.jsxs)("header",{className:"flex items-center justify-between",children:[(0,s.jsx)("span",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:v("Radius","圆角")}),(0,s.jsxs)("span",{className:"font-mono text-xs text-neutral-500",children:["base ",i.base,"px"]})]}),(0,s.jsx)("input",{type:"range",min:0,max:24,step:1,value:i.base,onChange:e=>x({base:Number(e.target.value)}),className:"w-full accent-neutral-900 dark:accent-white"}),(0,s.jsxs)("div",{className:"flex justify-between text-[10px] text-neutral-400",children:[(0,s.jsx)("span",{children:v("Square 0","方 0")}),(0,s.jsx)("span",{children:v("Round 8","圆 8")}),(0,s.jsx)("span",{children:v("Pill 24","大圆 24")})]})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-3",children:[(0,s.jsxs)("header",{className:"flex items-center justify-between",children:[(0,s.jsxs)("div",{className:"flex items-center gap-2",children:[(0,s.jsx)("span",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:v("Shadow","阴影")}),(0,s.jsx)("button",{onClick:()=>{n.advanced?p(n.intensity):m(!0)},"aria-pressed":n.advanced,"aria-label":n.advanced?v("Switch to simple mode","切换到简单模式"):v("Switch to advanced mode","切换到高级模式"),title:n.advanced?v("Switch to simple mode","切换到简单模式"):v("Switch to advanced mode","切换到高级模式"),className:`grid h-5 w-5 place-items-center rounded transition ${n.advanced?"bg-neutral-900 text-white dark:bg-white dark:text-black":"text-neutral-400 hover:bg-neutral-100 hover:text-neutral-900 dark:hover:bg-neutral-800 dark:hover:text-white"}`,children:(0,s.jsxs)("svg",{width:"12",height:"12",viewBox:"0 0 16 16",fill:"none","aria-hidden":!0,children:[(0,s.jsx)("line",{x1:"3",y1:"4",x2:"13",y2:"4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),(0,s.jsx)("circle",{cx:"6",cy:"4",r:"1.8",fill:"currentColor"}),(0,s.jsx)("line",{x1:"3",y1:"8",x2:"13",y2:"8",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),(0,s.jsx)("circle",{cx:"10",cy:"8",r:"1.8",fill:"currentColor"}),(0,s.jsx)("line",{x1:"3",y1:"12",x2:"13",y2:"12",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),(0,s.jsx)("circle",{cx:"7",cy:"12",r:"1.8",fill:"currentColor"})]})})]}),(0,s.jsx)("span",{className:"font-mono text-xs text-neutral-500",children:n.advanced?v("Advanced","高级"):`intensity ${n.intensity.toFixed(2)}`})]}),!n.advanced&&(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("input",{type:"range",min:0,max:1,step:.05,value:n.intensity,onChange:e=>p(Number(e.target.value)),className:"w-full accent-neutral-900 dark:accent-white"}),(0,s.jsxs)("div",{className:"flex justify-between text-[10px] text-neutral-400",children:[(0,s.jsx)("span",{children:v("None 0","无 0")}),(0,s.jsx)("span",{children:v("Soft 0.5","柔和 0.5")}),(0,s.jsx)("span",{children:v("Strong 1.0","强烈 1.0")})]})]}),n.advanced&&(0,s.jsxs)("div",{className:"space-y-4 rounded-lg border border-neutral-200 p-4 dark:border-neutral-800",children:[(0,s.jsx)(ij,{param:"blur",label:v("Blur","模糊 Blur"),shadow:n,onApply:e=>iw("blur",e,f),max:3,step:.05}),(0,s.jsx)(ij,{param:"offsetY",label:v("Offset Y","偏移 Offset Y"),shadow:n,onApply:e=>iw("offsetY",e,f),max:3,step:.05}),(0,s.jsx)(ij,{param:"opacity",label:v("Opacity","不透明度 Opacity"),shadow:n,onApply:e=>iw("opacity",e,f),max:3,step:.05})]})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-3",children:[(0,s.jsxs)("header",{className:"flex items-center justify-between",children:[(0,s.jsx)("span",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:v("Border width","描边粗细")}),(0,s.jsxs)("span",{className:"font-mono text-xs text-neutral-500",children:["base ",o.base,"px"]})]}),(0,s.jsx)("input",{type:"range",min:.5,max:4,step:.5,value:o.base,onChange:e=>g({base:Number(e.target.value)}),className:"w-full accent-neutral-900 dark:accent-white"}),(0,s.jsxs)("div",{className:"flex justify-between text-[10px] text-neutral-400",children:[(0,s.jsx)("span",{children:v("Thin 0.5","细 0.5")}),(0,s.jsx)("span",{children:v("Common 1","常用 1")}),(0,s.jsx)("span",{children:v("Thick 4","粗 4")})]})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-3",children:[(0,s.jsxs)("header",{className:"flex items-center justify-between",children:[(0,s.jsx)("span",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:v("Opacity","透明度")}),(0,s.jsxs)("span",{className:"font-mono text-xs text-neutral-500",children:["base ",d.base]})]}),(0,s.jsx)("input",{type:"range",min:.04,max:.16,step:.01,value:d.base,onChange:e=>b({base:Number(e.target.value)}),className:"w-full accent-neutral-900 dark:accent-white"}),(0,s.jsxs)("div",{className:"flex justify-between text-[10px] text-neutral-400",children:[(0,s.jsx)("span",{children:v("Faint 0.04","淡 0.04")}),(0,s.jsx)("span",{children:v("Standard 0.08","标准 0.08")}),(0,s.jsx)("span",{children:v("Deep 0.16","深 0.16")})]})]})]}),(0,s.jsxs)("div",{className:"flex flex-col rounded-xl border border-neutral-200 bg-white dark:border-neutral-800 dark:bg-neutral-900",children:[(0,s.jsxs)("div",{className:"flex items-center justify-between border-b border-neutral-100 px-4 py-2.5 dark:border-neutral-800",children:[(0,s.jsx)("h3",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:v("Component details","组件细节")}),(0,s.jsx)(iv,{view:w,onChange:j})]}),"basic"===w&&(0,s.jsxs)("div",{className:"space-y-5 p-6",children:[(0,s.jsxs)("section",{className:"space-y-2",children:[(0,s.jsx)("p",{className:"text-[10px] font-semibold uppercase tracking-wider text-neutral-400",children:v("Spacing","间距 spacing")}),(0,s.jsx)("div",{className:"flex flex-col gap-1.5",children:$.map(e=>(0,s.jsxs)("div",{className:"flex items-center gap-3",children:[(0,s.jsx)("span",{className:"w-16 shrink-0 font-mono text-[10px] text-neutral-400",children:e.name}),(0,s.jsxs)("span",{className:"w-12 shrink-0 font-mono text-[10px] text-neutral-300",children:[e.px,"px"]}),(0,s.jsx)("div",{className:"h-3 rounded",style:{width:`${Math.min(2*e.px,320)}px`,background:k+"33"}})]},e.name))})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-2",children:[(0,s.jsx)("p",{className:"text-[10px] font-semibold uppercase tracking-wider text-neutral-400",children:v("Radius","圆角 radius")}),(0,s.jsx)("div",{className:"flex flex-wrap gap-3",children:S.map(e=>(0,s.jsxs)("div",{className:"flex flex-col items-center gap-1.5",children:[(0,s.jsx)("div",{className:"h-12 w-16",style:{background:k+"33",borderRadius:e.px}}),(0,s.jsx)("span",{className:"font-mono text-[10px] text-neutral-400",children:e.name}),(0,s.jsx)("span",{className:"font-mono text-[10px] text-neutral-300",children:"full"===e.name?"9999px":`${e.px}px`})]},e.name))})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-2",children:[(0,s.jsx)("p",{className:"text-[10px] font-semibold uppercase tracking-wider text-neutral-400",children:v("Shadow","阴影 shadow")}),(0,s.jsx)("div",{className:"grid grid-cols-3 gap-4 rounded-xl p-5",style:{background:"rgb(226 232 240)"},children:ib.map(e=>(0,s.jsxs)("div",{className:"flex flex-col items-center gap-2",children:[(0,s.jsx)("div",{className:"h-16 w-full rounded-md",style:{background:"white",boxShadow:I(n[e])}}),(0,s.jsx)("span",{className:"font-mono text-[10px]",style:{color:"rgb(100 116 139)"},children:e}),(0,s.jsxs)("span",{className:"font-mono text-[10px]",style:{color:"rgb(148 163 184)"},children:["blur ",n[e].blur," · y ",n[e].offsetY]})]},e))})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-2",children:[(0,s.jsx)("p",{className:"text-[10px] font-semibold uppercase tracking-wider text-neutral-400",children:v("Border","描边 border")}),(0,s.jsx)("div",{className:"flex gap-3 pt-1",children:z.map(e=>(0,s.jsxs)("div",{className:"flex flex-1 flex-col items-center gap-1.5",children:[(0,s.jsx)("div",{className:"w-full rounded-md border-neutral-400 dark:border-neutral-500",style:{border:`${e.px}px solid`,height:36}}),(0,s.jsxs)("span",{className:"font-mono text-[10px] text-neutral-400",children:[e.name," · ",e.px,"px"]})]},e.name))})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-2",children:[(0,s.jsx)("p",{className:"text-[10px] font-semibold uppercase tracking-wider text-neutral-400",children:v("Opacity","透明度 opacity")}),(0,s.jsx)("div",{className:"flex gap-2",children:C.map(e=>(0,s.jsxs)("div",{className:"flex flex-1 flex-col items-center gap-1.5",children:[(0,s.jsx)("div",{className:"h-10 w-full rounded",style:{background:k,opacity:e.value}}),(0,s.jsx)("span",{className:"font-mono text-[10px] text-neutral-400",children:e.name}),(0,s.jsxs)("span",{className:"font-mono text-[10px] text-neutral-300",children:[(100*e.value).toFixed(0),"%"]})]},e.name))})]})]}),"instance"===w&&(0,s.jsxs)("div",{className:"flex-1 space-y-4 rounded-b-xl p-6",style:{background:N.bg},children:[(0,s.jsxs)("div",{children:[(0,s.jsx)("p",{className:"mb-2 text-[10px]",style:{color:N.muted},children:v("Spacing · list card","间距 · 列表卡片")}),(0,s.jsxs)("div",{className:"overflow-hidden",style:{border:`${R("default",o.base)}px solid ${N.border}`,borderRadius:Math.min(H("lg",12),F("xs",8)+8),background:N.surface,boxShadow:I(n.sm)},children:[(0,s.jsxs)("div",{className:"flex items-center justify-between",style:{padding:`${F("xs",8)}px ${F("md",16)}px`,borderBottom:`1px solid ${N.border}`},children:[(0,s.jsx)("span",{className:"text-xs font-medium",style:{color:N.fg},children:v("Tasks today","今日任务")}),(0,s.jsx)("span",{className:"grid h-4 w-4 shrink-0 place-items-center text-[10px] font-semibold",style:{background:N.primary,color:M,borderRadius:"50%"},children:"3"})]}),[{label:v("Organize the design spec","整理设计规范"),done:!0},{label:v("Component library review","组件库评审"),done:!1},{label:v("Write the interaction doc","输出交互文档"),done:!1}].map(({label:e,done:t},r,a)=>(0,s.jsxs)("div",{className:"flex items-center",style:{padding:`${F("xs",8)}px ${F("md",16)}px`,gap:F("xs",8),borderBottom:r<a.length-1?`1px solid ${N.border}`:"none"},children:[(0,s.jsx)("span",{style:{flexShrink:0,width:14,height:14,borderRadius:"50%",border:t?"none":`1.5px solid ${N.border}`,background:t?N.primary:"transparent",display:"inline-block"}}),(0,s.jsx)("span",{className:"text-xs",style:{color:t?N.muted:N.fg,textDecoration:t?"line-through":"none"},children:e})]},e)),(0,s.jsxs)("div",{className:"flex items-center justify-between",style:{padding:`${F("xs",8)}px ${F("md",16)}px`,borderTop:`1px solid ${N.border}`},children:[(0,s.jsx)("span",{className:"text-[10px]",style:{color:N.muted},children:v("Today · 2 open","今天 · 2 未完成")}),(0,s.jsx)("span",{className:"text-[10px]",style:{color:N.primary},children:v("＋ Add","＋ 添加")})]})]})]}),(0,s.jsxs)("div",{children:[(0,s.jsx)("p",{className:"mb-2 text-[10px]",style:{color:N.muted},children:v("Spacing · button padding","间距 · 按钮 padding")}),(0,s.jsxs)("div",{className:"flex flex-wrap items-center",style:{gap:F("sm",12)},children:[(0,s.jsx)("button",{style:{background:N.primary,color:M,border:"none",borderRadius:H("md",8),padding:`${F("sm",12)}px ${F("lg",24)}px`,fontSize:12,fontWeight:600,boxShadow:I(n.sm),cursor:"pointer"},children:v("Primary action","主要操作")}),(0,s.jsx)("button",{style:{background:"transparent",color:N.fg,border:`${R("default",o.base)}px solid ${N.border}`,borderRadius:H("md",8),padding:`${F("xxs",4)}px ${F("sm",12)}px`,fontSize:11,cursor:"pointer"},children:v("Compact","紧凑")}),(0,s.jsx)("span",{className:"font-mono text-[10px]",style:{color:N.muted},children:v("CTA sm×lg · compact xxs×sm","CTA sm×lg · 紧凑 xxs×sm")})]})]}),(0,s.jsxs)("div",{children:[(0,s.jsx)("p",{className:"mb-2 text-[10px]",style:{color:N.muted},children:v("Shadow · border · opacity · combined","阴影 · 描边 · 透明度 · 组合实例")}),(0,s.jsx)("div",{children:(0,s.jsxs)("div",{style:{background:N.surface,border:`${o.base}px solid ${N.border}`,borderRadius:Math.min(H("lg",12),F("md",16)+4),boxShadow:I(n.md),padding:`${F("md",16)}px`},children:[(0,s.jsx)("div",{style:{fontWeight:600,fontSize:12,color:N.fg},children:v("Publish update","发布更新")}),(0,s.jsx)("div",{style:{fontSize:11,color:N.muted,marginTop:2,marginBottom:F("sm",12)},children:v("Cards lift with shadow; one input switches border width by state; the button shows interactive opacity.","卡片用阴影抬升；同一输入框按状态切换描边粗细，按钮演示交互透明度。")}),(0,s.jsx)("div",{className:"mb-3 grid grid-cols-3",style:{gap:F("sm",12)},children:[{label:v("Default","默认"),strong:!1,focus:!1},{label:v("Selected","选中"),strong:!0,focus:!1},{label:v("Focus","聚焦"),strong:!0,focus:!0}].map(e=>{let t=e.strong?R("strong",2*o.base):R("default",o.base);return(0,s.jsxs)("div",{className:"flex flex-col gap-1",children:[(0,s.jsxs)("span",{className:"font-mono text-[10px]",style:{color:N.muted},children:[e.label," · ",t,"px"]}),(0,s.jsx)("div",{style:{border:`${t}px solid ${e.strong?N.primary:N.border}`,borderRadius:H("sm",4),padding:`${F("xxs",4)}px ${F("sm",12)}px`,fontSize:11,color:N.muted,background:N.bg,boxShadow:e.focus?`0 0 0 3px ${rQ(k,C.find(e=>"focus"===e.name)?.value??.16)}`:"none"},children:v("Search…","搜索…")})]},e.label)})}),(0,s.jsx)("div",{className:"flex flex-wrap items-start",style:{gap:F("sm",12)},children:C.map(e=>{if("overlay"===e.name)return null;let t="focus"===e.name,r="disabled"===e.name;return(0,s.jsxs)("div",{className:"flex flex-col items-center gap-1",children:[(0,s.jsxs)("div",{style:{position:"relative",borderRadius:H("md",8),border:t?`${R("strong",2*o.base)}px solid ${N.primary}`:`${R("default",o.base)}px solid ${N.border}`,padding:`${F("xxs",4)}px ${F("sm",12)}px`,background:N.bg,fontSize:11,color:r?N.muted:N.fg,opacity:r?e.value:1,boxShadow:t?`0 0 0 3px ${rQ(k,e.value)}`:"none",overflow:"hidden"},children:[v("Publish","发布"),("hover"===e.name||"pressed"===e.name)&&(0,s.jsx)("span",{style:{position:"absolute",inset:0,background:k,opacity:e.value,pointerEvents:"none"}})]}),(0,s.jsx)("span",{className:"font-mono text-[10px]",style:{color:N.muted},children:e.name})]},e.name)})})]})})]})]})]})]}):null}function iv({view:e,onChange:t}){let r=A();return(0,s.jsx)("div",{className:"flex gap-0.5 rounded-lg border border-neutral-200 p-0.5 dark:border-neutral-800",children:["instance","basic"].map(a=>(0,s.jsx)("button",{onClick:()=>t(a),"aria-pressed":e===a,className:`rounded px-2.5 py-1 text-[10px] transition ${e===a?"bg-neutral-900 text-white dark:bg-white dark:text-black":"text-neutral-500 hover:text-neutral-900 dark:hover:text-white"}`,children:"instance"===a?r("Instance","实例预览"):r("Basics","基础效果")},a))})}function iw(e,t,r){for(let a of ib){let i=F[a][e],s="opacity"===e?Math.round(i*t*1e3)/1e3:"offsetY"===e?Math.round(i*t*10)/10:Math.round(i*t);r(a,{[e]:s})}}function ij({param:e,label:t,shadow:r,onApply:a,max:i,step:l}){let n=F.md[e],o=Math.max(0,Math.min(i,n>0?r.md[e]/n:0)),d=ib.map(t=>{let a=r[t][e];return"opacity"===e?a.toFixed(2):`${a}`}).join(" / ");return(0,s.jsxs)("div",{className:"space-y-1.5",children:[(0,s.jsxs)("div",{className:"flex items-center justify-between",children:[(0,s.jsx)("span",{className:"text-xs font-medium",children:t}),(0,s.jsxs)("span",{className:"font-mono text-[10px] text-neutral-500",children:[o.toFixed(2),"× · ",d]})]}),(0,s.jsx)("input",{type:"range",min:0,max:i,step:l,value:o,onChange:e=>a(Number(e.target.value)),className:"w-full accent-neutral-900 dark:accent-white"})]})}function ik({onOpenModal:e}={}){let t=r_(e=>e.colors),r=r_(e=>e.globals),a=r_(e=>e.radius),i=r_(e=>e.shadow),n=r_(e=>e.border),o=r_(e=>e.opacity),d=r_(e=>e.motion),c=r_(e=>e.spacing),h=A(),u=(0,l.useMemo)(()=>rZ(t,r),[t,r]),x=(0,l.useMemo)(()=>{let e=B(o.base),t=(t,r)=>e.find(e=>e.name===t)?.value??r;return{hover:t("hover",.08),pressed:t("pressed",.12),focus:t("focus",.16),disabled:t("disabled",.38)}},[o.base]),p=(0,l.useMemo)(()=>T(d.base).find(e=>"fast"===e.name)?.ms??150,[d.base]),m=O[d.easing],f=`all ${p}ms ${m}`,g=(0,l.useMemo)(()=>{let e=L(a.base),t=(t,r)=>e.find(e=>e.name===t)?.px??r;return{sm:t("sm",4),md:t("md",8),lg:t("lg",12)}},[a.base]),b=(0,l.useMemo)(()=>{let e=E(c.base),t=(t,r)=>e.find(e=>e.name===t)?.px??r;return{xxs:t("xxs",4),sm:t("sm",12),md:t("md",16)}},[c.base]),y=(0,l.useMemo)(()=>{let e=W(n.base),t=(t,r)=>e.find(e=>e.name===t)?.px??r;return{default:t("default",1),strong:t("strong",2)}},[n.base]),v=.45>rS(u.primary),[w,j]=(0,l.useState)("idle"),[k,N]=(0,l.useState)(!1),[M,$]=(0,l.useState)(!1);if(0===t.length)return null;let S="pressed"===w?x.pressed:"hover"===w?x.hover:0;return(0,s.jsx)("div",{children:(0,s.jsxs)("div",{className:"flex flex-wrap items-start gap-5 rounded-xl p-6",style:{background:u.bg,border:`1px solid ${u.border}`},children:[(0,s.jsxs)("div",{className:"flex flex-col items-start gap-1.5",children:[(0,s.jsxs)("button",{onMouseEnter:()=>j("hover"),onMouseLeave:()=>j("idle"),onMouseDown:()=>j("pressed"),onMouseUp:()=>j("hover"),className:"relative overflow-hidden text-xs font-medium",style:{background:u.primary,color:v?"#ffffff":"#111111",borderRadius:g.md,padding:`${b.xxs}px ${b.sm}px`,border:"none",cursor:"pointer",transition:f,transform:"pressed"===w?"scale(0.97)":"scale(1)",boxShadow:"hover"===w?I(i.sm):"none"},children:[h("Primary","主操作"),(0,s.jsx)("span",{"aria-hidden":!0,style:{position:"absolute",inset:0,background:v?"#ffffff":"#000000",opacity:S,transition:f,pointerEvents:"none"}})]}),(0,s.jsx)("span",{className:"font-mono text-[10px]",style:{color:u.muted},children:"pressed"===w?`pressed ${(100*x.pressed).toFixed(0)}%`:"hover"===w?`hover ${(100*x.hover).toFixed(0)}%`:"idle"})]}),(0,s.jsxs)("div",{className:"flex flex-col items-start gap-1.5",children:[(0,s.jsx)("button",{disabled:!0,className:"text-xs font-medium",style:{background:u.primary,color:v?"#ffffff":"#111111",borderRadius:g.md,padding:`${b.xxs}px ${b.sm}px`,border:"none",opacity:x.disabled,cursor:"not-allowed"},children:h("Primary","主操作")}),(0,s.jsxs)("span",{className:"font-mono text-[10px]",style:{color:u.muted},children:["disabled ",(100*x.disabled).toFixed(0),"%"]})]}),(0,s.jsxs)("div",{className:"flex min-w-[160px] flex-col gap-1.5",children:[(0,s.jsx)("input",{placeholder:h("Click to focus…","点击聚焦…"),onFocus:()=>$(!0),onBlur:()=>$(!1),className:"w-full text-xs outline-none",style:{background:u.surface,color:u.fg,border:`${M?y.strong:y.default}px solid ${M?u.primary:u.border}`,borderRadius:g.sm,padding:`${b.xxs}px ${b.sm}px`,transition:f,boxShadow:M?`0 0 0 3px ${rQ(u.primary,x.focus)}`:"none"}}),(0,s.jsx)("span",{className:"font-mono text-[10px]",style:{color:u.muted},children:M?`focus ring ${(100*x.focus).toFixed(0)}%`:"blur"})]}),(0,s.jsxs)("div",{className:"flex min-w-[150px] flex-col gap-1.5",children:[(0,s.jsxs)("div",{onMouseEnter:()=>N(!0),onMouseLeave:()=>N(!1),style:{background:u.surface,border:`${y.default}px solid ${u.border}`,borderRadius:g.lg,padding:`${b.md}px`,transition:f,cursor:"pointer",boxShadow:I(k?i.md:i.sm),transform:k?"translateY(-2px)":"translateY(0)"},children:[(0,s.jsx)("div",{className:"text-xs font-medium",style:{color:u.fg},children:h("Card hover","卡片悬停")}),(0,s.jsx)("div",{className:"mt-1 text-[10px]",style:{color:u.muted},children:h("shadow sm → md","阴影 sm → md")})]}),(0,s.jsx)("span",{className:"font-mono text-[10px]",style:{color:u.muted},children:k?"elevation md":"elevation sm"})]}),e&&(0,s.jsxs)("div",{className:"flex flex-col items-start gap-1.5",children:[(0,s.jsx)("button",{onClick:e,className:"text-xs font-medium",style:{background:u.primary,color:v?"#ffffff":"#111111",borderRadius:g.md,padding:`${b.xxs}px ${b.sm}px`,border:"none",cursor:"pointer",transition:f},children:h("Open modal","打开弹窗")}),(0,s.jsx)("span",{className:"font-mono text-[10px]",style:{color:u.muted},children:h("overlay + motion","overlay + 动效")})]})]})})}let iN={"ease-out":{en:"fast start, slow end · standard exit",zh:"起快终慢 · 标准退出"},"ease-in-out":{en:"slow-fast-slow · symmetric",zh:"慢快慢 · 进出对称"},spring:{en:"overshoot · springy",zh:"超调回弹 · 弹簧感"},linear:{en:"constant · sequences / progress",zh:"匀速 · 序列 / 进度条"},"ease-in":{en:"slow start, fast end · standard enter",zh:"起慢终快 · 标准进入"}},iM={micro:{en:"button tap",zh:"按钮点击"},fast:{en:"hover highlight",zh:"悬停高亮"},normal:{en:"dropdown",zh:"下拉菜单"},slow:{en:"side panel",zh:"侧边面板"},page:{en:"content enter",zh:"内容入场"}},i$=e=>.45>rS(e)?"#ffffff":"#111111",iS=e=>new Promise(t=>setTimeout(t,e));function iz(e,t,r,a,i=700,s=400,l=0){let n=!1;async function o(){if(n||!e.isConnected)return;let l=e.animate(t,{duration:r,easing:a,fill:"forwards"});try{await l.finished}catch{return}if(n||(await iS(i),n))return;let d=e.animate([...t].reverse(),{duration:r,easing:a,fill:"forwards"});try{await d.finished}catch{return}n||(await iS(s),o())}return setTimeout(o,l),()=>{n=!0}}let iC={micro:function({ms:e,easingValue:t,palette:r,initialDelay:a}){let i=A(),n=(0,l.useRef)(null);return(0,l.useEffect)(()=>{if(n.current)return iz(n.current,[{transform:"scale(1)",boxShadow:`0 4px 12px ${r.primary}50`},{transform:"scale(0.93)",boxShadow:"none"}],e,t,600,500,a)},[e,t,r,a]),(0,s.jsx)("div",{className:"flex h-full items-center justify-center p-4",children:(0,s.jsx)("div",{ref:n,className:"select-none rounded-lg px-5 py-2 text-xs font-medium",style:{background:r.primary,color:i$(r.primary)},children:i("Save changes","保存更改")})})},fast:function({ms:e,easingValue:t,palette:r,initialDelay:a}){let i=A(),n=(0,l.useRef)(null),o=(0,l.useRef)(null);(0,l.useEffect)(()=>{let i=n.current,s=o.current;if(!i||!s)return;let l=!1;async function d(){if(l||!i.isConnected)return;i.animate([{opacity:0},{opacity:1}],{duration:e,easing:t,fill:"forwards"});let a=s.animate([{color:r.muted},{color:r.primary}],{duration:e,easing:t,fill:"forwards"});try{await a.finished}catch{return}if(l||(await iS(700),l))return;i.animate([{opacity:1},{opacity:0}],{duration:e,easing:t,fill:"forwards"});let n=s.animate([{color:r.primary},{color:r.muted}],{duration:e,easing:t,fill:"forwards"});try{await n.finished}catch{return}l||(await iS(400),d())}return setTimeout(d,a),()=>{l=!0}},[e,t,r,a]);let d=[i("Home","首页"),i("Docs","文档"),i("Settings","设置")];return(0,s.jsx)("div",{className:"flex h-full flex-col justify-center gap-0.5 px-4 py-3",children:d.map((e,t)=>(0,s.jsxs)("div",{className:"relative flex items-center rounded px-2.5 py-1.5 text-xs",children:[1===t&&(0,s.jsx)("div",{ref:n,className:"absolute inset-0 rounded",style:{background:r.primary+"18",opacity:0}}),(0,s.jsx)("span",{ref:1===t?o:void 0,className:"relative z-10",style:{color:r.muted},children:e})]},e))})},normal:function({ms:e,easingValue:t,palette:r,initialDelay:a}){let i=A(),n=(0,l.useRef)(null);return(0,l.useEffect)(()=>{if(n.current)return iz(n.current,[{opacity:0,transform:"scaleY(0.6) translateY(-8px)"},{opacity:1,transform:"scaleY(1) translateY(0)"}],e,t,700,500,a)},[e,t,a]),(0,s.jsxs)("div",{className:"flex h-full flex-col justify-center px-4 py-3",children:[(0,s.jsxs)("div",{className:"flex w-full items-center gap-1.5 rounded px-2.5 py-1.5 text-xs",style:{border:`1px solid ${r.border}`},children:[(0,s.jsx)("span",{className:"flex-1",style:{color:r.muted},children:i("Select an option","选择选项")}),(0,s.jsx)("span",{className:"text-[10px]",style:{color:r.muted},children:"▾"})]}),(0,s.jsx)("div",{ref:n,className:"mt-1 overflow-hidden rounded text-xs shadow-md",style:{opacity:0,transformOrigin:"top center",background:r.surface,border:`1px solid ${r.border}`},children:[i("Option 1","选项一"),i("Option 2","选项二"),i("Option 3","选项三")].map((e,t)=>(0,s.jsx)("div",{className:"px-2.5 py-1.5",style:{color:0===t?r.primary:r.fg,fontWeight:0===t?500:400,borderBottom:t<2?`1px solid ${r.border}`:"none"},children:e},e))})]})},slow:function({ms:e,easingValue:t,palette:r,initialDelay:a}){let i=(0,l.useRef)(null);(0,l.useEffect)(()=>{if(i.current)return iz(i.current,[{transform:"translateX(110%)"},{transform:"translateX(0)"}],e,t,700,500,a)},[e,t,a]);let n=rQ(r.fg,.12);return(0,s.jsxs)("div",{className:"relative h-full overflow-hidden rounded-lg",style:{border:`1px solid ${r.border}`},children:[(0,s.jsxs)("div",{className:"h-full w-full p-3",style:{background:r.bg},children:[(0,s.jsx)("div",{className:"mb-2 h-2 w-16 rounded",style:{background:n}}),(0,s.jsx)("div",{className:"mb-1.5 h-2 w-24 rounded",style:{background:n}}),(0,s.jsx)("div",{className:"h-2 w-20 rounded",style:{background:n}})]}),(0,s.jsxs)("div",{ref:i,className:"absolute right-0 top-0 h-full w-2/5 p-3 shadow-xl",style:{transform:"translateX(110%)",background:r.surface,borderLeft:`1px solid ${r.border}`},children:[(0,s.jsx)("div",{className:"mb-2 h-2 rounded",style:{width:"80%",background:r.primary+"70"}}),(0,s.jsx)("div",{className:"mb-1.5 h-1.5 w-full rounded",style:{background:n}}),(0,s.jsx)("div",{className:"mb-1.5 h-1.5 w-4/5 rounded",style:{background:n}}),(0,s.jsx)("div",{className:"h-1.5 w-3/5 rounded",style:{background:n}})]})]})},page:function({ms:e,easingValue:t,palette:r,initialDelay:a}){let i=(0,l.useRef)(null);(0,l.useEffect)(()=>{if(i.current)return iz(i.current,[{opacity:0,transform:"translateY(16px)"},{opacity:1,transform:"translateY(0)"}],e,t,700,500,a)},[e,t,a]);let n=rQ(r.fg,.12);return(0,s.jsx)("div",{className:"flex h-full flex-col justify-center px-4 py-3",children:(0,s.jsxs)("div",{ref:i,className:"space-y-1.5",style:{opacity:0},children:[(0,s.jsx)("div",{className:"h-3 rounded",style:{width:"85%",background:r.primary+"35"}}),(0,s.jsx)("div",{className:"h-2 w-full rounded",style:{background:n}}),(0,s.jsx)("div",{className:"h-2 w-5/6 rounded",style:{background:n}}),(0,s.jsx)("div",{className:"h-2 w-2/3 rounded",style:{background:n}})]})})}};function iE({duration:e,easing:t,palette:r,index:a}){let i=A(),l=iC[e.name],n=O[t],o=iM[e.name];return(0,s.jsxs)("div",{className:"flex flex-col overflow-hidden rounded-xl",style:{background:r.surface,border:`1px solid ${r.border}`},children:[(0,s.jsxs)("div",{className:"flex items-center gap-1.5 px-3 py-2",style:{borderBottom:`1px solid ${r.border}`},children:[(0,s.jsx)("span",{className:"font-mono text-[10px] font-semibold",style:{color:r.fg},children:e.name}),(0,s.jsxs)("span",{className:"rounded px-1.5 py-0.5 font-mono text-[10px]",style:{background:rQ(r.fg,.08),color:r.muted},children:[e.ms,"ms"]}),(0,s.jsx)("span",{className:"ml-auto text-[10px]",style:{color:r.muted},children:o?i(o.en,o.zh):""})]}),(0,s.jsx)("div",{className:"h-32",children:l&&(0,s.jsx)(l,{ms:e.ms,easingValue:n,palette:r,initialDelay:250*a})})]})}function iL(){let e,t,r=r_(e=>e.motion),a=r_(e=>e.setMotion),i=r_(e=>e.opacity),n=r_(e=>e.colors.length>0),o=A(),d=(e=r_(e=>e.colors),t=r_(e=>e.globals),(0,l.useMemo)(()=>rZ(e,t),[e,t])),c=d.primary,[h,u]=(0,l.useState)("instance"),[x,p]=(0,l.useState)(!1),m=(0,l.useMemo)(()=>T(r.base),[r.base]),f=(0,l.useMemo)(()=>B(i.base).find(e=>"overlay"===e.name)?.value??.5,[i.base]);return n?(0,s.jsxs)("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-[minmax(360px,440px)_1fr]",children:[(0,s.jsxs)("div",{className:"space-y-6 rounded-xl border border-neutral-200 bg-white p-5 dark:border-neutral-800 dark:bg-neutral-900",children:[(0,s.jsxs)("section",{className:"space-y-3",children:[(0,s.jsxs)("header",{className:"flex items-center justify-between",children:[(0,s.jsx)("span",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:o("Duration","时长 Duration")}),(0,s.jsxs)("span",{className:"font-mono text-xs text-neutral-500",children:["base ",r.base,"ms"]})]}),(0,s.jsx)("input",{type:"range",min:80,max:500,step:10,value:r.base,onChange:e=>a({base:Number(e.target.value)}),className:"w-full accent-neutral-900 dark:accent-white"}),(0,s.jsxs)("div",{className:"flex justify-between text-[10px] text-neutral-400",children:[(0,s.jsx)("span",{children:o("Fast 80","快 80")}),(0,s.jsx)("span",{children:o("Standard 200","标准 200")}),(0,s.jsx)("span",{children:o("Slow 500","慢 500")})]})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-3",children:[(0,s.jsx)("header",{children:(0,s.jsx)("span",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:o("Easing","缓动曲线 Easing")})}),(0,s.jsx)("div",{className:"space-y-1.5",children:Object.keys(O).map(e=>(0,s.jsxs)("button",{onClick:()=>a({easing:e}),"aria-pressed":r.easing===e,className:`flex w-full items-center justify-between rounded-lg border px-3 py-2 text-xs transition ${r.easing===e?"border-neutral-900 bg-neutral-900 text-white dark:border-white dark:bg-white dark:text-black":"border-neutral-200 text-neutral-600 hover:border-neutral-400 dark:border-neutral-800 dark:text-neutral-400 dark:hover:border-neutral-600"}`,children:[(0,s.jsx)("span",{className:"font-mono",children:e}),(0,s.jsx)("span",{className:"text-[10px] opacity-70",children:o(iN[e].en,iN[e].zh)})]},e))})]})]}),(0,s.jsxs)("div",{className:"relative flex flex-col overflow-hidden rounded-xl border border-neutral-200 bg-white dark:border-neutral-800 dark:bg-neutral-900",children:[(0,s.jsxs)("div",{className:"flex items-center justify-between border-b border-neutral-100 px-4 py-2.5 dark:border-neutral-800",children:[(0,s.jsx)("h3",{className:"text-xs font-semibold uppercase tracking-wider text-neutral-500",children:o("Motion demo","动效演示")}),(0,s.jsx)(iF,{view:h,onChange:u})]}),"instance"===h&&(0,s.jsxs)("div",{className:"flex-1 space-y-4 rounded-b-xl p-6",style:{background:d.bg},children:[(0,s.jsx)("div",{className:"grid grid-cols-2 gap-3 lg:grid-cols-3",children:m.map((e,t)=>(0,s.jsx)(iE,{duration:e,easing:r.easing,palette:d,index:t},e.name))}),(0,s.jsxs)("div",{children:[(0,s.jsx)("p",{className:"mb-2 text-[10px]",style:{color:d.muted},children:o("Interactive · try hover / press / focus the input / open the modal","可交互 · 移上去 / 按住 / 点输入框 / 开弹窗试试")}),(0,s.jsx)(ik,{onOpenModal:()=>p(!0)})]})]}),"basic"===h&&(0,s.jsxs)("div",{className:"space-y-6 p-6",children:[(0,s.jsxs)("section",{className:"space-y-2",children:[(0,s.jsx)("p",{className:"text-[10px] font-semibold uppercase tracking-wider text-neutral-400",children:o("Duration","持续时长 duration")}),(0,s.jsx)("div",{className:"space-y-2.5",children:m.map((e,t)=>(0,s.jsx)(iH,{ms:e.ms,name:e.name,easingValue:O[r.easing],primaryHex:c,initialDelay:200*t},e.name))})]}),(0,s.jsx)("div",{className:"border-t border-neutral-100 dark:border-neutral-800"}),(0,s.jsxs)("section",{className:"space-y-2",children:[(0,s.jsx)("p",{className:"text-[10px] font-semibold uppercase tracking-wider text-neutral-400",children:o("Easing","缓动曲线 easing")}),(0,s.jsx)(iI,{easing:r.easing,primaryHex:c})]})]}),(0,s.jsxs)("div",{"aria-hidden":!x,onClick:()=>p(!1),className:"absolute inset-0 z-30 grid place-items-center p-6",style:{pointerEvents:x?"auto":"none"},children:[(0,s.jsx)("div",{style:{position:"absolute",inset:0,background:rQ("#000000",f),opacity:+!!x,transition:`opacity ${r.base}ms ${O[r.easing]}`}}),(0,s.jsxs)("div",{onClick:e=>e.stopPropagation(),style:{position:"relative",width:"min(340px, 88%)",background:d.surface,color:d.fg,borderRadius:14,border:`1px solid ${d.border}`,boxShadow:"0 24px 60px rgba(0,0,0,0.35)",padding:20,opacity:+!!x,transform:x?"scale(1) translateY(0)":"scale(0.92) translateY(12px)",transition:`opacity ${r.base}ms ${O[r.easing]}, transform ${r.base}ms ${O[r.easing]}`},children:[(0,s.jsx)("p",{className:"text-sm font-semibold",style:{color:d.fg},children:o("Delete this palette?","删除这套配色？")}),(0,s.jsx)("p",{className:"mt-1.5 text-xs leading-relaxed",style:{color:d.muted},children:o("This can't be undone. Any exported files will need to be regenerated.","此操作无法撤销。删除后，关联的导出文件需要重新生成。")}),(0,s.jsxs)("div",{className:"mt-4 flex justify-end gap-2",children:[(0,s.jsx)("button",{onClick:()=>p(!1),className:"rounded-lg px-3 py-1.5 text-xs",style:{border:`1px solid ${d.border}`,color:d.fg},children:o("Cancel","取消")}),(0,s.jsx)("button",{onClick:()=>p(!1),className:"rounded-lg px-3 py-1.5 text-xs font-medium",style:{background:d.primary,color:i$(d.primary)},children:o("Delete","删除")})]})]})]})]})]}):null}function iF({view:e,onChange:t}){let r=A();return(0,s.jsx)("div",{className:"flex gap-0.5 rounded-lg border border-neutral-200 p-0.5 dark:border-neutral-800",children:["instance","basic"].map(a=>(0,s.jsx)("button",{onClick:()=>t(a),"aria-pressed":e===a,className:`rounded px-2.5 py-1 text-[10px] transition ${e===a?"bg-neutral-900 text-white dark:bg-white dark:text-black":"text-neutral-500 hover:text-neutral-900 dark:hover:text-white"}`,children:"instance"===a?r("Instance","实例预览"):r("Basics","基础效果")},a))})}function iH({ms:e,name:t,easingValue:r,primaryHex:a,initialDelay:i}){let n=(0,l.useRef)(null);return(0,l.useEffect)(()=>{if(n.current)return iz(n.current,[{transform:"translateX(0)"},{transform:"translateX(180px)"}],e,r,500,400,i)},[e,r,i]),(0,s.jsxs)("div",{className:"flex items-center gap-3",children:[(0,s.jsx)("span",{className:"w-14 shrink-0 font-mono text-[10px] text-neutral-400",children:t}),(0,s.jsxs)("span",{className:"w-12 shrink-0 font-mono text-[10px] text-neutral-300",children:[e,"ms"]}),(0,s.jsx)("div",{className:"relative h-5 flex-1 overflow-hidden rounded-full bg-neutral-100 dark:bg-neutral-800",children:(0,s.jsx)("div",{ref:n,className:"h-5 w-5 rounded-full",style:{background:a}})})]})}function iI({easing:e,primaryHex:t}){let r=O[e],a=(()=>{let e=r.match(/cubic-bezier\(([^)]+)\)/);if(!e)return null;let[t,a,i,s]=e[1].split(",").map(e=>Number(e.trim()));return{x1:t,y1:a,x2:i,y2:s}})();return(0,s.jsxs)("div",{className:"flex items-center gap-5",children:[(0,s.jsxs)("svg",{width:120,height:120,viewBox:"0 0 120 120",className:"shrink-0",children:[(0,s.jsx)("line",{x1:"0",y1:120,x2:120,y2:120,stroke:"rgb(229 229 229)",strokeWidth:"1"}),(0,s.jsx)("line",{x1:"0",y1:"0",x2:"0",y2:120,stroke:"rgb(229 229 229)",strokeWidth:"1"}),(0,s.jsx)("line",{x1:"0",y1:120,x2:120,y2:"0",stroke:"rgb(229 229 229)",strokeWidth:"1",strokeDasharray:"3 3"}),a?(0,s.jsx)("path",{d:`M 0 120 C ${120*a.x1} ${120-120*a.y1}, ${120*a.x2} ${120-120*a.y2}, 120 0`,stroke:t,strokeWidth:"2",fill:"none"}):(0,s.jsx)("line",{x1:"0",y1:120,x2:120,y2:"0",stroke:t,strokeWidth:"2"})]}),(0,s.jsxs)("div",{className:"space-y-1",children:[(0,s.jsx)("p",{className:"font-mono text-xs text-neutral-700 dark:text-neutral-200",children:e}),(0,s.jsx)("p",{className:"font-mono text-[10px] text-neutral-400",children:r})]})]})}let iR={hover:"tint/overlay on hover (e.g. button or row background)",pressed:"active/pressed feedback",focus:"focus ring or focused-row background",disabled:"opacity of disabled controls",overlay:"modal/drawer backdrop scrim"};function iT(e,t,r="text/plain"){let a=new Blob([t],{type:r}),i=URL.createObjectURL(a),s=document.createElement("a");s.href=i,s.download=e,s.click(),URL.revokeObjectURL(i)}let iO="#171717",iW="#737373",i_="#e5e5e5",iD="ui-sans-serif, system-ui, -apple-system, sans-serif",iB="ui-monospace, SFMono-Regular, Menlo, monospace",iP="ds-board-svg";function iA(){let e=A(),t=r_(e=>e.colors),r=r_(e=>e.globals),a=r_(e=>e.typography),i=r_(e=>e.spacing),l=r_(e=>e.radius),n=r_(e=>e.shadow),o=r_(e=>e.motion),d=r_(e=>e.border),c=r_(e=>e.opacity),h=r_(e=>e.activeBrand);if(0===t.length)return null;let u=t.map(e=>({...e,hex:rE(e,r)})),x=u.find(e=>"primary"===e.role)?.hex??u[0].hex,p=h&&!h.startsWith("__ai")?rP(h):"Design System",m=new Date().toISOString().slice(0,10),f=[],g=48,b=0,y=()=>`e${b++}`,v=e=>{f.push((0,s.jsx)("text",{x:48,y:g,fontFamily:iD,fontSize:12,fontWeight:600,letterSpacing:"0.08em",fill:iW,children:e.toUpperCase()},y())),g+=24},w=()=>{g+=8,f.push((0,s.jsx)("line",{x1:48,y1:g,x2:1152,y2:g,stroke:i_},y())),g+=28};f.push((0,s.jsx)("text",{x:48,y:g+26,fontFamily:iD,fontSize:34,fontWeight:700,fill:iO,children:p},y()),(0,s.jsxs)("text",{x:48,y:g+50,fontFamily:iD,fontSize:13,fill:iW,children:[e("Design system overview","设计系统总览")," · ",m]},y())),g+=78,w(),v(e("Colors","色板"));{let e=Math.floor(6.746987951807229),t=g;u.forEach((r,a)=>{var i;let l,n=Math.floor(a/e),o=48+a%e*166,d=t+144*n;f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:o,y:d,width:150,height:88,rx:10,fill:r.hex,stroke:i_}),(0,s.jsx)("text",{x:o,y:d+88+16,fontFamily:iD,fontSize:12,fontWeight:600,fill:iO,children:"unassigned"===r.role?r.id:r.role}),(0,s.jsx)("text",{x:o,y:d+88+31,fontFamily:iB,fontSize:11,fill:iW,children:r.hex.toUpperCase()}),(0,s.jsx)("text",{x:o,y:d+88+45,fontFamily:iB,fontSize:9.5,fill:iW,children:(l=rz(i=r.hex).match(/oklch\(([\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)/))?`oklch(${(+l[1]).toFixed(2)} ${(+l[2]).toFixed(3)} ${(+l[3]).toFixed(0)})`:rz(i)})]},y()))}),g=t+144*Math.ceil(u.length/e)-8}w(),v(e("Typography","字阶")),f.push((0,s.jsx)("text",{x:48,y:g,fontFamily:iD,fontSize:11,fill:iW,children:`Base ${a.base}px \xb7 Ratio ${a.ratio} \xb7 ${a.fontFamily.split(",")[0].trim()}`},y())),g+=22,ic(a).forEach(t=>{let r=t.name.startsWith("h"),i=Math.max(1.15*t.px,18);f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("text",{x:48,y:g+t.px,fontFamily:r?a.headingFamily:a.fontFamily,fontSize:t.px,fontWeight:r?D(a.fontWeight):a.fontWeight,fill:iO,children:e("Ag Design 123","Ag 设计 Design 123")}),(0,s.jsx)("text",{x:1152,y:g+t.px,textAnchor:"end",fontFamily:iB,fontSize:11,fill:iW,children:`${t.name}  ${t.rem}rem \xb7 ${t.px}px`})]},y())),g+=i+10}),w(),v(e("Spacing","间距"));{let e=Math.max(...E(i.base).map(e=>e.px));E(i.base).forEach(t=>{let r=Math.max(2,t.px/e*944);f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("text",{x:48,y:g+11,fontFamily:iB,fontSize:11,fill:iW,children:t.name}),(0,s.jsxs)("text",{x:112,y:g+11,fontFamily:iB,fontSize:11,fill:iW,children:[t.px,"px"]}),(0,s.jsx)("rect",{x:168,y:g,width:r,height:14,rx:3,fill:x})]},y())),g+=24})}w(),v(e("Radius","圆角"));{let e=g;L(l.base).forEach((t,r)=>{let a=48+120*r,i=Math.min(t.px,36);f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:a,y:e,width:72,height:72,rx:i,fill:x+"22",stroke:x}),(0,s.jsx)("text",{x:a,y:e+72+16,fontFamily:iB,fontSize:11,fill:iO,children:t.name}),(0,s.jsx)("text",{x:a,y:e+72+30,fontFamily:iB,fontSize:10,fill:iW,children:"full"===t.name?"9999":t.px+"px"})]},y()))}),g=e+72+42}w(),v(e("Border","描边"));{let e=g;W(d.base).forEach((t,r)=>{let a=48+132*r;f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:a,y:e,width:72,height:72,rx:8,fill:"#fff",stroke:"strong"===t.name?x:"#cbd5e1",strokeWidth:t.px}),(0,s.jsx)("text",{x:a,y:e+72+16,fontFamily:iB,fontSize:11,fill:iO,children:t.name}),(0,s.jsxs)("text",{x:a,y:e+72+30,fontFamily:iB,fontSize:10,fill:iW,children:[t.px,"px"]})]},y()))}),g=e+72+42}w(),v(e("Elevation","阴影"));{let e=g;["sm","md","lg"].forEach((t,r)=>{let a=n[t],i=48+206*r;f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("defs",{children:(0,s.jsx)("filter",{id:`board-sh-${t}`,x:"-50%",y:"-50%",width:"200%",height:"200%",children:(0,s.jsx)("feDropShadow",{dx:0,dy:a.offsetY,stdDeviation:a.blur/2,floodColor:"#000",floodOpacity:a.opacity})})}),(0,s.jsx)("rect",{x:i,y:e,width:150,height:76,rx:12,fill:"#fff",filter:`url(#board-sh-${t})`}),(0,s.jsx)("text",{x:i,y:e+76+18,fontFamily:iB,fontSize:11,fill:iO,children:t}),(0,s.jsx)("text",{x:i,y:e+76+32,fontFamily:iB,fontSize:9.5,fill:iW,children:`blur ${a.blur} \xb7 y ${a.offsetY} \xb7 ${Math.round(100*a.opacity)}%`})]},y()))}),g=e+76+44}w(),v(e("Opacity","透明度"));{let e=g;B(c.base).forEach((t,r)=>{let a=48+144*r;f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:a,y:e,width:120,height:54,rx:8,fill:"#f5f5f5",stroke:i_}),(0,s.jsx)("rect",{x:a,y:e,width:120,height:54,rx:8,fill:x,fillOpacity:t.value}),(0,s.jsx)("text",{x:a,y:e+54+16,fontFamily:iB,fontSize:11,fill:iO,children:t.name}),(0,s.jsxs)("text",{x:a,y:e+54+30,fontFamily:iB,fontSize:10,fill:iW,children:[Math.round(100*t.value),"%"]})]},y()))}),g=e+54+42}w(),v(e("Motion","动效"));{let e=g;T(o.base).forEach((t,r)=>{f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("text",{x:48,y:e+22*r+11,fontFamily:iB,fontSize:11,fill:iW,children:t.name}),(0,s.jsxs)("text",{x:138,y:e+22*r+11,fontFamily:iB,fontSize:11,fill:iO,children:[t.ms,"ms"]})]},y()))});let t=function(e){let t=e.match(/cubic-bezier\(([^)]+)\)/);if(!t)return null;let r=t[1].split(",").map(e=>parseFloat(e.trim()));return 4===r.length?[r[0],r[1],r[2],r[3]]:null}(O[o.easing]);f.push((0,s.jsxs)("g",{children:[(0,s.jsx)("rect",{x:972,y:e,width:110,height:110,rx:8,fill:"#fafafa",stroke:i_}),t&&(0,s.jsx)("path",{d:`M 972 ${e+110} C ${972+110*t[0]} ${e+110-110*t[1]} ${972+110*t[2]} ${e+110-110*t[3]} ${1082} ${e}`,fill:"none",stroke:x,strokeWidth:2}),(0,s.jsx)("text",{x:972,y:e+110+16,fontFamily:iB,fontSize:11,fill:iW,children:o.easing})]},y())),g=e+Math.max(22*T(o.base).length,140)}let j=g+=48;return(0,s.jsxs)("svg",{id:iP,xmlns:"http://www.w3.org/2000/svg",viewBox:`0 0 1200 ${j}`,width:"100%",style:{height:"auto",display:"block"},role:"img","aria-label":e("Design system overview","设计系统总览"),children:[(0,s.jsx)("rect",{x:0,y:0,width:1200,height:j,fill:"#ffffff"}),f]})}function iU(e){let t=e.cloneNode(!0);t.setAttribute("xmlns","http://www.w3.org/2000/svg"),t.setAttribute("xmlns:xlink","http://www.w3.org/1999/xlink");let r=new XMLSerializer().serializeToString(t);return`<?xml version="1.0" encoding="UTF-8"?>
+${r}`}function iY(e,t){let r=e.replace(/^<\?xml[^>]*\?>\s*/,"");return`<!doctype html>
+<html lang="zh">
+<head>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+<title>${t}</title>
+<style>
+  :root { color-scheme: light; }
+  body { margin: 0; background: #f5f5f5; font-family: ui-sans-serif, system-ui, sans-serif; }
+  .wrap { max-width: 1240px; margin: 0 auto; padding: 32px 16px; }
+  .card { background: #fff; border-radius: 16px; box-shadow: 0 1px 3px rgba(0,0,0,.08); overflow: hidden; }
+  .card svg { width: 100%; height: auto; display: block; }
+</style>
+</head>
+<body>
+  <div class="wrap">
+    <div class="card">${r}</div>
+  </div>
+</body>
+</html>
+`}let iq={success:150,warning:75,error:27,info:255},iX={success:.15,warning:.16,error:.19,info:.16};function iV(e){let t=rN(e).l<.5,r={};for(let a of rC){let i=iq[a],s=iX[a],l=t?.72:.58,n=rM({mode:"oklch",l,c:s,h:i});for(let r=0;r<16&&3.2>function(e,t){let r=rS(e),a=rS(t),[i,s]=r>a?[r,a]:[a,r];return(i+.05)/(s+.05)}(n,e);r++)n=rM({mode:"oklch",l:l=t?Math.min(.92,l+.03):Math.max(.38,l-.03),c:s,h:i});r[a]=n}return r}function iG(){let e=r_(e=>e.colors),t=r_(e=>e.globals),r=r_(e=>e.typography),a=r_(e=>e.spacing),i=r_(e=>e.radius),n=r_(e=>e.shadow),o=r_(e=>e.motion),d=r_(e=>e.border),c=r_(e=>e.opacity),h=r_(e=>e.dark),[u,x]=(0,l.useState)(!0),[p,m]=(0,l.useState)(!1),f=A(),g=(0,l.useMemo)(()=>h.enabled?aQ(e,t,h.overrides).light.map(e=>({...e,displayHex:e.hex})):e.map(e=>({...e,displayHex:rE(e,t)})),[e,t,h.enabled,h.overrides]),b=(0,l.useMemo)(()=>h.enabled?aQ(e,t,h.overrides).dark.map(e=>({...e,displayHex:e.hex})):null,[e,t,h.enabled,h.overrides]),y=e=>e.find(e=>"background"===e.role)?.displayHex??e[0]?.displayHex??"#ffffff",v=(0,l.useMemo)(()=>iV(y(g)),[g]),w=(0,l.useMemo)(()=>b?iV(y(b)):null,[b]);if(0===g.length)return null;let j=async()=>{let e=document.getElementById(iP);if(e){m(!0);try{var t;let r,a;t=await function(e,t=2){return new Promise((r,a)=>{let i,{w:s,h:l}=(i=e.match(/viewBox="0 0 ([\d.]+) ([\d.]+)"/))?{w:parseFloat(i[1]),h:parseFloat(i[2])}:{w:1200,h:1200},n=new Image;n.decoding="sync";let o="data:image/svg+xml;charset=utf-8,"+encodeURIComponent(e);n.onload=()=>{let e=document.createElement("canvas");e.width=Math.round(s*t),e.height=Math.round(l*t);let i=e.getContext("2d");i?(i.fillStyle="#ffffff",i.fillRect(0,0,e.width,e.height),i.drawImage(n,0,0,e.width,e.height),e.toBlob(e=>{e?r(e):a(Error(U("PNG generation failed","PNG 生成失败")))},"image/png")):a(Error(U("Could not create a canvas context","无法创建 canvas 上下文")))},n.onerror=()=>a(Error(U("SVG rasterization failed","SVG 光栅化失败"))),n.src=o})}(iU(e),2),r=URL.createObjectURL(t),(a=document.createElement("a")).href=r,a.download="design-pact.png",a.click(),URL.revokeObjectURL(r)}finally{m(!1)}}},k="rounded border border-neutral-300 px-2.5 py-1 text-xs hover:bg-neutral-100 disabled:opacity-40 dark:border-neutral-700 dark:hover:bg-neutral-800";return(0,s.jsxs)("div",{className:"space-y-4",children:[(0,s.jsxs)("div",{className:"flex flex-wrap items-center justify-between gap-2 rounded-xl border border-neutral-200 px-4 py-3 dark:border-neutral-800",children:[(0,s.jsxs)("div",{children:[(0,s.jsx)("p",{className:"text-xs font-semibold",children:f("Design system file · for AI / your team","设计系统文件 · 给 AI / 团队")}),(0,s.jsx)("p",{className:"mt-0.5 text-xs text-neutral-500 dark:text-neutral-400",children:f("One design.md: drop it in your repo and let your own AI (Claude Code / Cursor) build UI from it — on your compute, no need for this tool to be online.","一个 design.md：丢进代码库，让你自己的 AI（Claude Code / Cursor）按它生成 UI——用你自己的算力，无需本工具在线。")})]}),(0,s.jsx)("button",{onClick:()=>{let e,t,s,l,h,u,x,p,m,f,y,j,k,N,M,$,S,z,C,F,H,R,P;return iT("design.md",(t=(e=[...g].sort((e,t)=>t.proportion-e.proportion)).map(e=>`- ${"unassigned"===e.role?e.id:e.role}: ${e.displayHex} (${(100*e.proportion).toFixed(1)}% of source image)`).join("\n"),s=ic(r).map(e=>`- ${e.name}: ${e.rem}rem (${e.px}px)`).join("\n"),l=e[0],h=e.find(e=>"accent"===e.role)??e[1],u=e.find(e=>"primary"===e.role)??e[1],x=g.map(e=>`  --color-${"unassigned"===e.role?e.id:e.role}: ${e.displayHex};`).join("\n"),p=v?"\n"+rC.map(e=>`  --color-${e}: ${v[e]};`).join("\n"):"",m=ic(r).map(e=>`  --font-size-${e.name}: ${e.rem}rem;`).join("\n"),f=E(a.base).map(e=>`  --spacing-${e.name}: ${e.px}px;`).join("\n"),y=L(i.base).map(e=>`  --radius-${e.name}: ${e.px}px;`).join("\n"),j=["sm","md","lg"].map(e=>`  --shadow-${e}: ${I(n[e])};`).join("\n"),k=T(o.base).map(e=>`  --duration-${e.name}: ${e.ms}ms;`).join("\n"),N=W(d.base).map(e=>`  --border-${e.name}: ${e.px}px;`).join("\n"),M=B(c.base).map(e=>`  --opacity-${e.name}: ${e.value};`).join("\n"),$=b&&b.length>0&&w?"\n"+rC.map(e=>`    --color-${e}: ${w[e]};`).join("\n"):"",S=b&&b.length>0?`
+@media (prefers-color-scheme: dark) {
+  :root {
+${b.map(e=>`    --color-${"unassigned"===e.role?e.id:e.role}: ${e.displayHex};`).join("\n")}${$}
+  }
+}
+`:"",z=`:root {
+${x}${p}
+  --font-family-body: ${r.fontFamily};
+  --font-family-heading: ${r.headingFamily};
+  --font-weight: ${r.fontWeight};
+  --font-weight-heading: ${D(r.fontWeight)};
+  --font-weight-bold: ${_(r.fontWeight)};
+  --line-height: ${r.lineHeight};
+  --letter-spacing: ${r.letterSpacing}em;
+${m}
+${f}
+${y}
+${N}
+${j}
+${k}
+  --easing-standard: ${O[o.easing]};
+${M}
+}
+${S}`,C=v?`
+## Status colors
+Use these for feedback only — never as brand/UI surface colors. \`--color-success\` ${v.success} (confirmations), \`--color-warning\` ${v.warning} (cautions), \`--color-error\` ${v.error} (errors/destructive), \`--color-info\` ${v.info} (informational). Reference via \`var(--color-…)\`.${w?" In dark mode the `@media` block above overrides these with the dark-background variants — same convention as the brand colors.":""}
+`:"",F=b&&b.length>0?`
+## Dark mode
+The \`@media (prefers-color-scheme: dark)\` block above overrides COLOR variables only — every other token (type, spacing, radius, shadow, motion) stays identical in dark mode. Do not hand-pick dark colors or adjust non-color tokens for dark mode; the block is authoritative.
+`:"",H=`# Design system
+
+## Machine-readable tokens — COPY THIS BLOCK VERBATIM
+Paste the \`:root\` below into your \`<style>\` exactly as written, then reference
+every value through \`var(--…)\`. This block is the single source of truth.
+
+Hard rules:
+- Do NOT redefine, round, rescale, or re-derive any value. Copy it character for character.
+- Do NOT introduce colors, fonts, font-sizes, spacing, radii, or shadows that are not declared here.
+- If you need a lighter/darker shade of a color, derive it in OKLCH by changing lightness only — keep hue and chroma fixed. Do not invent a new hue.
+- Every length in your CSS must be a \`var(--…)\` reference. Do NOT convert a \`px\` token to \`rem\` (or any other unit) — reference it as-is. Spacing, radius, and border vars are in \`px\`; font sizes are in \`rem\`; keep each as declared.
+
+\`\`\`css
+${z}\`\`\`
+
+The prose below explains the intent behind these tokens. When prose and the \`:root\` block disagree, the block wins.
+
+---
+
+When generating UI from this token set, respect the following proportions and roles. The percentages reflect how much of the source design each color occupies — use them as a guide for surface area in the output.
+
+## Color palette
+${t}
+
+The dominant background should occupy roughly ${(100*l.proportion).toFixed(0)}% of the layout.
+
+Bind colors to roles exactly as the design tool renders them — do NOT swap primary and accent:
+
+- **primary (${u.displayHex})** is the main interactive fill: primary buttons / CTAs, active nav item, key links, the logo mark. This is the button color.
+- **accent (${h.displayHex})** is for SECONDARY emphasis only: badges/chips, chart & graphic accents, small highlights — typically ${Math.min(15,Math.round(100*h.proportion))}% or less of any screen. Do not use accent as the primary button fill.
+- **muted** for secondary/placeholder text, **border** for hairlines and dividers.
+
+## Typography
+Base size ${r.base}px, modular scale ratio ${r.ratio}.
+
+${s}
+
+Body family: ${r.fontFamily}
+Heading family: ${r.headingFamily}
+Line-height: ${r.lineHeight}, letter-spacing: ${r.letterSpacing}em. There are three explicit font weights — bind them by role, and never let the browser default an element's weight:
+
+- **\`--font-weight\` (${r.fontWeight})** → body text, labels, and any non-heading copy.
+- **\`--font-weight-heading\` (${D(r.fontWeight)})** → all headings h1–h5. Set this on every heading; do NOT leave headings at the body weight.
+- **\`--font-weight-bold\` (${_(r.fontWeight)})** → emphasis only: primary CTA labels, \`<strong>\`, badges.
+
+## Spacing
+Base unit ${a.base}px. Use this 8-step scale for padding/margin/gap:
+
+${E(a.base).map(e=>`- ${e.name}: ${e.px}px`).join("\n")}
+
+Bind padding & gaps to these steps exactly as the design tool renders them —
+padding is written as \`vertical horizontal\`:
+
+- **Primary / prominent CTA button** → \`--spacing-sm\` \`--spacing-lg\` (e.g. \`padding: var(--spacing-sm) var(--spacing-lg)\`) — a taller, comfortable target.
+- **Compact buttons / inputs / chips** → \`--spacing-xxs\` \`--spacing-sm\`.
+- **List rows / nav items / card header & footer** → \`--spacing-xs\` \`--spacing-md\`.
+- **Card / panel / modal body** → \`--spacing-md\` on all sides.
+- **Gap between sibling controls, grid/flex gaps** → \`--spacing-sm\`.
+- **Vertical rhythm between page sections** → \`--spacing-xl\` … \`--spacing-section\`.
+
+Only use listed values; never improvise an intermediate gap.
+
+## Border radius
+Base ${i.base}px. Use:
+
+${L(i.base).map(e=>`- ${e.name}: ${"full"===e.name?"9999px (pill)":`${e.px}px`}`).join("\n")}
+
+Bind components to these steps exactly as the design tool renders them — do NOT
+pick a step freely (e.g. do not make buttons pill-shaped unless \`--radius-md\`
+resolves to a pill):
+
+- **Buttons / controls / nav items** → \`--radius-md\`
+- **Inputs / text fields / selects** → \`--radius-sm\`
+- **Cards / panels / modals / larger surfaces** → \`--radius-lg\`
+- **Badges / chips / avatars / toggles (intentionally pill)** → \`--radius-full\`
+- Bigger containers may use \`--radius-xl\`; \`--radius-full\` is reserved for
+  circles/pills, never for standard buttons or cards.
+
+## Shadow / elevation
+${n.advanced?"Per-level custom values":`Intensity ${n.intensity.toFixed(2)}`}.
+
+${["sm","md","lg"].map(e=>`- ${e}: ${I(n[e])}`).join("\n")}
+
+Bind each level to an elevation exactly as the design tool renders them — do NOT
+pick a level freely:
+
+- **sm** → resting surfaces: cards, panels, subtle raise (the default for a raised element).
+- **md** → hovered / lifted state: a card or button on hover, raised popovers.
+- **lg** → floating overlays: modals, drawers, dropdowns, menus above the page.
+
+Flat elements (nav bar, page background, inline controls) get NO shadow. On hover, step a card up one level (sm → md), don't jump straight to lg.
+
+## Border width
+${W(d.base).map(e=>`- ${e.name}: ${e.px}px`).join("\n")}
+
+Bind each width as the design tool renders them:
+
+- **default** → all resting borders: card outlines, input borders, dividers.
+- **strong** → focused / active / selected emphasis (e.g. an input grows from \`default\` to \`strong\` on focus). Do not use \`strong\` for ordinary resting borders.
+
+## Opacity / transparency
+These drive interactive states — wire them up, don't leave them unused. Apply each via \`var(--opacity-…)\` (or an rgba/overlay at that alpha):
+
+${B(c.base).map(e=>`- ${e.name} (${(100*e.value).toFixed(1)}%): ${iR[e.name]??"interactive state"}`).join("\n")}
+
+Every clickable element (buttons, links, cards) should show a hover state and a disabled state using these values. Use \`overlay\` for scrims behind modals/drawers.
+
+## Motion / Animation
+Base duration ${o.base}ms, easing: ${o.easing} (${O[o.easing]}).
+
+${T(o.base).map(e=>`- ${e.name}: ${e.ms}ms`).join("\n")}
+
+Use \`--duration-normal\` as the default transition. Prefer \`--duration-fast\` for hover states and micro-interactions. Reserve \`--duration-page\` for route/page-level transitions.
+${F}${C}
+## Output guidance
+- Maintain the proportional relationships above when laying out a page.
+- Do not introduce new hues. If you need additional shades, derive them by adjusting OKLCH lightness only, keeping hue and chroma fixed.
+- Respect the modular scale — pick from the listed sizes rather than introducing new ones.
+- Use only the listed spacing values; do not improvise intermediate gaps.
+- ${id.length} type sizes is intentional. Use semantic mapping: h1-h5 for headings, body for paragraphs, small/caption for metadata.
+`,R=function(e,t,r,a,i,s,l,n,o,d,c){let h=new Map((o??[]).map(e=>[e.id,e.displayHex])),u={};for(let t of e){let e="unassigned"===t.role?t.id:t.role,r={proportion:t.proportion,oklch:rz(t.displayHex)},a=h.get(t.id);a&&(r.dark=a),u[e]={$value:t.displayHex,$type:"color",$extensions:{"design-pact":r}}}let x={};for(let e of ic(t))x[e.name]={$value:`${e.rem}rem`,$type:"dimension"};let p={};for(let e of E(r.base))p[e.name]={$value:`${e.px}px`,$type:"dimension"};let m={};for(let e of L(a.base))m[e.name]={$value:`${e.px}px`,$type:"dimension"};let f={};for(let e of["sm","md","lg"])f[e]={$value:I(i[e]),$type:"shadow"};let g={};for(let e of T(s.base))g[`duration-${e.name}`]={$value:`${e.ms}ms`,$type:"duration"};g.easing={$value:O[s.easing],$type:"cubicBezier"};let b={};for(let e of W(l.base))b[e.name]={$value:`${e.px}px`,$type:"dimension"};let y={};for(let e of B(n.base))y[e.name]={$value:e.value,$type:"number"};let v=d?Object.fromEntries(rC.map(e=>[e,{$value:d[e],$type:"color",...c?{$extensions:{"design-pact":{dark:c[e]}}}:{}}])):void 0;return{color:u,...v?{semantic:v}:{},typography:{fontFamily:{body:{$value:t.fontFamily,$type:"fontFamily"},heading:{$value:t.headingFamily,$type:"fontFamily"}},fontSize:x,fontWeight:{$value:t.fontWeight,$type:"fontWeight"},fontWeightHeading:{$value:D(t.fontWeight),$type:"fontWeight"},fontWeightBold:{$value:_(t.fontWeight),$type:"fontWeight"},lineHeight:{$value:t.lineHeight,$type:"number"},letterSpacing:{$value:`${t.letterSpacing}em`,$type:"dimension"},$extensions:{"design-pact":{base:t.base,ratio:t.ratio}}},spacing:p,borderRadius:m,borderWidth:b,shadow:f,motion:g,opacity:y}}(g,r,a,i,n,o,d,c,b,v,w),P=new Date().toISOString().slice(0,10),`---
+design-pact: 1
+generated: ${P}
+---
+
+${H}
+---
+
+## Machine-readable tokens (W3C Design Tokens)
+
+Humans and AI can read the prose above. The JSON below lets tools (the companion CLI) reconstruct the design system precisely and deterministically, and convert it to CSS / Tailwind / etc.
+
+\`\`\`json
+${JSON.stringify(R,null,2)}
+\`\`\`
+`),"text/markdown")},className:"shrink-0 rounded-lg bg-neutral-900 px-4 py-2 text-sm font-medium text-white transition hover:bg-neutral-700 dark:bg-white dark:text-black dark:hover:bg-neutral-200",children:f("Download design.md","下载 design.md")})]}),(0,s.jsxs)("section",{className:"rounded-xl border border-neutral-200 dark:border-neutral-800",children:[(0,s.jsxs)("button",{onClick:()=>x(e=>!e),className:"flex w-full items-center justify-between px-4 py-3 text-left",children:[(0,s.jsx)("span",{className:"text-xs font-semibold",children:f("Design system overview · visual export","设计系统总览 · 视觉导出")}),(0,s.jsx)("span",{className:"text-xs text-neutral-400",children:u?f("collapse ↑","收起 ↑"):f("expand ↓","展开 ↓")})]}),u&&(0,s.jsxs)("div",{className:"space-y-3 border-t border-neutral-200 px-4 pb-4 pt-3 dark:border-neutral-800",children:[(0,s.jsxs)("div",{className:"flex flex-wrap items-center gap-1.5",children:[(0,s.jsx)("button",{onClick:()=>{let e=document.getElementById(iP);if(!e)return;let t=iY(iU(e),f("Design system overview","设计系统总览")),r=URL.createObjectURL(new Blob([t],{type:"text/html"}));window.open(r,"_blank","noopener"),setTimeout(()=>URL.revokeObjectURL(r),3e4)},className:"rounded bg-neutral-900 px-2.5 py-1 text-xs text-white hover:bg-neutral-700 dark:bg-white dark:text-black dark:hover:bg-neutral-200",children:f("Open in new tab ↗","在新窗口打开 ↗")}),(0,s.jsx)("span",{className:"mx-1 text-[10px] text-neutral-300 dark:text-neutral-600",children:f("Download:","下载：")}),(0,s.jsx)("button",{onClick:()=>{let e=document.getElementById(iP);e&&iT("design-pact.html",iY(iU(e),f("Design system overview","设计系统总览")),"text/html")},className:k,children:"HTML"}),(0,s.jsx)("button",{onClick:j,disabled:p,className:k,children:"PNG"}),(0,s.jsx)("button",{onClick:()=>{let e=document.getElementById(iP);e&&iT("design-pact.svg",iU(e),"image/svg+xml")},className:k,children:"SVG"}),p&&(0,s.jsx)("span",{className:"text-xs text-neutral-400",children:f("exporting…","导出中…")}),(0,s.jsx)("span",{className:"ml-auto text-[10px] text-neutral-400",children:f("SVG drops straight into Figma / Illustrator","SVG 可直接拖进 Figma / Illustrator")})]}),(0,s.jsx)("div",{className:"max-h-[520px] overflow-auto rounded-lg border border-neutral-200 bg-white dark:border-neutral-800",children:(0,s.jsx)(iA,{})})]})]})]})}function iK(){let e=P(e=>e.lang),t=P(e=>e.toggle),r="text-neutral-900 dark:text-white",a="text-neutral-400 dark:text-neutral-500";return(0,s.jsx)("div",{className:"fixed right-5 top-0 z-50 flex h-[42px] items-center",children:(0,s.jsxs)("button",{onClick:t,title:"Switch language / 切换语言","aria-label":"Switch language",className:"flex cursor-pointer select-none items-center gap-1 text-[10px] font-semibold leading-none",children:[(0,s.jsx)("span",{className:`transition-colors ${"en"===e?r:a}`,children:"EN"}),(0,s.jsx)("span",{className:"font-normal text-neutral-300 dark:text-neutral-600",children:"/"}),(0,s.jsx)("span",{className:`transition-colors ${"zh"===e?r:a}`,children:"ZH"})]})})}function iJ(){let e=j(),t=(0,l.useCallback)(t=>{requestAnimationFrame(()=>{requestAnimationFrame(()=>{let r=document.getElementById(t);r&&(e?(e.resize(),e.scrollTo(r,{duration:1.2,offset:-64})):r.scrollIntoView({behavior:"smooth",block:"start"}))})})},[e]),r=(0,l.useCallback)(()=>t("step-edit"),[t]);return(0,s.jsxs)("main",{className:"min-h-screen bg-neutral-50 font-sans text-neutral-900 dark:bg-black dark:text-neutral-100",children:[(0,s.jsx)(iK,{}),(0,s.jsx)(av,{}),(0,s.jsx)(it,{}),(0,s.jsx)(ag,{onLoaded:r}),(0,s.jsx)(iZ,{})]})}function iZ(){let e=r_(e=>e.colors.length>0),t=A();return e?(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)("section",{id:"step-edit",className:"border-t border-neutral-200 px-6 py-16 dark:border-neutral-800",children:(0,s.jsxs)("div",{className:"mx-auto w-full max-w-[1440px]",children:[(0,s.jsx)("p",{className:"mb-2 text-xs font-medium uppercase tracking-wider text-neutral-400",children:"Step 2 / 5"}),(0,s.jsxs)("div",{className:"grid grid-cols-1 gap-8 lg:grid-cols-2",children:[(0,s.jsxs)("div",{className:"space-y-4",children:[(0,s.jsxs)("header",{className:"space-y-1",children:[(0,s.jsxs)("div",{className:"flex items-center justify-between gap-3",children:[(0,s.jsx)("h2",{className:"text-2xl font-semibold tracking-tight",children:t("Colors","调色")}),(0,s.jsx)(a9,{})]}),(0,s.jsx)("p",{className:"text-sm text-neutral-500 dark:text-neutral-400",children:t("Harmonize the whole palette on the wheel, or click a swatch to edit one color.","色轮做整体协调，点击色块编辑单色。")})]}),(0,s.jsx)(a7,{})]}),(0,s.jsxs)("div",{className:"space-y-4",children:[(0,s.jsxs)("header",{className:"space-y-1",children:[(0,s.jsx)("h2",{className:"text-2xl font-semibold tracking-tight",children:t("Preview","预览")}),(0,s.jsx)("p",{className:"text-sm text-neutral-500 dark:text-neutral-400",children:t("Switch mockup types to see different scenarios.","切换 mockup 类型查看不同场景效果。")})]}),(0,s.jsx)(io,{})]})]})]})}),(0,s.jsx)("section",{id:"step-typography",className:"border-t border-neutral-200 px-6 py-16 dark:border-neutral-800",children:(0,s.jsxs)("div",{className:"mx-auto w-full max-w-[1440px]",children:[(0,s.jsx)("p",{className:"mb-2 text-xs font-medium uppercase tracking-wider text-neutral-400",children:"Step 3 / 5"}),(0,s.jsxs)("header",{className:"mb-6 space-y-1",children:[(0,s.jsx)("h2",{className:"text-2xl font-semibold tracking-tight",children:t("Type","字体")}),(0,s.jsx)("p",{className:"text-sm text-neutral-500 dark:text-neutral-400",children:t("The type scale loads from the template. Drag base to set body size; ratio controls the H1→Caption step.","模板里的字号阶梯已自动载入。拖动 base 改正文字号，ratio 控制 H1→Caption 的递增比。")})]}),(0,s.jsx)(im,{})]})}),(0,s.jsx)("section",{id:"step-tokens",className:"border-t border-neutral-200 px-6 py-16 dark:border-neutral-800",children:(0,s.jsxs)("div",{className:"mx-auto w-full max-w-[1440px]",children:[(0,s.jsx)("p",{className:"mb-2 text-xs font-medium uppercase tracking-wider text-neutral-400",children:"Step 4 / 5"}),(0,s.jsxs)("header",{className:"mb-6 space-y-1",children:[(0,s.jsx)("h2",{className:"text-2xl font-semibold tracking-tight",children:t("Details","细节")}),(0,s.jsx)("p",{className:"text-sm text-neutral-500 dark:text-neutral-400",children:t("Tune the spacing scale, radii, and shadow depth. The base slider scales all spacing; radii derive sm→full together; shadows scale by intensity, or expand to tune the three levels independently.","调节间距阶梯、圆角和阴影深度。base 滑条统一缩放整套 spacing；圆角统一从 sm 派生到 full；阴影默认按 intensity 缩放，可展开高级独立调三档。")})]}),(0,s.jsx)(iy,{})]})}),(0,s.jsx)("section",{id:"step-motion",className:"border-t border-neutral-200 px-6 py-16 dark:border-neutral-800",children:(0,s.jsxs)("div",{className:"mx-auto w-full max-w-[1440px]",children:[(0,s.jsx)("p",{className:"mb-2 text-xs font-medium uppercase tracking-wider text-neutral-400",children:"Step 5 / 5"}),(0,s.jsxs)("header",{className:"mb-6 space-y-1",children:[(0,s.jsx)("h2",{className:"text-2xl font-semibold tracking-tight",children:t("Motion","动效")}),(0,s.jsx)("p",{className:"text-sm text-neutral-500 dark:text-neutral-400",children:t("The base slider drives the whole duration scale (micro → page); one easing curve applies to every transition.","base 滑条控制整套时长阶梯（micro → page），缓动曲线统一应用到所有过渡。")})]}),(0,s.jsx)(iL,{})]})}),(0,s.jsx)("section",{id:"step-export",className:"border-t border-neutral-200 px-6 py-16 dark:border-neutral-800",children:(0,s.jsxs)("div",{className:"mx-auto w-full max-w-[1440px] space-y-6",children:[(0,s.jsxs)("header",{className:"space-y-2",children:[(0,s.jsx)("h2",{className:"text-2xl font-semibold tracking-tight",children:t("Export","导出")}),(0,s.jsx)("p",{className:"text-sm text-neutral-500 dark:text-neutral-400",children:t("Download design.md for your agent, or export the visual overview for your team.","下载 design.md 交给你的 agent；或导出视觉总览发给团队。")})]}),(0,s.jsx)(iG,{})]})})]}):null}e.s(["default",0,function(){return(0,s.jsx)(rJ,{children:(0,s.jsx)(v,{root:!0,options:{duration:1.2,smoothWheel:!0,wheelMultiplier:1},children:(0,s.jsx)(iJ,{})})})}],31713)}]);