@gospore/theme 1.0.138 → 1.0.140

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/README.md +22 -3
  2. package/dist/Theme.vue.d.ts +2 -2
  3. package/dist/theme.cjs.js +1 -1
  4. package/dist/theme.cjs.js.map +1 -1
  5. package/dist/theme.css +1 -1
  6. package/dist/theme.es.js +416 -243
  7. package/dist/theme.es.js.map +1 -1
  8. package/dist/theme.umd.js +1 -1
  9. package/dist/theme.umd.js.map +1 -1
  10. package/package.json +3 -3
package/README.md CHANGED
@@ -37,14 +37,33 @@ import { Theme } from "@gospore/theme";
37
37
  ```
38
38
 
39
39
  | Prop | Type | Default | Description |
40
- | ------------- | -------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------ | ----------------------------------------------------------------------------------------------------------------------------- |
41
- | `mode` | `auto | light | dark` | `auto` | Controls which color mode is active. `auto` follows the OS preference (and persisted storage when used with `ThemeSwitcher`). |
42
- | `accentColor` | `String` | `undefined` | Optional HEX color (`#RRGGBB` or `#RGB`). When provided, the component derives a full brand palette and applies it to both the local `.theme` wrapper and `document.documentElement` for portals. |
40
+ | --- | --- | --- | --- |
41
+ | `mode` | `auto \| light \| dark` | `auto` | Controls which color mode is active. `auto` follows the OS preference (and persisted storage when used with `ThemeSwitcher`). |
42
+ | `accentColor` | `String` | `undefined` | Optional HEX color (`#RRGGBB` or `#RGB`). When provided, the component derives semantic brand role tokens with automatic readability-focused contrast hardening (target ratio ~3.8) and applies them to both the local `.theme` wrapper and `document.documentElement` for portals. |
43
43
 
44
44
  `<Theme>` listens for system changes, stores the resolved mode, exposes a
45
45
  `theme` provide/inject value, and toggles the global `dark-mode` attribute so
46
46
  all Design System components react automatically.
47
47
 
48
+ When contrast hardening is active, rendered brand tones can differ from the raw
49
+ `accentColor` input so text/icon pairings stay accessible.
50
+
51
+ Brand semantics are now role-based (`surface`, `on-surface`, `border`). Do not
52
+ rely on `--color-brand-100..1000` as stable UI meaning tokens.
53
+
54
+ ## Brand Token Showcase Example
55
+
56
+ The Theme Playground includes an interactive brand-token example. You can change
57
+ `accentColor` live and inspect:
58
+
59
+ - The resulting semantic brand tokens (`surface`, `on-surface`, `border`) plus
60
+ legacy tokens (`--color-brand-100..1000`).
61
+ - How multiple components (`Keyword`, `Button`, `Tabs`, `AvatarItem`) consume
62
+ those tokens.
63
+
64
+ Note: The live components follow the currently active global mode
65
+ (`dark-mode`). The token list still shows both light and dark token values.
66
+
48
67
  ## Theme switcher
49
68
 
50
69
  ```vue
package/dist/Theme.vue.d.ts CHANGED
@@ -11,7 +11,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
11
11
  };
12
12
  /**
13
13
  * Optional hex accent color ("#RRGGBB" or "#RGB"). When provided,
14
- * Theme derives the `--color-brand-*` palette and exposes the tokens on
14
+ * Theme derives contrast-safe semantic brand tokens and exposes them on
15
15
  * the root .theme element (and the global document for portals).
16
16
  */
17
17
  accentColor: {
@@ -34,7 +34,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
34
34
  };
35
35
  /**
36
36
  * Optional hex accent color ("#RRGGBB" or "#RGB"). When provided,
37
- * Theme derives the `--color-brand-*` palette and exposes the tokens on
37
+ * Theme derives contrast-safe semantic brand tokens and exposes them on
38
38
  * the root .theme element (and the global document for portals).
39
39
  */
40
40
  accentColor: {
package/dist/theme.cjs.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue");require("what-input");const L=require("@gospore/dropdown-menu"),x=["auto","light","dark"],z="gospore-theme-mode",ae=3600*24*365,se="(prefers-color-scheme: dark)";function B(){if(typeof document>"u")return null;const o=ue(z);return o&&x.includes(o)?o:null}function le(o){if(typeof document>"u"||!x.includes(o))return;const a=typeof window<"u"?window.location.hostname:"",l=typeof window<"u"?window.location.protocol:"",s=ie(a),b=l==="https:",k=["path=/",`max-age=${ae}`,"SameSite=Lax"];s&&k.push(`domain=${s}`),b&&k.push("Secure"),document.cookie=[`${encodeURIComponent(z)}=${encodeURIComponent(o)}`,...k].join("; ")}function F(o){if(typeof document>"u")return;const a=typeof o=="string"&&x.includes(o)?o:B()??"auto";console.log("Applying theme mode:",a);const l=de(a);document.documentElement.setAttribute("dark-mode",l)}function ue(o){if(typeof document>"u"||!document.cookie)return null;const a=`${encodeURIComponent(o)}=`,l=document.cookie.split("; ");for(const s of l)if(s.startsWith(a))return decodeURIComponent(s.slice(a.length));return null}function ie(o){if(!o||o==="localhost")return null;if(/^\d+(?:\.\d+){3}$/.test(o))return o;const l=o.split(".");return l.length<=1?null:l.length===2?o:l.slice(-2).join(".")}function de(o){if(o==="dark")return!0;if(o==="light"||typeof window>"u")return!1;try{const a=typeof window.matchMedia=="function"?window.matchMedia(se):null;return a?a.matches:!1}catch{return!1}}const H=Symbol.for("gospore.theme.portalHost");function fe(){const o=t.inject(H,null);console.log("Using theme portal host:",o);const a=typeof document<"u"?document.body:"body";return t.computed(()=>o?.value??a)}const me="(prefers-color-scheme: dark)",he="(prefers-reduced-motion: reduce)",pe=200,be=Object.assign({name:"Theme"},{__name:"Theme",props:{mode:{type:String,validator:o=>["auto","light","dark"].includes(o)},accentColor:{type:String,required:!1,default:void 0},exposeGlobalAccent:{type:Boolean,default:!1}},setup(o){const a=o,l=[],s=new Set;function b(){const e=document.documentElement;if(!e)return;s.forEach(c=>{e.style.removeProperty(c)}),s.clear();const n=[...l].reverse().find(c=>c.enabled&&c.vars&&Object.keys(c.vars).length>0);n&&Object.entries(n.vars).forEach(([c,r])=>{e.style.setProperty(c,r),s.add(c)})}const k=window.matchMedia(me),U=window.matchMedia(he),_=q();F(_);const I=t.ref(_),u=t.ref({darkMode:M(_)}),h=t.ref(null);k.addEventListener("change",V),t.watch(()=>a.mode,()=>{f()},{immediate:!0}),t.watch(()=>u.value.darkMode,(e,n)=>{if(n===void 0){G(e);return}W(()=>{G(e)})},{immediate:!0}),t.onBeforeUnmount(()=>{k.removeEventListener("change",V);const e=l.indexOf(A);e!==-1&&l.splice(e,1),b()});function f(){const e=q();I.value=e,u.value.darkMode=M(e)}function M(e){return e==="dark"?!0:e==="light"?!1:k.matches}function V(e){!e||I.value!=="auto"||(u.value.darkMode=e.matches)}function G(e){document.documentElement.setAttribute("dark-mode",e)}function W(e){if(U.matches){e();return}const n=document.startViewTransition?.bind(document);if(n){n(()=>{e()});return}e();const c=document.documentElement;typeof c.animate=="function"&&window.requestAnimationFrame(()=>{c.animate([{opacity:.85},{opacity:1}],{duration:pe,easing:"ease-in-out"})})}function q(){return a.mode??B()??"auto"}t.provide("theme",u),t.provide(H,h);function K(e){if(!e)return null;const n=e.trim().toLowerCase();if(!/^#(?:[0-9a-f]{3}|[0-9a-f]{6})$/i.exec(n))return null;if(n.length===4){const r=n[1],i=n[2],m=n[3];return`#${r}${r}${i}${i}${m}${m}`}return n}function J(e){const n=K(e);if(!n)return null;const c=parseInt(n.slice(1,3),16),r=parseInt(n.slice(3,5),16),i=parseInt(n.slice(5,7),16);return{r:c,g:r,b:i}}function X({r:e,g:n,b:c}){const r=i=>i.toString(16).padStart(2,"0");return`#${r(e)}${r(n)}${r(c)}`}function p(e){return Math.max(0,Math.min(1,e))}function P(e){return e<=.04045?e/12.92:Math.pow((e+.055)/1.055,2.4)}function j(e){const n=p(e);return n<=.0031308?12.92*n:1.055*Math.pow(n,1/2.4)-.055}function Z({r:e,g:n,b:c}){const r=e/255,i=n/255,m=c/255,y=P(r),R=P(i),d=P(m),v=.4122214708*y+.5363325363*R+.0514459929*d,w=.2119034982*y+.6806995451*R+.1073969566*d,S=.0883024619*y+.2817188376*R+.6299787005*d,g=Math.cbrt(v),E=Math.cbrt(w),D=Math.cbrt(S),$=.2104542553*g+.793617785*E-.0040720468*D,O=1.9779984951*g-2.428592205*E+.4505937099*D,T=.0259040371*g+.7827717662*E-.808675766*D,C=Math.sqrt(O*O+T*T);let N=Math.atan2(T,O)*(180/Math.PI);return N<0&&(N+=360),{l:$,c:C,h:N}}function Y(e,n,c,r=!1){const i=c*Math.PI/180,m=n*Math.cos(i),y=n*Math.sin(i),R=e+.3963377774*m+.2158037573*y,d=e-.1055613458*m-.0638541728*y,v=e-.0894841775*m-1.291485548*y,w=r?p(R):R,S=r?p(d):d,g=r?p(v):v;if(!r&&(w<-1e-4||w>1.0001||S<-1e-4||S>1.0001||g<-1e-4||g>1.0001))return null;const E=w*w*w,D=S*S*S,$=g*g*g;let O=4.0767416621*E-3.3077115913*D+.2309699292*$,T=-1.2684380046*E+2.6097574011*D-.3413193965*$,C=-.0041960863*E-.7034186147*D+1.707614701*$;if(r)O=p(O),T=p(T),C=p(C);else if(O<-1e-4||O>1.0001||T<-1e-4||T>1.0001||C<-1e-4||C>1.0001)return null;const N=p(j(O)),oe=p(j(T)),re=p(j(C));return{r:Math.round(N*255),g:Math.round(oe*255),b:Math.round(re*255)}}function ee(e,n,c){let r=n;for(let i=0;i<8;i+=1){const m=Y(e,r,c);if(m)return m;r*=.9}return Y(e,p(r),c,!0)||{r:0,g:0,b:0}}function te(e){const n=K(e);if(!n)return null;const c=J(n);if(!c)return null;const r=Z(c),i={100:{lightness:.35,chroma:.45},200:{lightness:.28,chroma:.5},300:{lightness:.22,chroma:.6},400:{lightness:.16,chroma:.75},500:{lightness:.08,chroma:.9},600:{lightness:0,chroma:1,base:!0},700:{lightness:-.08,chroma:1.05},800:{lightness:-.18,chroma:1.1},900:{lightness:-.28,chroma:1.15},1e3:{lightness:-.35,chroma:1.2}},m={},y=d=>d===0?r.l:d>0?p(r.l+d*(1-r.l)):p(r.l*(1+d)),R=d=>{if(d===1)return r.c;const v=r.c*d;return Math.max(0,Math.min(.4,v))};return Object.entries(i).forEach(([d,v])=>{const w=`--color-brand-${d}`;if(v.base){m[w]=n;return}const S=y(v.lightness),g=R(v.chroma),E=ee(S,g,r.h);m[w]=X(E)}),m}const Q=t.computed(()=>te(a.accentColor)??{}),ne=t.computed(()=>Q.value),A={vars:{},enabled:!!a.exposeGlobalAccent};return l.push(A),t.watch(()=>a.exposeGlobalAccent,e=>{A.enabled=!!e,b()},{immediate:!0}),t.watch(Q,e=>{e&&Object.keys(e).length>0?A.vars={...e}:A.vars={},b()},{immediate:!0}),(e,n)=>(t.openBlock(),t.createElementBlock("div",{class:"theme",style:t.normalizeStyle(ne.value)},[t.renderSlot(e.$slots,"default"),t.createElementVNode("div",{ref_key:"portalHost",ref:h,class:"theme__portal-host"},null,512)],4))}}),ge=(o,a)=>{const l=o.__vccOpts||o;for(const[s,b]of a)l[s]=b;return l},ke={__name:"ThemeSwitcher",props:{mode:{type:String,default:"auto",validator:o=>["auto","light","dark"].includes(o)}},emits:["update:mode"],setup(o,{emit:a}){const s=[{value:"auto",label:"System"},{value:"light",label:"Light"},{value:"dark",label:"Dark"}].reduce((h,f)=>(h[f.value]=f.label,h),{}),b=x,k=o,U=a;F();const _=t.ref(!1),I=B()??k.mode,u=t.ref(b.includes(I)?I:"auto");return t.computed(()=>s[u.value]??s.auto),t.watch(()=>k.mode,h=>{b.includes(h)&&h!==u.value&&(u.value=h)}),t.watch(u,h=>{if(!b.includes(h)){u.value="auto";return}_.value=!1,U("update:mode",h),le(h)},{immediate:!0}),(h,f)=>(t.openBlock(),t.createBlock(t.unref(L.DropdownMenu),{open:_.value,"onUpdate:open":f[3]||(f[3]=M=>_.value=M),text:"Theme","aria-label":"Select theme mode"},{default:t.withCtx(()=>[t.createVNode(t.unref(L.DropdownItemGroup),{title:"Theme"},{default:t.withCtx(()=>[t.createVNode(t.unref(L.DropdownItemRadio),{checked:u.value,"onUpdate:checked":f[0]||(f[0]=M=>u.value=M),value:"auto",label:t.unref(s).auto,"aria-label":`${t.unref(s).auto} mode`},null,8,["checked","label","aria-label"]),f[4]||(f[4]=t.createElementVNode("hr",{class:"theme-switcher-divider",role:"separator"},null,-1)),t.createVNode(t.unref(L.DropdownItemRadio),{checked:u.value,"onUpdate:checked":f[1]||(f[1]=M=>u.value=M),value:"light",label:t.unref(s).light,"aria-label":`${t.unref(s).light} mode`},null,8,["checked","label","aria-label"]),t.createVNode(t.unref(L.DropdownItemRadio),{checked:u.value,"onUpdate:checked":f[2]||(f[2]=M=>u.value=M),value:"dark",label:t.unref(s).dark,"aria-label":`${t.unref(s).dark} mode`},null,8,["checked","label","aria-label"])]),_:1})]),_:1},8,["open"]))}},Me=ge(ke,[["__scopeId","data-v-bcbc87cb"]]);exports.Theme=be;exports.ThemeSwitcher=Me;exports.themePortalHostKey=H;exports.useThemePortalTarget=fe;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("vue");require("what-input");const F=require("@gospore/dropdown-menu"),K=["auto","light","dark"],bt="gospore-theme-mode",Dt=3600*24*365,yt="(prefers-color-scheme: dark)";function Z(){if(typeof document>"u")return null;const c=Nt(bt);return c&&K.includes(c)?c:null}function It(c){if(typeof document>"u"||!K.includes(c))return;const i=typeof window<"u"?window.location.hostname:"",b=typeof window<"u"?window.location.protocol:"",f=Ot(i),D=b==="https:",y=["path=/",`max-age=${Dt}`,"SameSite=Lax"];f&&y.push(`domain=${f}`),D&&y.push("Secure"),document.cookie=[`${encodeURIComponent(bt)}=${encodeURIComponent(c)}`,...y].join("; ")}function pt(c){if(typeof document>"u")return;const i=typeof c=="string"&&K.includes(c)?c:Z()??"auto";console.log("Applying theme mode:",i);const b=Lt(i);document.documentElement.setAttribute("dark-mode",b)}function Nt(c){if(typeof document>"u"||!document.cookie)return null;const i=`${encodeURIComponent(c)}=`,b=document.cookie.split("; ");for(const f of b)if(f.startsWith(i))return decodeURIComponent(f.slice(i.length));return null}function Ot(c){if(!c||c==="localhost")return null;if(/^\d+(?:\.\d+){3}$/.test(c))return c;const b=c.split(".");return b.length<=1?null:b.length===2?c:b.slice(-2).join(".")}function Lt(c){if(c==="dark")return!0;if(c==="light"||typeof window>"u")return!1;try{const i=typeof window.matchMedia=="function"?window.matchMedia(yt):null;return i?i.matches:!1}catch{return!1}}const tt=Symbol.for("gospore.theme.portalHost");function xt(){const c=a.inject(tt,null);console.log("Using theme portal host:",c);const i=typeof document<"u"?document.body:"body";return a.computed(()=>c?.value??i)}const Bt="(prefers-color-scheme: dark)",Pt="(prefers-reduced-motion: reduce)",Ut=200,B=3.8,ft=1.8,ht=1.15,gt=1.08,j=2.5,mt=3,W="#ffffff",J="#1f2228",$t=Object.assign({name:"Theme"},{__name:"Theme",props:{mode:{type:String,validator:c=>["auto","light","dark"].includes(c)},accentColor:{type:String,required:!1,default:void 0},exposeGlobalAccent:{type:Boolean,default:!1}},setup(c){const i=c,b=[],f=new Set;function D(){const t=document.documentElement;if(!t)return;f.forEach(o=>{t.style.removeProperty(o)}),f.clear();const e=[...b].reverse().find(o=>o.enabled&&o.vars&&Object.keys(o.vars).length>0);e&&Object.entries(e.vars).forEach(([o,r])=>{t.style.setProperty(o,r),f.add(o)})}const y=window.matchMedia(Bt),q=window.matchMedia(Pt),L=nt();pt(L);const H=a.ref(L),k=a.ref({darkMode:I(L)}),C=a.ref(null);y.addEventListener("change",et),a.watch(()=>i.mode,()=>{v()},{immediate:!0}),a.watch(()=>k.value.darkMode,(t,e)=>{if(e===void 0){ot(t);return}St(()=>{ot(t)})},{immediate:!0}),a.onBeforeUnmount(()=>{y.removeEventListener("change",et);const t=b.indexOf(V);t!==-1&&b.splice(t,1),D()});function v(){const t=nt();H.value=t,k.value.darkMode=I(t)}function I(t){return t==="dark"?!0:t==="light"?!1:y.matches}function et(t){!t||H.value!=="auto"||(k.value.darkMode=t.matches)}function ot(t){document.documentElement.setAttribute("dark-mode",t)}function St(t){if(q.matches){t();return}const e=document.startViewTransition?.bind(document);if(e){e(()=>{t()});return}t();const o=document.documentElement;typeof o.animate=="function"&&window.requestAnimationFrame(()=>{o.animate([{opacity:.85},{opacity:1}],{duration:Ut,easing:"ease-in-out"})})}function nt(){return i.mode??Z()??"auto"}a.provide("theme",k),a.provide(tt,C);function rt(t){if(!t)return null;const e=t.trim().toLowerCase();if(!/^#(?:[0-9a-f]{3}|[0-9a-f]{6})$/i.exec(e))return null;if(e.length===4){const r=e[1],n=e[2],s=e[3];return`#${r}${r}${n}${n}${s}${s}`}return e}function at(t){const e=rt(t);if(!e)return null;const o=parseInt(e.slice(1,3),16),r=parseInt(e.slice(3,5),16),n=parseInt(e.slice(5,7),16);return{r:o,g:r,b:n}}function Y({r:t,g:e,b:o}){const r=n=>n.toString(16).padStart(2,"0");return`#${r(t)}${r(e)}${r(o)}`}function _(t){return Math.max(0,Math.min(1,t))}function P(t){return t<=.04045?t/12.92:Math.pow((t+.055)/1.055,2.4)}function Q(t){const e=_(t);return e<=.0031308?12.92*e:1.055*Math.pow(e,1/2.4)-.055}function kt({r:t,g:e,b:o}){const r=t/255,n=e/255,s=o/255,d=P(r),h=P(n),R=P(s),u=.4122214708*d+.5363325363*h+.0514459929*R,g=.2119034982*d+.6806995451*h+.1073969566*R,p=.0883024619*d+.2817188376*h+.6299787005*R,S=Math.cbrt(u),T=Math.cbrt(g),E=Math.cbrt(p),A=.2104542553*S+.793617785*T-.0040720468*E,m=1.9779984951*S-2.428592205*T+.4505937099*E,M=.0259040371*S+.7827717662*T-.808675766*E,w=Math.sqrt(m*m+M*M);let x=Math.atan2(M,m)*(180/Math.PI);return x<0&&(x+=360),{l:A,c:w,h:x}}function ct(t,e,o,r=!1){const n=o*Math.PI/180,s=e*Math.cos(n),d=e*Math.sin(n),h=t+.3963377774*s+.2158037573*d,R=t-.1055613458*s-.0638541728*d,u=t-.0894841775*s-1.291485548*d,g=r?_(h):h,p=r?_(R):R,S=r?_(u):u;if(!r&&(g<-1e-4||g>1.0001||p<-1e-4||p>1.0001||S<-1e-4||S>1.0001))return null;const T=g*g*g,E=p*p*p,A=S*S*S;let m=4.0767416621*T-3.3077115913*E+.2309699292*A,M=-1.2684380046*T+2.6097574011*E-.3413193965*A,w=-.0041960863*T-.7034186147*E+1.707614701*A;if(r)m=_(m),M=_(M),w=_(w);else if(m<-1e-4||m>1.0001||M<-1e-4||M>1.0001||w<-1e-4||w>1.0001)return null;const x=_(Q(m)),z=_(Q(M)),O=_(Q(w));return{r:Math.round(x*255),g:Math.round(z*255),b:Math.round(O*255)}}function X(t,e,o){let r=e;for(let n=0;n<8;n+=1){const s=ct(t,r,o);if(s)return s;r*=.9}return ct(t,_(r),o,!0)||{r:0,g:0,b:0}}function st(t){const e=at(t);if(!e)return 0;const o=P(e.r/255),r=P(e.g/255),n=P(e.b/255);return .2126*o+.7152*r+.0722*n}function N(t,e){const o=st(t),r=st(e),n=Math.max(o,r),s=Math.min(o,r);return(n+.05)/(s+.05)}function Mt(t,e,o={}){const r=o.minContrast??B,n=o.preferDark!==!1,s=Math.max(.01,Math.min(.06,(t.c||.12)*(o.chromaScale??.25))),d=o.initialLightness??(n?.24:.94),h=n?-1:1,R=o.step??.03;let u=_(d),g=Y(X(u,s,t.h)),p=N(e,g);for(let m=0;m<48;m+=1){const M=Y(X(u,s,t.h)),w=N(e,M);if(w>p&&(p=w,g=M),w>=r)return M;if(u=_(u+h*R),u===0||u===1)break}const S="#101214",T="#ffffff",E=N(e,S),A=N(e,T);return E>=r||A>=r?E>=A?S:T:g}function U(t,e,o={}){const r=o.minContrast??B,n=o.darkCandidate??"#101214",s=o.lightCandidate??"#ffffff",d=o.preferredCandidate,h=o.preferredMinContrast??r,R=o.preferredSwitchDelta??0,u=N(e,n),g=N(e,s),p=u>=r,S=g>=r,T=g>=h,E=u>=h;if(p||S)return d==="light"&&T?s:d==="dark"&&E?n:d==="light"&&S?!p||u-g<=R?s:n:d==="dark"&&p?!S||g-u<=R?n:s:p&&S?u>=g?n:s:p?n:s;const A=u>=g;return Mt(t,e,{minContrast:r,preferDark:A,initialLightness:A?.2:.96,chromaScale:.1})}const vt=[100,200,300,400,500,600,700,800,900,1e3],lt=[.9,.84,.78,.72,.67,.62,.56,.5,.44,.38],Ct=[.28,.4,.54,.7,.86,1,1.08,1.14,1.2,1.24];function $(t,e,o,r){const n=e[e.length-1];for(const s of e){const d=t[s];if(d&&N(d,o)>=r)return s}return n}function _t(t){const e=t.l-lt[5],o=t.c>.02?.02:0;return vt.reduce((r,n,s)=>{const d=_(lt[s]+e),h=Math.min(.4,Math.max(o,t.c*Ct[s]));return r[n]=Y(X(d,h,t.h)),r},{})}function Rt(t,e){const o=[100,200,300,400,500,600,700],r=$(e,o,W,gt),n=o.indexOf(r),s=o[Math.min(n+1,o.length-1)],d=o[Math.min(n+2,o.length-1)],h=[1e3,900,800,700,600,500],R=$(e,h,J,gt),u=h.indexOf(R),g=h[Math.min(u+1,h.length-1)],p=h[Math.min(u+2,h.length-1)],T=$(e,[200,300,400,500,600,700,800],W,ht),A=$(e,[900,800,700,600,500,400],J,ht),m=[600,700,800,900,1e3],M=$(e,m,W,ft),w=m.indexOf(M),x=m[Math.min(w+1,m.length-1)],z=m[Math.min(w+2,m.length-1)],O=[400,300,200,100],G=$(e,O,J,ft),dt=O.indexOf(G),wt=O[Math.min(dt+1,O.length-1)],Et=O[Math.min(dt+2,O.length-1)],l={"--color-brand-surface-soft-light":e[r],"--color-brand-surface-soft-hovered-light":e[s],"--color-brand-surface-soft-pressed-light":e[d],"--color-brand-surface-soft-dark":e[R],"--color-brand-surface-soft-hovered-dark":e[g],"--color-brand-surface-soft-pressed-dark":e[p],"--color-brand-surface-subtle-light":e[T],"--color-brand-surface-subtle-dark":e[A],"--color-brand-surface-strong-light":e[M],"--color-brand-surface-strong-hovered-light":e[x],"--color-brand-surface-strong-pressed-light":e[z],"--color-brand-surface-strong-dark":e[G],"--color-brand-surface-strong-hovered-dark":e[wt],"--color-brand-surface-strong-pressed-dark":e[Et]},ut=e[600],At=N(l["--color-brand-surface-soft-light"],ut);return l["--color-brand-on-soft-light"]=At>=B?ut:U(t,l["--color-brand-surface-soft-light"],{minContrast:B}),l["--color-brand-on-soft-dark"]=U(t,l["--color-brand-surface-soft-dark"],{minContrast:B}),l["--color-brand-on-subtle-light"]=U(t,l["--color-brand-surface-subtle-light"],{minContrast:j,preferredCandidate:"light",preferredMinContrast:j,preferredSwitchDelta:mt}),l["--color-brand-on-subtle-dark"]=U(t,l["--color-brand-surface-subtle-dark"],{minContrast:B}),l["--color-brand-on-strong-light"]=U(t,l["--color-brand-surface-strong-light"],{minContrast:j,preferredCandidate:"light",preferredMinContrast:j,preferredSwitchDelta:mt}),l["--color-brand-on-strong-dark"]=U(t,l["--color-brand-surface-strong-dark"],{minContrast:B}),l["--color-brand-text-light"]=l["--color-brand-surface-strong-light"],l["--color-brand-text-dark"]=l["--color-brand-surface-strong-dark"],l["--color-brand-icon-light"]=l["--color-brand-surface-strong-light"],l["--color-brand-icon-dark"]=l["--color-brand-surface-strong-dark"],l["--color-brand-border-light"]=l["--color-brand-surface-strong-light"],l["--color-brand-border-dark"]=l["--color-brand-surface-strong-dark"],l}function Tt(t){const e=rt(t);if(!e)return null;const o=at(e);if(!o)return null;const r=kt(o),n=_t(r);return n[600]=e,{"--color-brand-seed":e,"--color-brand-100":n[100],"--color-brand-200":n[200],"--color-brand-300":n[300],"--color-brand-400":n[400],"--color-brand-500":n[500],"--color-brand-600":n[600],"--color-brand-700":n[700],"--color-brand-800":n[800],"--color-brand-900":n[900],"--color-brand-1000":n[1e3],...Rt(r,n)}}const it=a.computed(()=>Tt(i.accentColor)??{}),V={vars:{},enabled:!!i.exposeGlobalAccent};return b.push(V),a.watch(()=>i.exposeGlobalAccent,t=>{V.enabled=!!t,D()},{immediate:!0}),a.watch(it,t=>{t&&Object.keys(t).length>0?V.vars={...t}:V.vars={},D()},{immediate:!0}),(t,e)=>(a.openBlock(),a.createElementBlock("div",{class:"theme",style:a.normalizeStyle(it.value)},[a.renderSlot(t.$slots,"default"),a.createElementVNode("div",{ref_key:"portalHost",ref:C,class:"theme__portal-host"},null,512)],4))}}),Ht=(c,i)=>{const b=c.__vccOpts||c;for(const[f,D]of i)b[f]=D;return b},Vt={__name:"ThemeSwitcher",props:{mode:{type:String,default:"auto",validator:c=>["auto","light","dark"].includes(c)}},emits:["update:mode"],setup(c,{emit:i}){const f=[{value:"auto",label:"System"},{value:"light",label:"Light"},{value:"dark",label:"Dark"}].reduce((C,v)=>(C[v.value]=v.label,C),{}),D=K,y=c,q=i;pt();const L=a.ref(!1),H=Z()??y.mode,k=a.ref(D.includes(H)?H:"auto");return a.computed(()=>f[k.value]??f.auto),a.watch(()=>y.mode,C=>{D.includes(C)&&C!==k.value&&(k.value=C)}),a.watch(k,C=>{if(!D.includes(C)){k.value="auto";return}L.value=!1,q("update:mode",C),It(C)},{immediate:!0}),(C,v)=>(a.openBlock(),a.createBlock(a.unref(F.DropdownMenu),{open:L.value,"onUpdate:open":v[3]||(v[3]=I=>L.value=I),text:"Theme","aria-label":"Select theme mode"},{default:a.withCtx(()=>[a.createVNode(a.unref(F.DropdownItemGroup),{title:"Theme"},{default:a.withCtx(()=>[a.createVNode(a.unref(F.DropdownItemRadio),{checked:k.value,"onUpdate:checked":v[0]||(v[0]=I=>k.value=I),value:"auto",label:a.unref(f).auto,"aria-label":`${a.unref(f).auto} mode`},null,8,["checked","label","aria-label"]),v[4]||(v[4]=a.createElementVNode("hr",{class:"theme-switcher-divider",role:"separator"},null,-1)),a.createVNode(a.unref(F.DropdownItemRadio),{checked:k.value,"onUpdate:checked":v[1]||(v[1]=I=>k.value=I),value:"light",label:a.unref(f).light,"aria-label":`${a.unref(f).light} mode`},null,8,["checked","label","aria-label"]),a.createVNode(a.unref(F.DropdownItemRadio),{checked:k.value,"onUpdate:checked":v[2]||(v[2]=I=>k.value=I),value:"dark",label:a.unref(f).dark,"aria-label":`${a.unref(f).dark} mode`},null,8,["checked","label","aria-label"])]),_:1})]),_:1},8,["open"]))}},Ft=Ht(Vt,[["__scopeId","data-v-bcbc87cb"]]);exports.Theme=$t;exports.ThemeSwitcher=Ft;exports.themePortalHostKey=tt;exports.useThemePortalTarget=xt;
2
2
  //# sourceMappingURL=theme.cjs.js.map
package/dist/theme.cjs.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme.cjs.js","sources":["../src/modeStorage.js","../src/portalHost.js","../src/Theme.vue","../src/ThemeSwitcher.vue"],"sourcesContent":["const VALID_THEME_MODES = [\"auto\", \"light\", \"dark\"];\nconst STORAGE_KEY = \"gospore-theme-mode\";\nconst ONE_YEAR_IN_SECONDS = 60 * 60 * 24 * 365;\nconst DARK_MODE_QUERY = \"(prefers-color-scheme: dark)\";\n\nexport function readStoredMode() {\n if (typeof document === \"undefined\") {\n return null;\n }\n const stored = getCookie(STORAGE_KEY);\n return stored && VALID_THEME_MODES.includes(stored) ? stored : null;\n}\n\nexport function writeStoredMode(mode) {\n if (typeof document === \"undefined\" || !VALID_THEME_MODES.includes(mode)) {\n return;\n }\n const hostname =\n typeof window !== \"undefined\" ? window.location.hostname : \"\";\n const protocol =\n typeof window !== \"undefined\" ? window.location.protocol : \"\";\n const domain = getCookieDomain(hostname);\n const secure = protocol === \"https:\";\n const attributes = [\n \"path=/\",\n `max-age=${ONE_YEAR_IN_SECONDS}`,\n \"SameSite=Lax\",\n ];\n if (domain) {\n attributes.push(`domain=${domain}`);\n }\n if (secure) {\n attributes.push(\"Secure\");\n }\n document.cookie = [\n `${encodeURIComponent(STORAGE_KEY)}=${encodeURIComponent(mode)}`,\n ...attributes,\n ].join(\"; \");\n}\n\nexport function applyStoredModeToDocument(mode) {\n if (typeof document === \"undefined\") {\n return;\n }\n const resolvedMode =\n typeof mode === \"string\" && VALID_THEME_MODES.includes(mode)\n ? mode\n : (readStoredMode() ?? \"auto\");\n console.log(\"Applying theme mode:\", resolvedMode);\n const darkMode = resolveDarkMode(resolvedMode);\n document.documentElement.setAttribute(\"dark-mode\", darkMode);\n}\n\nexport { VALID_THEME_MODES, STORAGE_KEY };\n\nfunction getCookie(name) {\n if (typeof document === \"undefined\" || !document.cookie) {\n return null;\n }\n const encodedName = `${encodeURIComponent(name)}=`;\n const cookies = document.cookie.split(\"; \");\n for (const cookie of cookies) {\n if (cookie.startsWith(encodedName)) {\n return decodeURIComponent(cookie.slice(encodedName.length));\n }\n }\n return null;\n}\n\nfunction getCookieDomain(hostname) {\n if (!hostname || hostname === \"localhost\") {\n return null;\n }\n const isIpAddress = /^\\d+(?:\\.\\d+){3}$/.test(hostname);\n if (isIpAddress) {\n return hostname;\n }\n const parts = hostname.split(\".\");\n if (parts.length <= 1) {\n return null;\n }\n if (parts.length === 2) {\n return hostname;\n }\n return parts.slice(-2).join(\".\");\n}\n\nfunction resolveDarkMode(mode) {\n if (mode === \"dark\") {\n return true;\n }\n if (mode === \"light\") {\n return false;\n }\n if (typeof window === \"undefined\") {\n return false;\n }\n try {\n const mediaQueryList =\n typeof window.matchMedia === \"function\"\n ? window.matchMedia(DARK_MODE_QUERY)\n : null;\n return mediaQueryList ? mediaQueryList.matches : false;\n } catch (error) {\n return false;\n }\n}\n","import { computed, inject } from \"vue\";\n\nexport const themePortalHostKey = Symbol.for(\"gospore.theme.portalHost\");\n\nexport function useThemePortalTarget() {\n const hostRef = inject(themePortalHostKey, null);\n console.log(\"Using theme portal host:\", hostRef);\n const fallbackTarget =\n typeof document !== \"undefined\" ? document.body : \"body\";\n\n return computed(() => hostRef?.value ?? fallbackTarget);\n}\n","<template>\n <div class=\"theme\" :style=\"brandStyle\">\n <slot />\n <div ref=\"portalHost\" class=\"theme__portal-host\"></div>\n </div>\n</template>\n\n<script setup>\nimport { provide, ref, watch, onBeforeUnmount, computed } from \"vue\";\nimport { applyStoredModeToDocument, readStoredMode } from \"./modeStorage\";\nimport \"what-input\";\nimport { themePortalHostKey } from \"./portalHost\";\n\ndefineOptions({\n name: \"Theme\",\n});\nconst props = defineProps({\n mode: {\n type: String,\n validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n },\n /**\n * Optional hex accent color (\"#RRGGBB\" or \"#RGB\"). When provided,\n * Theme derives the `--color-brand-*` palette and exposes the tokens on\n * the root .theme element (and the global document for portals).\n */\n accentColor: {\n type: String,\n required: false,\n default: undefined,\n },\n /**\n * When true the brand vars are also exposed on <html>, allowing portals\n * attached outside the Theme subtree to inherit the accent colors.\n */\n exposeGlobalAccent: {\n type: Boolean,\n default: false,\n },\n});\n\nconst globalAccentStack = [];\nconst appliedGlobalAccentKeys = new Set();\n\nfunction applyGlobalAccentFromStack() {\n const root = document.documentElement;\n if (!root) {\n return;\n }\n\n appliedGlobalAccentKeys.forEach((key) => {\n root.style.removeProperty(key);\n });\n appliedGlobalAccentKeys.clear();\n\n const activeEntry = [...globalAccentStack]\n .reverse()\n .find(\n (entry) =>\n entry.enabled &&\n entry.vars &&\n Object.keys(entry.vars).length > 0,\n );\n\n if (!activeEntry) {\n return;\n }\n\n Object.entries(activeEntry.vars).forEach(([key, value]) => {\n root.style.setProperty(key, value);\n appliedGlobalAccentKeys.add(key);\n });\n}\n\nconst DARK_MODE_QUERY = \"(prefers-color-scheme: dark)\";\nconst PREFERS_REDUCED_MOTION_QUERY = \"(prefers-reduced-motion: reduce)\";\nconst THEME_TRANSITION_DURATION = 200;\nconst darkModeMedia = window.matchMedia(DARK_MODE_QUERY);\nconst prefersReducedMotionMedia = window.matchMedia(\n PREFERS_REDUCED_MOTION_QUERY,\n);\n\nconst initialMode = getEffectiveMode();\napplyStoredModeToDocument(initialMode);\n\nconst currentMode = ref(initialMode);\n\nconst theme = ref({\n darkMode: resolveDarkMode(initialMode),\n});\nconst portalHost = ref(null);\n\ndarkModeMedia.addEventListener(\"change\", handleSystemPreferenceChange);\n\nwatch(\n () => props.mode,\n () => {\n syncDarkMode();\n },\n { immediate: true },\n);\n\nwatch(\n () => theme.value.darkMode,\n (darkMode, previousValue) => {\n if (previousValue === undefined) {\n setDocumentDarkModeAttribute(darkMode);\n return;\n }\n withThemeTransition(() => {\n setDocumentDarkModeAttribute(darkMode);\n });\n },\n { immediate: true },\n);\n\nonBeforeUnmount(() => {\n darkModeMedia.removeEventListener(\"change\", handleSystemPreferenceChange);\n const index = globalAccentStack.indexOf(accentStackEntry);\n if (index !== -1) {\n globalAccentStack.splice(index, 1);\n }\n applyGlobalAccentFromStack();\n});\n\nfunction syncDarkMode() {\n const mode = getEffectiveMode();\n currentMode.value = mode;\n theme.value.darkMode = resolveDarkMode(mode);\n}\n\nfunction resolveDarkMode(mode) {\n if (mode === \"dark\") {\n return true;\n }\n if (mode === \"light\") {\n return false;\n }\n return darkModeMedia.matches;\n}\n\nfunction handleSystemPreferenceChange(event) {\n if (!event || currentMode.value !== \"auto\") {\n return;\n }\n theme.value.darkMode = event.matches;\n}\n\nfunction setDocumentDarkModeAttribute(darkMode) {\n document.documentElement.setAttribute(\"dark-mode\", darkMode);\n}\n\nfunction withThemeTransition(applyTheme) {\n if (prefersReducedMotionMedia.matches) {\n applyTheme();\n return;\n }\n const startViewTransition = document.startViewTransition?.bind(document);\n if (startViewTransition) {\n startViewTransition(() => {\n applyTheme();\n });\n return;\n }\n applyTheme();\n const element = document.documentElement;\n if (typeof element.animate !== \"function\") {\n return;\n }\n window.requestAnimationFrame(() => {\n element.animate([{ opacity: 0.85 }, { opacity: 1 }], {\n duration: THEME_TRANSITION_DURATION,\n easing: \"ease-in-out\",\n });\n });\n}\n\nfunction getEffectiveMode() {\n return props.mode ?? readStoredMode() ?? \"auto\";\n}\n\nprovide(\"theme\", theme);\nprovide(themePortalHostKey, portalHost);\n\n// --- Accent helpers -------------------------------------------------------\nfunction normalizeHex(hex) {\n if (!hex) return null;\n const h = hex.trim().toLowerCase();\n const m = /^#(?:[0-9a-f]{3}|[0-9a-f]{6})$/i.exec(h);\n if (!m) return null;\n if (h.length === 4) {\n // expand #rgb -> #rrggbb\n const r = h[1],\n g = h[2],\n b = h[3];\n return `#${r}${r}${g}${g}${b}${b}`;\n }\n return h;\n}\n\nfunction hexToRgb(hex) {\n const h = normalizeHex(hex);\n if (!h) return null;\n const r = parseInt(h.slice(1, 3), 16);\n const g = parseInt(h.slice(3, 5), 16);\n const b = parseInt(h.slice(5, 7), 16);\n return { r, g, b };\n}\n\nfunction rgbToHex({ r, g, b }) {\n const toHex = (value) => value.toString(16).padStart(2, \"0\");\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nfunction clamp01(value) {\n return Math.max(0, Math.min(1, value));\n}\n\nfunction srgbChannelToLinear(channel) {\n if (channel <= 0.04045) {\n return channel / 12.92;\n }\n return Math.pow((channel + 0.055) / 1.055, 2.4);\n}\n\nfunction linearChannelToSrgb(channel) {\n const normalized = clamp01(channel);\n if (normalized <= 0.0031308) {\n return 12.92 * normalized;\n }\n return 1.055 * Math.pow(normalized, 1 / 2.4) - 0.055;\n}\n\nfunction rgbToOklch({ r, g, b }) {\n const rNorm = r / 255;\n const gNorm = g / 255;\n const bNorm = b / 255;\n\n const rLin = srgbChannelToLinear(rNorm);\n const gLin = srgbChannelToLinear(gNorm);\n const bLin = srgbChannelToLinear(bNorm);\n\n const l = 0.4122214708 * rLin + 0.5363325363 * gLin + 0.0514459929 * bLin;\n const m = 0.2119034982 * rLin + 0.6806995451 * gLin + 0.1073969566 * bLin;\n const s = 0.0883024619 * rLin + 0.2817188376 * gLin + 0.6299787005 * bLin;\n\n const lRoot = Math.cbrt(l);\n const mRoot = Math.cbrt(m);\n const sRoot = Math.cbrt(s);\n\n const oklabL =\n 0.2104542553 * lRoot + 0.793617785 * mRoot - 0.0040720468 * sRoot;\n const oklabA =\n 1.9779984951 * lRoot - 2.428592205 * mRoot + 0.4505937099 * sRoot;\n const oklabB =\n 0.0259040371 * lRoot + 0.7827717662 * mRoot - 0.808675766 * sRoot;\n\n const chroma = Math.sqrt(oklabA * oklabA + oklabB * oklabB);\n let hue = Math.atan2(oklabB, oklabA) * (180 / Math.PI);\n if (hue < 0) {\n hue += 360;\n }\n\n return { l: oklabL, c: chroma, h: hue };\n}\n\nfunction tryOklchToSrgb(l, c, h, clampLinear = false) {\n const angle = (h * Math.PI) / 180;\n const a = c * Math.cos(angle);\n const b = c * Math.sin(angle);\n\n const lComponent = l + 0.3963377774 * a + 0.2158037573 * b;\n const mComponent = l - 0.1055613458 * a - 0.0638541728 * b;\n const sComponent = l - 0.0894841775 * a - 1.291485548 * b;\n\n const lCube = clampLinear ? clamp01(lComponent) : lComponent;\n const mCube = clampLinear ? clamp01(mComponent) : mComponent;\n const sCube = clampLinear ? clamp01(sComponent) : sComponent;\n\n if (!clampLinear) {\n const outOfRange =\n lCube < -0.0001 ||\n lCube > 1.0001 ||\n mCube < -0.0001 ||\n mCube > 1.0001 ||\n sCube < -0.0001 ||\n sCube > 1.0001;\n if (outOfRange) {\n return null;\n }\n }\n\n const lLin = lCube * lCube * lCube;\n const mLin = mCube * mCube * mCube;\n const sLin = sCube * sCube * sCube;\n\n let rLin = 4.0767416621 * lLin - 3.3077115913 * mLin + 0.2309699292 * sLin;\n let gLin = -1.2684380046 * lLin + 2.6097574011 * mLin - 0.3413193965 * sLin;\n let bLin = -0.0041960863 * lLin - 0.7034186147 * mLin + 1.707614701 * sLin;\n\n if (clampLinear) {\n rLin = clamp01(rLin);\n gLin = clamp01(gLin);\n bLin = clamp01(bLin);\n } else {\n const outOfRange =\n rLin < -0.0001 ||\n rLin > 1.0001 ||\n gLin < -0.0001 ||\n gLin > 1.0001 ||\n bLin < -0.0001 ||\n bLin > 1.0001;\n if (outOfRange) {\n return null;\n }\n }\n\n const r = clamp01(linearChannelToSrgb(rLin));\n const g = clamp01(linearChannelToSrgb(gLin));\n const bValue = clamp01(linearChannelToSrgb(bLin));\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(bValue * 255),\n };\n}\n\nfunction oklchToSrgb(l, c, h) {\n let chroma = c;\n for (let attempt = 0; attempt < 8; attempt += 1) {\n const rgb = tryOklchToSrgb(l, chroma, h);\n if (rgb) {\n return rgb;\n }\n chroma *= 0.9;\n }\n return tryOklchToSrgb(l, clamp01(chroma), h, true) || { r: 0, g: 0, b: 0 };\n}\n\nfunction makeBrandScale(baseHex) {\n const norm = normalizeHex(baseHex);\n if (!norm) return null;\n const baseRgb = hexToRgb(norm);\n if (!baseRgb) return null;\n const baseOklch = rgbToOklch(baseRgb);\n const toneConfig = {\n 100: { lightness: 0.35, chroma: 0.45 },\n 200: { lightness: 0.28, chroma: 0.5 },\n 300: { lightness: 0.22, chroma: 0.6 },\n 400: { lightness: 0.16, chroma: 0.75 },\n 500: { lightness: 0.08, chroma: 0.9 },\n 600: { lightness: 0, chroma: 1, base: true },\n 700: { lightness: -0.08, chroma: 1.05 },\n 800: { lightness: -0.18, chroma: 1.1 },\n 900: { lightness: -0.28, chroma: 1.15 },\n 1000: { lightness: -0.35, chroma: 1.2 },\n };\n const tokens = {};\n\n const adjustLightness = (lightnessValue) => {\n if (lightnessValue === 0) {\n return baseOklch.l;\n }\n if (lightnessValue > 0) {\n return clamp01(baseOklch.l + lightnessValue * (1 - baseOklch.l));\n }\n return clamp01(baseOklch.l * (1 + lightnessValue));\n };\n\n const adjustChroma = (chromaScale) => {\n if (chromaScale === 1) {\n return baseOklch.c;\n }\n const scaled = baseOklch.c * chromaScale;\n return Math.max(0, Math.min(0.4, scaled));\n };\n\n Object.entries(toneConfig).forEach(([stop, config]) => {\n const tokenName = `--color-brand-${stop}`;\n if (config.base) {\n tokens[tokenName] = norm;\n return;\n }\n const toneL = adjustLightness(config.lightness);\n const toneC = adjustChroma(config.chroma);\n const toneRgb = oklchToSrgb(toneL, toneC, baseOklch.h);\n tokens[tokenName] = rgbToHex(toneRgb);\n });\n return tokens;\n}\n\nconst brandVars = computed(() => makeBrandScale(props.accentColor) ?? {});\nconst brandStyle = computed(() => brandVars.value);\n\nconst accentStackEntry = {\n vars: {},\n enabled: Boolean(props.exposeGlobalAccent),\n};\nglobalAccentStack.push(accentStackEntry);\n\nwatch(\n () => props.exposeGlobalAccent,\n (enabled) => {\n accentStackEntry.enabled = Boolean(enabled);\n applyGlobalAccentFromStack();\n },\n { immediate: true },\n);\n\nwatch(\n brandVars,\n (vars) => {\n if (vars && Object.keys(vars).length > 0) {\n accentStackEntry.vars = { ...vars };\n } else {\n accentStackEntry.vars = {};\n }\n applyGlobalAccentFromStack();\n },\n { immediate: true },\n);\n</script>\n\n<style lang=\"less\">\n@import \"index.less\";\n</style>\n","<template>\n <DropdownMenu\n v-model:open=\"open\"\n text=\"Theme\"\n aria-label=\"Select theme mode\"\n >\n <DropdownItemGroup title=\"Theme\">\n <DropdownItemRadio\n v-model:checked=\"internalMode\"\n value=\"auto\"\n :label=\"MODE_LABELS.auto\"\n :aria-label=\"`${MODE_LABELS.auto} mode`\"\n />\n <hr class=\"theme-switcher-divider\" role=\"separator\" />\n <DropdownItemRadio\n v-model:checked=\"internalMode\"\n value=\"light\"\n :label=\"MODE_LABELS.light\"\n :aria-label=\"`${MODE_LABELS.light} mode`\"\n />\n <DropdownItemRadio\n v-model:checked=\"internalMode\"\n value=\"dark\"\n :label=\"MODE_LABELS.dark\"\n :aria-label=\"`${MODE_LABELS.dark} mode`\"\n />\n </DropdownItemGroup>\n </DropdownMenu>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from \"vue\";\nimport {\n DropdownMenu,\n DropdownItemGroup,\n DropdownItemRadio,\n} from \"@gospore/dropdown-menu\";\nimport {\n readStoredMode,\n writeStoredMode,\n VALID_THEME_MODES,\n applyStoredModeToDocument,\n} from \"./modeStorage\";\n\nconst MODE_OPTIONS = [\n { value: \"auto\", label: \"System\" },\n { value: \"light\", label: \"Light\" },\n { value: \"dark\", label: \"Dark\" },\n];\nconst MODE_LABELS = MODE_OPTIONS.reduce((map, option) => {\n map[option.value] = option.label;\n return map;\n}, {});\nconst VALID_MODES = VALID_THEME_MODES;\n\nconst props = defineProps({\n mode: {\n type: String,\n default: \"auto\",\n validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n },\n});\nconst emit = defineEmits([\"update:mode\"]);\n\napplyStoredModeToDocument();\n\nconst open = ref(false);\nconst initialMode = readStoredMode() ?? props.mode;\nconst internalMode = ref(\n VALID_MODES.includes(initialMode) ? initialMode : \"auto\",\n);\nconst label = computed(\n () => MODE_LABELS[internalMode.value] ?? MODE_LABELS.auto,\n);\n\nwatch(\n () => props.mode,\n (mode) => {\n if (VALID_MODES.includes(mode) && mode !== internalMode.value) {\n internalMode.value = mode;\n }\n },\n);\n\nwatch(\n internalMode,\n (mode) => {\n if (!VALID_MODES.includes(mode)) {\n internalMode.value = \"auto\";\n return;\n }\n open.value = false;\n emit(\"update:mode\", mode);\n writeStoredMode(mode);\n },\n { immediate: true },\n);\n</script>\n\n<style scoped lang=\"less\">\n.theme-switcher-divider {\n margin: 4px 0;\n}\n</style>\n"],"names":["VALID_THEME_MODES","STORAGE_KEY","ONE_YEAR_IN_SECONDS","DARK_MODE_QUERY","readStoredMode","stored","getCookie","writeStoredMode","mode","hostname","protocol","domain","getCookieDomain","secure","attributes","applyStoredModeToDocument","resolvedMode","darkMode","resolveDarkMode","name","encodedName","cookies","cookie","parts","mediaQueryList","themePortalHostKey","useThemePortalTarget","hostRef","inject","fallbackTarget","computed","props","__props","globalAccentStack","appliedGlobalAccentKeys","applyGlobalAccentFromStack","root","key","activeEntry","entry","value","darkModeMedia","prefersReducedMotionMedia","PREFERS_REDUCED_MOTION_QUERY","initialMode","getEffectiveMode","currentMode","ref","theme","portalHost","handleSystemPreferenceChange","watch","syncDarkMode","previousValue","setDocumentDarkModeAttribute","withThemeTransition","onBeforeUnmount","index","accentStackEntry","event","applyTheme","startViewTransition","element","THEME_TRANSITION_DURATION","provide","normalizeHex","hex","h","g","b","hexToRgb","r","rgbToHex","toHex","clamp01","srgbChannelToLinear","channel","linearChannelToSrgb","normalized","rgbToOklch","rNorm","gNorm","bNorm","rLin","gLin","bLin","l","m","s","lRoot","mRoot","sRoot","oklabL","oklabA","oklabB","chroma","hue","tryOklchToSrgb","c","clampLinear","angle","a","lComponent","mComponent","sComponent","lCube","mCube","sCube","lLin","mLin","sLin","bValue","oklchToSrgb","attempt","rgb","makeBrandScale","baseHex","norm","baseRgb","baseOklch","toneConfig","tokens","adjustLightness","lightnessValue","adjustChroma","chromaScale","scaled","stop","config","tokenName","toneL","toneC","toneRgb","brandVars","brandStyle","enabled","vars","_createElementBlock","_renderSlot","_ctx","_createElementVNode","MODE_LABELS","map","option","VALID_MODES","emit","__emit","open","internalMode","_createBlock","_unref","DropdownMenu","$event","_createVNode","DropdownItemGroup","DropdownItemRadio"],"mappings":"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"}
1
+ {"version":3,"file":"theme.cjs.js","sources":["../src/modeStorage.js","../src/portalHost.js","../src/Theme.vue","../src/ThemeSwitcher.vue"],"sourcesContent":["const VALID_THEME_MODES = [\"auto\", \"light\", \"dark\"];\nconst STORAGE_KEY = \"gospore-theme-mode\";\nconst ONE_YEAR_IN_SECONDS = 60 * 60 * 24 * 365;\nconst DARK_MODE_QUERY = \"(prefers-color-scheme: dark)\";\n\nexport function readStoredMode() {\n if (typeof document === \"undefined\") {\n return null;\n }\n const stored = getCookie(STORAGE_KEY);\n return stored && VALID_THEME_MODES.includes(stored) ? stored : null;\n}\n\nexport function writeStoredMode(mode) {\n if (typeof document === \"undefined\" || !VALID_THEME_MODES.includes(mode)) {\n return;\n }\n const hostname =\n typeof window !== \"undefined\" ? window.location.hostname : \"\";\n const protocol =\n typeof window !== \"undefined\" ? window.location.protocol : \"\";\n const domain = getCookieDomain(hostname);\n const secure = protocol === \"https:\";\n const attributes = [\n \"path=/\",\n `max-age=${ONE_YEAR_IN_SECONDS}`,\n \"SameSite=Lax\",\n ];\n if (domain) {\n attributes.push(`domain=${domain}`);\n }\n if (secure) {\n attributes.push(\"Secure\");\n }\n document.cookie = [\n `${encodeURIComponent(STORAGE_KEY)}=${encodeURIComponent(mode)}`,\n ...attributes,\n ].join(\"; \");\n}\n\nexport function applyStoredModeToDocument(mode) {\n if (typeof document === \"undefined\") {\n return;\n }\n const resolvedMode =\n typeof mode === \"string\" && VALID_THEME_MODES.includes(mode)\n ? mode\n : (readStoredMode() ?? \"auto\");\n console.log(\"Applying theme mode:\", resolvedMode);\n const darkMode = resolveDarkMode(resolvedMode);\n document.documentElement.setAttribute(\"dark-mode\", darkMode);\n}\n\nexport { VALID_THEME_MODES, STORAGE_KEY };\n\nfunction getCookie(name) {\n if (typeof document === \"undefined\" || !document.cookie) {\n return null;\n }\n const encodedName = `${encodeURIComponent(name)}=`;\n const cookies = document.cookie.split(\"; \");\n for (const cookie of cookies) {\n if (cookie.startsWith(encodedName)) {\n return decodeURIComponent(cookie.slice(encodedName.length));\n }\n }\n return null;\n}\n\nfunction getCookieDomain(hostname) {\n if (!hostname || hostname === \"localhost\") {\n return null;\n }\n const isIpAddress = /^\\d+(?:\\.\\d+){3}$/.test(hostname);\n if (isIpAddress) {\n return hostname;\n }\n const parts = hostname.split(\".\");\n if (parts.length <= 1) {\n return null;\n }\n if (parts.length === 2) {\n return hostname;\n }\n return parts.slice(-2).join(\".\");\n}\n\nfunction resolveDarkMode(mode) {\n if (mode === \"dark\") {\n return true;\n }\n if (mode === \"light\") {\n return false;\n }\n if (typeof window === \"undefined\") {\n return false;\n }\n try {\n const mediaQueryList =\n typeof window.matchMedia === \"function\"\n ? window.matchMedia(DARK_MODE_QUERY)\n : null;\n return mediaQueryList ? mediaQueryList.matches : false;\n } catch (error) {\n return false;\n }\n}\n","import { computed, inject } from \"vue\";\n\nexport const themePortalHostKey = Symbol.for(\"gospore.theme.portalHost\");\n\nexport function useThemePortalTarget() {\n const hostRef = inject(themePortalHostKey, null);\n console.log(\"Using theme portal host:\", hostRef);\n const fallbackTarget =\n typeof document !== \"undefined\" ? document.body : \"body\";\n\n return computed(() => hostRef?.value ?? fallbackTarget);\n}\n","<template>\n <div class=\"theme\" :style=\"brandVars\">\n <slot />\n <div ref=\"portalHost\" class=\"theme__portal-host\"></div>\n </div>\n</template>\n\n<script setup>\nimport { provide, ref, watch, onBeforeUnmount, computed } from \"vue\";\nimport { applyStoredModeToDocument, readStoredMode } from \"./modeStorage\";\nimport \"what-input\";\nimport { themePortalHostKey } from \"./portalHost\";\n\ndefineOptions({\n name: \"Theme\",\n});\nconst props = defineProps({\n mode: {\n type: String,\n validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n },\n /**\n * Optional hex accent color (\"#RRGGBB\" or \"#RGB\"). When provided,\n * Theme derives contrast-safe semantic brand tokens and exposes them on\n * the root .theme element (and the global document for portals).\n */\n accentColor: {\n type: String,\n required: false,\n default: undefined,\n },\n /**\n * When true the brand vars are also exposed on <html>, allowing portals\n * attached outside the Theme subtree to inherit the accent colors.\n */\n exposeGlobalAccent: {\n type: Boolean,\n default: false,\n },\n});\n\nconst globalAccentStack = [];\nconst appliedGlobalAccentKeys = new Set();\n\nfunction applyGlobalAccentFromStack() {\n const root = document.documentElement;\n if (!root) {\n return;\n }\n\n appliedGlobalAccentKeys.forEach((key) => {\n root.style.removeProperty(key);\n });\n appliedGlobalAccentKeys.clear();\n\n const activeEntry = [...globalAccentStack]\n .reverse()\n .find(\n (entry) =>\n entry.enabled &&\n entry.vars &&\n Object.keys(entry.vars).length > 0,\n );\n\n if (!activeEntry) {\n return;\n }\n\n Object.entries(activeEntry.vars).forEach(([key, value]) => {\n root.style.setProperty(key, value);\n appliedGlobalAccentKeys.add(key);\n });\n}\n\nconst DARK_MODE_QUERY = \"(prefers-color-scheme: dark)\";\nconst PREFERS_REDUCED_MOTION_QUERY = \"(prefers-reduced-motion: reduce)\";\nconst THEME_TRANSITION_DURATION = 200;\nconst darkModeMedia = window.matchMedia(DARK_MODE_QUERY);\nconst prefersReducedMotionMedia = window.matchMedia(\n PREFERS_REDUCED_MOTION_QUERY,\n);\n\nconst initialMode = getEffectiveMode();\napplyStoredModeToDocument(initialMode);\n\nconst currentMode = ref(initialMode);\n\nconst theme = ref({\n darkMode: resolveDarkMode(initialMode),\n});\nconst portalHost = ref(null);\n\ndarkModeMedia.addEventListener(\"change\", handleSystemPreferenceChange);\n\nwatch(\n () => props.mode,\n () => {\n syncDarkMode();\n },\n { immediate: true },\n);\n\nwatch(\n () => theme.value.darkMode,\n (darkMode, previousValue) => {\n if (previousValue === undefined) {\n setDocumentDarkModeAttribute(darkMode);\n return;\n }\n withThemeTransition(() => {\n setDocumentDarkModeAttribute(darkMode);\n });\n },\n { immediate: true },\n);\n\nonBeforeUnmount(() => {\n darkModeMedia.removeEventListener(\"change\", handleSystemPreferenceChange);\n const index = globalAccentStack.indexOf(accentStackEntry);\n if (index !== -1) {\n globalAccentStack.splice(index, 1);\n }\n applyGlobalAccentFromStack();\n});\n\nfunction syncDarkMode() {\n const mode = getEffectiveMode();\n currentMode.value = mode;\n theme.value.darkMode = resolveDarkMode(mode);\n}\n\nfunction resolveDarkMode(mode) {\n if (mode === \"dark\") {\n return true;\n }\n if (mode === \"light\") {\n return false;\n }\n return darkModeMedia.matches;\n}\n\nfunction handleSystemPreferenceChange(event) {\n if (!event || currentMode.value !== \"auto\") {\n return;\n }\n theme.value.darkMode = event.matches;\n}\n\nfunction setDocumentDarkModeAttribute(darkMode) {\n document.documentElement.setAttribute(\"dark-mode\", darkMode);\n}\n\nfunction withThemeTransition(applyTheme) {\n if (prefersReducedMotionMedia.matches) {\n applyTheme();\n return;\n }\n const startViewTransition = document.startViewTransition?.bind(document);\n if (startViewTransition) {\n startViewTransition(() => {\n applyTheme();\n });\n return;\n }\n applyTheme();\n const element = document.documentElement;\n if (typeof element.animate !== \"function\") {\n return;\n }\n window.requestAnimationFrame(() => {\n element.animate([{ opacity: 0.85 }, { opacity: 1 }], {\n duration: THEME_TRANSITION_DURATION,\n easing: \"ease-in-out\",\n });\n });\n}\n\nfunction getEffectiveMode() {\n return props.mode ?? readStoredMode() ?? \"auto\";\n}\n\nprovide(\"theme\", theme);\nprovide(themePortalHostKey, portalHost);\n\n// --- Accent helpers -------------------------------------------------------\nconst BRAND_MIN_CONTRAST = 3.8;\n\nfunction normalizeHex(hex) {\n if (!hex) return null;\n const h = hex.trim().toLowerCase();\n const m = /^#(?:[0-9a-f]{3}|[0-9a-f]{6})$/i.exec(h);\n if (!m) return null;\n if (h.length === 4) {\n // expand #rgb -> #rrggbb\n const r = h[1],\n g = h[2],\n b = h[3];\n return `#${r}${r}${g}${g}${b}${b}`;\n }\n return h;\n}\n\nfunction hexToRgb(hex) {\n const h = normalizeHex(hex);\n if (!h) return null;\n const r = parseInt(h.slice(1, 3), 16);\n const g = parseInt(h.slice(3, 5), 16);\n const b = parseInt(h.slice(5, 7), 16);\n return { r, g, b };\n}\n\nfunction rgbToHex({ r, g, b }) {\n const toHex = (value) => value.toString(16).padStart(2, \"0\");\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nfunction clamp01(value) {\n return Math.max(0, Math.min(1, value));\n}\n\nfunction srgbChannelToLinear(channel) {\n if (channel <= 0.04045) {\n return channel / 12.92;\n }\n return Math.pow((channel + 0.055) / 1.055, 2.4);\n}\n\nfunction linearChannelToSrgb(channel) {\n const normalized = clamp01(channel);\n if (normalized <= 0.0031308) {\n return 12.92 * normalized;\n }\n return 1.055 * Math.pow(normalized, 1 / 2.4) - 0.055;\n}\n\nfunction rgbToOklch({ r, g, b }) {\n const rNorm = r / 255;\n const gNorm = g / 255;\n const bNorm = b / 255;\n\n const rLin = srgbChannelToLinear(rNorm);\n const gLin = srgbChannelToLinear(gNorm);\n const bLin = srgbChannelToLinear(bNorm);\n\n const l = 0.4122214708 * rLin + 0.5363325363 * gLin + 0.0514459929 * bLin;\n const m = 0.2119034982 * rLin + 0.6806995451 * gLin + 0.1073969566 * bLin;\n const s = 0.0883024619 * rLin + 0.2817188376 * gLin + 0.6299787005 * bLin;\n\n const lRoot = Math.cbrt(l);\n const mRoot = Math.cbrt(m);\n const sRoot = Math.cbrt(s);\n\n const oklabL =\n 0.2104542553 * lRoot + 0.793617785 * mRoot - 0.0040720468 * sRoot;\n const oklabA =\n 1.9779984951 * lRoot - 2.428592205 * mRoot + 0.4505937099 * sRoot;\n const oklabB =\n 0.0259040371 * lRoot + 0.7827717662 * mRoot - 0.808675766 * sRoot;\n\n const chroma = Math.sqrt(oklabA * oklabA + oklabB * oklabB);\n let hue = Math.atan2(oklabB, oklabA) * (180 / Math.PI);\n if (hue < 0) {\n hue += 360;\n }\n\n return { l: oklabL, c: chroma, h: hue };\n}\n\nfunction tryOklchToSrgb(l, c, h, clampLinear = false) {\n const angle = (h * Math.PI) / 180;\n const a = c * Math.cos(angle);\n const b = c * Math.sin(angle);\n\n const lComponent = l + 0.3963377774 * a + 0.2158037573 * b;\n const mComponent = l - 0.1055613458 * a - 0.0638541728 * b;\n const sComponent = l - 0.0894841775 * a - 1.291485548 * b;\n\n const lCube = clampLinear ? clamp01(lComponent) : lComponent;\n const mCube = clampLinear ? clamp01(mComponent) : mComponent;\n const sCube = clampLinear ? clamp01(sComponent) : sComponent;\n\n if (!clampLinear) {\n const outOfRange =\n lCube < -0.0001 ||\n lCube > 1.0001 ||\n mCube < -0.0001 ||\n mCube > 1.0001 ||\n sCube < -0.0001 ||\n sCube > 1.0001;\n if (outOfRange) {\n return null;\n }\n }\n\n const lLin = lCube * lCube * lCube;\n const mLin = mCube * mCube * mCube;\n const sLin = sCube * sCube * sCube;\n\n let rLin = 4.0767416621 * lLin - 3.3077115913 * mLin + 0.2309699292 * sLin;\n let gLin = -1.2684380046 * lLin + 2.6097574011 * mLin - 0.3413193965 * sLin;\n let bLin = -0.0041960863 * lLin - 0.7034186147 * mLin + 1.707614701 * sLin;\n\n if (clampLinear) {\n rLin = clamp01(rLin);\n gLin = clamp01(gLin);\n bLin = clamp01(bLin);\n } else {\n const outOfRange =\n rLin < -0.0001 ||\n rLin > 1.0001 ||\n gLin < -0.0001 ||\n gLin > 1.0001 ||\n bLin < -0.0001 ||\n bLin > 1.0001;\n if (outOfRange) {\n return null;\n }\n }\n\n const r = clamp01(linearChannelToSrgb(rLin));\n const g = clamp01(linearChannelToSrgb(gLin));\n const bValue = clamp01(linearChannelToSrgb(bLin));\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(bValue * 255),\n };\n}\n\nfunction oklchToSrgb(l, c, h) {\n let chroma = c;\n for (let attempt = 0; attempt < 8; attempt += 1) {\n const rgb = tryOklchToSrgb(l, chroma, h);\n if (rgb) {\n return rgb;\n }\n chroma *= 0.9;\n }\n return tryOklchToSrgb(l, clamp01(chroma), h, true) || { r: 0, g: 0, b: 0 };\n}\n\nfunction relativeLuminance(hex) {\n const rgb = hexToRgb(hex);\n if (!rgb) {\n return 0;\n }\n const r = srgbChannelToLinear(rgb.r / 255);\n const g = srgbChannelToLinear(rgb.g / 255);\n const b = srgbChannelToLinear(rgb.b / 255);\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n}\n\nfunction contrastRatio(hexA, hexB) {\n const lumA = relativeLuminance(hexA);\n const lumB = relativeLuminance(hexB);\n const lighter = Math.max(lumA, lumB);\n const darker = Math.min(lumA, lumB);\n return (lighter + 0.05) / (darker + 0.05);\n}\n\nfunction makeReadableTextOnSurface(baseOklch, surfaceHex, options = {}) {\n const minContrast = options.minContrast ?? BRAND_MIN_CONTRAST;\n const preferDark = options.preferDark !== false;\n const textChroma = Math.max(\n 0.01,\n Math.min(0.06, (baseOklch.c || 0.12) * (options.chromaScale ?? 0.25)),\n );\n const initialLightness =\n options.initialLightness ?? (preferDark ? 0.24 : 0.94);\n const direction = preferDark ? -1 : 1;\n const step = options.step ?? 0.03;\n let lightness = clamp01(initialLightness);\n let bestHex = rgbToHex(oklchToSrgb(lightness, textChroma, baseOklch.h));\n let bestContrast = contrastRatio(surfaceHex, bestHex);\n\n for (let attempt = 0; attempt < 48; attempt += 1) {\n const textHex = rgbToHex(\n oklchToSrgb(lightness, textChroma, baseOklch.h),\n );\n const ratio = contrastRatio(surfaceHex, textHex);\n\n if (ratio > bestContrast) {\n bestContrast = ratio;\n bestHex = textHex;\n }\n if (ratio >= minContrast) {\n return textHex;\n }\n\n lightness = clamp01(lightness + direction * step);\n if (lightness === 0 || lightness === 1) {\n break;\n }\n }\n\n const fallbackDark = \"#101214\";\n const fallbackLight = \"#ffffff\";\n const darkRatio = contrastRatio(surfaceHex, fallbackDark);\n const lightRatio = contrastRatio(surfaceHex, fallbackLight);\n\n if (darkRatio >= minContrast || lightRatio >= minContrast) {\n return darkRatio >= lightRatio ? fallbackDark : fallbackLight;\n }\n\n return bestHex;\n}\n\nfunction pickForegroundColor(baseOklch, surfaceHex, options = {}) {\n const minContrast = options.minContrast ?? BRAND_MIN_CONTRAST;\n const darkCandidate = options.darkCandidate ?? \"#101214\";\n const lightCandidate = options.lightCandidate ?? \"#ffffff\";\n const preferredCandidate = options.preferredCandidate;\n const preferredMinContrast = options.preferredMinContrast ?? minContrast;\n const preferredSwitchDelta = options.preferredSwitchDelta ?? 0;\n const darkRatio = contrastRatio(surfaceHex, darkCandidate);\n const lightRatio = contrastRatio(surfaceHex, lightCandidate);\n const darkPasses = darkRatio >= minContrast;\n const lightPasses = lightRatio >= minContrast;\n const preferredLightPasses = lightRatio >= preferredMinContrast;\n const preferredDarkPasses = darkRatio >= preferredMinContrast;\n\n if (darkPasses || lightPasses) {\n if (preferredCandidate === \"light\" && preferredLightPasses) {\n return lightCandidate;\n }\n if (preferredCandidate === \"dark\" && preferredDarkPasses) {\n return darkCandidate;\n }\n\n if (preferredCandidate === \"light\" && lightPasses) {\n if (!darkPasses || darkRatio - lightRatio <= preferredSwitchDelta) {\n return lightCandidate;\n }\n return darkCandidate;\n }\n if (preferredCandidate === \"dark\" && darkPasses) {\n if (\n !lightPasses ||\n lightRatio - darkRatio <= preferredSwitchDelta\n ) {\n return darkCandidate;\n }\n return lightCandidate;\n }\n\n if (darkPasses && lightPasses) {\n return darkRatio >= lightRatio ? darkCandidate : lightCandidate;\n }\n return darkPasses ? darkCandidate : lightCandidate;\n }\n\n const preferDark = darkRatio >= lightRatio;\n return makeReadableTextOnSurface(baseOklch, surfaceHex, {\n minContrast,\n preferDark,\n initialLightness: preferDark ? 0.2 : 0.96,\n chromaScale: 0.1,\n });\n}\n\nconst BRAND_STOPS = [100, 200, 300, 400, 500, 600, 700, 800, 900, 1000];\nconst BRAND_LIGHTNESS_CURVE = [\n 0.9, 0.84, 0.78, 0.72, 0.67, 0.62, 0.56, 0.5, 0.44, 0.38,\n];\nconst BRAND_CHROMA_MULTIPLIERS = [\n 0.28, 0.4, 0.54, 0.7, 0.86, 1, 1.08, 1.14, 1.2, 1.24,\n];\nconst BRAND_MIN_SURFACE_CONTRAST = 1.8;\nconst BRAND_MIN_SUBTLE_SURFACE_CONTRAST = 1.15;\nconst BRAND_MIN_SOFT_SURFACE_CONTRAST = 1.08;\nconst BRAND_UI_TEXT_MIN_CONTRAST = 2.5;\nconst BRAND_LIGHT_TEXT_SWITCH_DELTA = 3;\nconst LIGHT_CANVAS_HEX = \"#ffffff\";\nconst DARK_CANVAS_HEX = \"#1f2228\";\n\nfunction pickRampStopForContrast(\n ramp,\n stopCandidates,\n referenceHex,\n minContrast,\n) {\n const fallbackStop = stopCandidates[stopCandidates.length - 1];\n for (const stop of stopCandidates) {\n const candidate = ramp[stop];\n if (!candidate) {\n continue;\n }\n if (contrastRatio(candidate, referenceHex) >= minContrast) {\n return stop;\n }\n }\n return fallbackStop;\n}\n\nfunction makeBrandRampFromSeed(baseOklch) {\n const lightnessOffset = baseOklch.l - BRAND_LIGHTNESS_CURVE[5];\n const minSeedChroma = baseOklch.c > 0.02 ? 0.02 : 0;\n\n return BRAND_STOPS.reduce((acc, stop, index) => {\n const lightness = clamp01(\n BRAND_LIGHTNESS_CURVE[index] + lightnessOffset,\n );\n const chroma = Math.min(\n 0.4,\n Math.max(\n minSeedChroma,\n baseOklch.c * BRAND_CHROMA_MULTIPLIERS[index],\n ),\n );\n acc[stop] = rgbToHex(oklchToSrgb(lightness, chroma, baseOklch.h));\n return acc;\n }, {});\n}\n\nfunction makeSemanticBrandTokens(baseOklch, ramp) {\n const lightSoftStops = [100, 200, 300, 400, 500, 600, 700];\n const lightSoftStop = pickRampStopForContrast(\n ramp,\n lightSoftStops,\n LIGHT_CANVAS_HEX,\n BRAND_MIN_SOFT_SURFACE_CONTRAST,\n );\n const lightSoftIndex = lightSoftStops.indexOf(lightSoftStop);\n const lightSoftHoveredStop =\n lightSoftStops[Math.min(lightSoftIndex + 1, lightSoftStops.length - 1)];\n const lightSoftPressedStop =\n lightSoftStops[Math.min(lightSoftIndex + 2, lightSoftStops.length - 1)];\n\n const darkSoftStops = [1000, 900, 800, 700, 600, 500];\n const darkSoftStop = pickRampStopForContrast(\n ramp,\n darkSoftStops,\n DARK_CANVAS_HEX,\n BRAND_MIN_SOFT_SURFACE_CONTRAST,\n );\n const darkSoftIndex = darkSoftStops.indexOf(darkSoftStop);\n const darkSoftHoveredStop =\n darkSoftStops[Math.min(darkSoftIndex + 1, darkSoftStops.length - 1)];\n const darkSoftPressedStop =\n darkSoftStops[Math.min(darkSoftIndex + 2, darkSoftStops.length - 1)];\n\n const lightSubtleStops = [200, 300, 400, 500, 600, 700, 800];\n const lightSubtleStop = pickRampStopForContrast(\n ramp,\n lightSubtleStops,\n LIGHT_CANVAS_HEX,\n BRAND_MIN_SUBTLE_SURFACE_CONTRAST,\n );\n const darkSubtleStops = [900, 800, 700, 600, 500, 400];\n const darkSubtleStop = pickRampStopForContrast(\n ramp,\n darkSubtleStops,\n DARK_CANVAS_HEX,\n BRAND_MIN_SUBTLE_SURFACE_CONTRAST,\n );\n\n const lightStrongStops = [600, 700, 800, 900, 1000];\n const lightStrongStop = pickRampStopForContrast(\n ramp,\n lightStrongStops,\n LIGHT_CANVAS_HEX,\n BRAND_MIN_SURFACE_CONTRAST,\n );\n const lightStrongIndex = lightStrongStops.indexOf(lightStrongStop);\n const lightStrongHoveredStop =\n lightStrongStops[\n Math.min(lightStrongIndex + 1, lightStrongStops.length - 1)\n ];\n const lightStrongPressedStop =\n lightStrongStops[\n Math.min(lightStrongIndex + 2, lightStrongStops.length - 1)\n ];\n\n const darkStrongStops = [400, 300, 200, 100];\n const darkStrongStop = pickRampStopForContrast(\n ramp,\n darkStrongStops,\n DARK_CANVAS_HEX,\n BRAND_MIN_SURFACE_CONTRAST,\n );\n const darkStrongIndex = darkStrongStops.indexOf(darkStrongStop);\n const darkStrongHoveredStop =\n darkStrongStops[\n Math.min(darkStrongIndex + 1, darkStrongStops.length - 1)\n ];\n const darkStrongPressedStop =\n darkStrongStops[\n Math.min(darkStrongIndex + 2, darkStrongStops.length - 1)\n ];\n\n const tokens = {\n \"--color-brand-surface-soft-light\": ramp[lightSoftStop],\n \"--color-brand-surface-soft-hovered-light\": ramp[lightSoftHoveredStop],\n \"--color-brand-surface-soft-pressed-light\": ramp[lightSoftPressedStop],\n \"--color-brand-surface-soft-dark\": ramp[darkSoftStop],\n \"--color-brand-surface-soft-hovered-dark\": ramp[darkSoftHoveredStop],\n \"--color-brand-surface-soft-pressed-dark\": ramp[darkSoftPressedStop],\n \"--color-brand-surface-subtle-light\": ramp[lightSubtleStop],\n \"--color-brand-surface-subtle-dark\": ramp[darkSubtleStop],\n \"--color-brand-surface-strong-light\": ramp[lightStrongStop],\n \"--color-brand-surface-strong-hovered-light\":\n ramp[lightStrongHoveredStop],\n \"--color-brand-surface-strong-pressed-light\":\n ramp[lightStrongPressedStop],\n \"--color-brand-surface-strong-dark\": ramp[darkStrongStop],\n \"--color-brand-surface-strong-hovered-dark\":\n ramp[darkStrongHoveredStop],\n \"--color-brand-surface-strong-pressed-dark\":\n ramp[darkStrongPressedStop],\n };\n\n const preferredSoftLightForeground = ramp[600];\n const softLightContrast = contrastRatio(\n tokens[\"--color-brand-surface-soft-light\"],\n preferredSoftLightForeground,\n );\n tokens[\"--color-brand-on-soft-light\"] =\n softLightContrast >= BRAND_MIN_CONTRAST\n ? preferredSoftLightForeground\n : pickForegroundColor(\n baseOklch,\n tokens[\"--color-brand-surface-soft-light\"],\n {\n minContrast: BRAND_MIN_CONTRAST,\n },\n );\n tokens[\"--color-brand-on-soft-dark\"] = pickForegroundColor(\n baseOklch,\n tokens[\"--color-brand-surface-soft-dark\"],\n {\n minContrast: BRAND_MIN_CONTRAST,\n },\n );\n tokens[\"--color-brand-on-subtle-light\"] = pickForegroundColor(\n baseOklch,\n tokens[\"--color-brand-surface-subtle-light\"],\n {\n minContrast: BRAND_UI_TEXT_MIN_CONTRAST,\n preferredCandidate: \"light\",\n preferredMinContrast: BRAND_UI_TEXT_MIN_CONTRAST,\n preferredSwitchDelta: BRAND_LIGHT_TEXT_SWITCH_DELTA,\n },\n );\n tokens[\"--color-brand-on-subtle-dark\"] = pickForegroundColor(\n baseOklch,\n tokens[\"--color-brand-surface-subtle-dark\"],\n {\n minContrast: BRAND_MIN_CONTRAST,\n },\n );\n tokens[\"--color-brand-on-strong-light\"] = pickForegroundColor(\n baseOklch,\n tokens[\"--color-brand-surface-strong-light\"],\n {\n minContrast: BRAND_UI_TEXT_MIN_CONTRAST,\n preferredCandidate: \"light\",\n preferredMinContrast: BRAND_UI_TEXT_MIN_CONTRAST,\n preferredSwitchDelta: BRAND_LIGHT_TEXT_SWITCH_DELTA,\n },\n );\n tokens[\"--color-brand-on-strong-dark\"] = pickForegroundColor(\n baseOklch,\n tokens[\"--color-brand-surface-strong-dark\"],\n {\n minContrast: BRAND_MIN_CONTRAST,\n },\n );\n\n tokens[\"--color-brand-text-light\"] =\n tokens[\"--color-brand-surface-strong-light\"];\n tokens[\"--color-brand-text-dark\"] =\n tokens[\"--color-brand-surface-strong-dark\"];\n tokens[\"--color-brand-icon-light\"] =\n tokens[\"--color-brand-surface-strong-light\"];\n tokens[\"--color-brand-icon-dark\"] =\n tokens[\"--color-brand-surface-strong-dark\"];\n tokens[\"--color-brand-border-light\"] =\n tokens[\"--color-brand-surface-strong-light\"];\n tokens[\"--color-brand-border-dark\"] =\n tokens[\"--color-brand-surface-strong-dark\"];\n\n return tokens;\n}\n\nfunction makeBrandTokens(baseHex) {\n const norm = normalizeHex(baseHex);\n if (!norm) {\n return null;\n }\n\n const baseRgb = hexToRgb(norm);\n if (!baseRgb) {\n return null;\n }\n\n const baseOklch = rgbToOklch(baseRgb);\n const ramp = makeBrandRampFromSeed(baseOklch);\n // Keep the incoming seed exact for debugging and transparency.\n ramp[600] = norm;\n\n return {\n \"--color-brand-seed\": norm,\n \"--color-brand-100\": ramp[100],\n \"--color-brand-200\": ramp[200],\n \"--color-brand-300\": ramp[300],\n \"--color-brand-400\": ramp[400],\n \"--color-brand-500\": ramp[500],\n \"--color-brand-600\": ramp[600],\n \"--color-brand-700\": ramp[700],\n \"--color-brand-800\": ramp[800],\n \"--color-brand-900\": ramp[900],\n \"--color-brand-1000\": ramp[1000],\n ...makeSemanticBrandTokens(baseOklch, ramp),\n };\n}\n\nconst brandVars = computed(() => makeBrandTokens(props.accentColor) ?? {});\n\nconst accentStackEntry = {\n vars: {},\n enabled: Boolean(props.exposeGlobalAccent),\n};\nglobalAccentStack.push(accentStackEntry);\n\nwatch(\n () => props.exposeGlobalAccent,\n (enabled) => {\n accentStackEntry.enabled = Boolean(enabled);\n applyGlobalAccentFromStack();\n },\n { immediate: true },\n);\n\nwatch(\n brandVars,\n (vars) => {\n if (vars && Object.keys(vars).length > 0) {\n accentStackEntry.vars = { ...vars };\n } else {\n accentStackEntry.vars = {};\n }\n applyGlobalAccentFromStack();\n },\n { immediate: true },\n);\n</script>\n\n<style lang=\"less\">\n@import \"index.less\";\n</style>\n","<template>\n <DropdownMenu\n v-model:open=\"open\"\n text=\"Theme\"\n aria-label=\"Select theme mode\"\n >\n <DropdownItemGroup title=\"Theme\">\n <DropdownItemRadio\n v-model:checked=\"internalMode\"\n value=\"auto\"\n :label=\"MODE_LABELS.auto\"\n :aria-label=\"`${MODE_LABELS.auto} mode`\"\n />\n <hr class=\"theme-switcher-divider\" role=\"separator\" />\n <DropdownItemRadio\n v-model:checked=\"internalMode\"\n value=\"light\"\n :label=\"MODE_LABELS.light\"\n :aria-label=\"`${MODE_LABELS.light} mode`\"\n />\n <DropdownItemRadio\n v-model:checked=\"internalMode\"\n value=\"dark\"\n :label=\"MODE_LABELS.dark\"\n :aria-label=\"`${MODE_LABELS.dark} mode`\"\n />\n </DropdownItemGroup>\n </DropdownMenu>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from \"vue\";\nimport {\n DropdownMenu,\n DropdownItemGroup,\n DropdownItemRadio,\n} from \"@gospore/dropdown-menu\";\nimport {\n readStoredMode,\n writeStoredMode,\n VALID_THEME_MODES,\n applyStoredModeToDocument,\n} from \"./modeStorage\";\n\nconst MODE_OPTIONS = [\n { value: \"auto\", label: \"System\" },\n { value: \"light\", label: \"Light\" },\n { value: \"dark\", label: \"Dark\" },\n];\nconst MODE_LABELS = MODE_OPTIONS.reduce((map, option) => {\n map[option.value] = option.label;\n return map;\n}, {});\nconst VALID_MODES = VALID_THEME_MODES;\n\nconst props = defineProps({\n mode: {\n type: String,\n default: \"auto\",\n validator: (value) => [\"auto\", \"light\", \"dark\"].includes(value),\n },\n});\nconst emit = defineEmits([\"update:mode\"]);\n\napplyStoredModeToDocument();\n\nconst open = ref(false);\nconst initialMode = readStoredMode() ?? props.mode;\nconst internalMode = ref(\n VALID_MODES.includes(initialMode) ? initialMode : \"auto\",\n);\nconst label = computed(\n () => MODE_LABELS[internalMode.value] ?? MODE_LABELS.auto,\n);\n\nwatch(\n () => props.mode,\n (mode) => {\n if (VALID_MODES.includes(mode) && mode !== internalMode.value) {\n internalMode.value = mode;\n }\n },\n);\n\nwatch(\n internalMode,\n (mode) => {\n if (!VALID_MODES.includes(mode)) {\n internalMode.value = \"auto\";\n return;\n }\n open.value = false;\n emit(\"update:mode\", mode);\n writeStoredMode(mode);\n },\n { immediate: true },\n);\n</script>\n\n<style scoped lang=\"less\">\n.theme-switcher-divider {\n margin: 4px 0;\n}\n</style>\n"],"names":["VALID_THEME_MODES","STORAGE_KEY","ONE_YEAR_IN_SECONDS","DARK_MODE_QUERY","readStoredMode","stored","getCookie","writeStoredMode","mode","hostname","protocol","domain","getCookieDomain","secure","attributes","applyStoredModeToDocument","resolvedMode","darkMode","resolveDarkMode","name","encodedName","cookies","cookie","parts","mediaQueryList","themePortalHostKey","useThemePortalTarget","hostRef","inject","fallbackTarget","computed","props","__props","globalAccentStack","appliedGlobalAccentKeys","applyGlobalAccentFromStack","root","key","activeEntry","entry","value","darkModeMedia","prefersReducedMotionMedia","PREFERS_REDUCED_MOTION_QUERY","initialMode","getEffectiveMode","currentMode","ref","theme","portalHost","handleSystemPreferenceChange","watch","syncDarkMode","previousValue","setDocumentDarkModeAttribute","withThemeTransition","onBeforeUnmount","index","accentStackEntry","event","applyTheme","startViewTransition","element","THEME_TRANSITION_DURATION","provide","normalizeHex","hex","h","g","b","hexToRgb","r","rgbToHex","toHex","clamp01","srgbChannelToLinear","channel","linearChannelToSrgb","normalized","rgbToOklch","rNorm","gNorm","bNorm","rLin","gLin","bLin","l","m","s","lRoot","mRoot","sRoot","oklabL","oklabA","oklabB","chroma","hue","tryOklchToSrgb","c","clampLinear","angle","a","lComponent","mComponent","sComponent","lCube","mCube","sCube","lLin","mLin","sLin","bValue","oklchToSrgb","attempt","rgb","relativeLuminance","contrastRatio","hexA","hexB","lumA","lumB","lighter","darker","makeReadableTextOnSurface","baseOklch","surfaceHex","options","minContrast","BRAND_MIN_CONTRAST","preferDark","textChroma","initialLightness","direction","step","lightness","bestHex","bestContrast","textHex","ratio","fallbackDark","fallbackLight","darkRatio","lightRatio","pickForegroundColor","darkCandidate","lightCandidate","preferredCandidate","preferredMinContrast","preferredSwitchDelta","darkPasses","lightPasses","preferredLightPasses","preferredDarkPasses","BRAND_STOPS","BRAND_LIGHTNESS_CURVE","BRAND_CHROMA_MULTIPLIERS","pickRampStopForContrast","ramp","stopCandidates","referenceHex","fallbackStop","stop","candidate","makeBrandRampFromSeed","lightnessOffset","minSeedChroma","acc","makeSemanticBrandTokens","lightSoftStops","lightSoftStop","LIGHT_CANVAS_HEX","BRAND_MIN_SOFT_SURFACE_CONTRAST","lightSoftIndex","lightSoftHoveredStop","lightSoftPressedStop","darkSoftStops","darkSoftStop","DARK_CANVAS_HEX","darkSoftIndex","darkSoftHoveredStop","darkSoftPressedStop","lightSubtleStop","BRAND_MIN_SUBTLE_SURFACE_CONTRAST","darkSubtleStop","lightStrongStops","lightStrongStop","BRAND_MIN_SURFACE_CONTRAST","lightStrongIndex","lightStrongHoveredStop","lightStrongPressedStop","darkStrongStops","darkStrongStop","darkStrongIndex","darkStrongHoveredStop","darkStrongPressedStop","tokens","preferredSoftLightForeground","softLightContrast","BRAND_UI_TEXT_MIN_CONTRAST","BRAND_LIGHT_TEXT_SWITCH_DELTA","makeBrandTokens","baseHex","norm","baseRgb","brandVars","enabled","vars","_createElementBlock","_renderSlot","_ctx","_createElementVNode","MODE_LABELS","map","option","VALID_MODES","emit","__emit","open","internalMode","_createBlock","_unref","DropdownMenu","$event","_createVNode","DropdownItemGroup","DropdownItemRadio"],"mappings":"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"}
package/dist/theme.css CHANGED
@@ -1 +1 @@
1
- :root{--border-radius-regular: 3px;--border-radius-large: 6px;--border-width: var(--border-width-2);--border-width-1: 1px;--border-width-2: 2px;--border-width-3: 3px}:root{--color-neutral-0: oklch(1 0 250);--color-neutral-100: oklch(.976 0 250);--color-neutral-200: oklch(.95 .002 250);--color-neutral-300: oklch(.9 .004 250);--color-neutral-400: oklch(.8 .006 250);--color-neutral-500: oklch(.68 .008 250);--color-neutral-600: oklch(.58 .01 250);--color-neutral-700: oklch(.5 .012 250);--color-neutral-800: oklch(.4 .012 250);--color-neutral-900: oklch(.3 .01 250);--color-neutral-1000: oklch(.2 .008 250);--color-neutral-1100: oklch(.1 .004 250);--color-neutral-dark-0: oklch(0 .0015 250);--color-neutral-dark-100: oklch(.15 .0045 250);--color-neutral-dark-200: oklch(.18 .005 250);--color-neutral-dark-300: oklch(.25 .006 250);--color-neutral-dark-400: oklch(.33 .008 250);--color-neutral-dark-500: oklch(.42 .009 250);--color-neutral-dark-600: oklch(.52 .01 250);--color-neutral-dark-700: oklch(.63 .01 250);--color-neutral-dark-800: oklch(.74 .009 250);--color-neutral-dark-900: oklch(.83 .007 250);--color-neutral-dark-1000: oklch(.9 .005 250);--color-neutral-dark-1100: oklch(.98 .003 250);--color-neutral-alpha-100: oklch(.6 .012 250 / 3%);--color-neutral-alpha-200: oklch(.6 .012 250 / 8%);--color-neutral-alpha-300: oklch(.6 .012 250 / 14%);--color-neutral-alpha-400: oklch(.6 .012 250 / 29%);--color-neutral-alpha-500: oklch(.6 .012 250 / 55%);--color-neutral-dark-alpha-0: oklch(.0993 .0115 195.47 / 46%);--color-neutral-dark-alpha-100: oklch(.9 .02 250 / 4%);--color-neutral-dark-alpha-200: oklch(.9 .02 250 / 7%);--color-neutral-dark-alpha-300: oklch(.9 .02 250 / 12%);--color-neutral-dark-alpha-400: oklch(.9 .02 250 / 25%);--color-neutral-dark-alpha-500: oklch(.9 .02 250 / 45%);--color-brand-100: var(--color-blue-100);--color-brand-200: var(--color-blue-200);--color-brand-300: var(--color-blue-300);--color-brand-400: var(--color-blue-400);--color-brand-500: var(--color-blue-500);--color-brand-600: var(--color-blue-600);--color-brand-700: var(--color-blue-700);--color-brand-800: var(--color-blue-800);--color-brand-900: var(--color-blue-900);--color-brand-1000: var(--color-blue-1000);--color-blue-100: oklch(.82 .09 257.4);--color-blue-200: oklch(.78 .11 257.4);--color-blue-300: oklch(.74 .13 257.4);--color-blue-400: oklch(.7 .15 257.4);--color-blue-500: oklch(.66 .17 257.4);--color-blue-600: oklch(.62 .19 257.4);--color-blue-700: oklch(.58 .21 257.4);--color-blue-800: oklch(.54 .22 257.4);--color-blue-900: oklch(.5 .23 257.4);--color-blue-1000: oklch(.46 .24 257.4);--color-green-100: oklch(.82 .07 160.83);--color-green-200: oklch(.79 .082 160.83);--color-green-300: oklch(.76 .094 160.83);--color-green-400: oklch(.73 .106 160.83);--color-green-500: oklch(.7 .118 160.83);--color-green-600: oklch(.66 .13 160.83);--color-green-700: oklch(.62 .142 160.83);--color-green-800: oklch(.58 .148 160.83);--color-green-900: oklch(.54 .154 160.83);--color-green-1000: oklch(.5 .16 160.83);--color-orange-100: oklch(.86 .09 73.79);--color-orange-200: oklch(.82 .105 73.79);--color-orange-300: oklch(.78 .12 73.79);--color-orange-400: oklch(.74 .135 73.79);--color-orange-500: oklch(.7 .15 73.79);--color-orange-600: oklch(.66 .165 73.79);--color-orange-700: oklch(.62 .18 73.79);--color-orange-800: oklch(.58 .19 73.79);--color-orange-900: oklch(.54 .2 73.79);--color-orange-1000: oklch(.5 .21 73.79);--color-red-100: oklch(.8 .1 34.02);--color-red-200: oklch(.76 .118 34.02);--color-red-300: oklch(.72 .136 34.02);--color-red-400: oklch(.68 .154 34.02);--color-red-500: oklch(.64 .172 34.02);--color-red-600: oklch(.6 .19 34.02);--color-red-700: oklch(.56 .208 34.02);--color-red-800: oklch(.52 .218 34.02);--color-red-900: oklch(.48 .228 34.02);--color-red-1000: oklch(.44 .238 34.02);--color-yellow-100: oklch(.94 .08 95.2);--color-yellow-200: oklch(.9 .092 95.2);--color-yellow-300: oklch(.86 .104 95.2);--color-yellow-400: oklch(.82 .116 95.2);--color-yellow-500: oklch(.78 .128 95.2);--color-yellow-600: oklch(.74 .14 95.2);--color-yellow-700: oklch(.7 .152 95.2);--color-yellow-800: oklch(.66 .164 95.2);--color-yellow-900: oklch(.62 .176 95.2);--color-yellow-1000: oklch(.58 .188 95.2);--color-teal-100: oklch(.82 .08 200.6);--color-teal-200: oklch(.78 .094 200.6);--color-teal-300: oklch(.74 .108 200.6);--color-teal-400: oklch(.7 .122 200.6);--color-teal-500: oklch(.66 .136 200.6);--color-teal-600: oklch(.62 .15 200.6);--color-teal-700: oklch(.58 .164 200.6);--color-teal-800: oklch(.54 .178 200.6);--color-teal-900: oklch(.5 .19 200.6);--color-teal-1000: oklch(.46 .202 200.6);--color-purple-100: oklch(.8 .09 308.4);--color-purple-200: oklch(.76 .106 308.4);--color-purple-300: oklch(.72 .122 308.4);--color-purple-400: oklch(.68 .138 308.4);--color-purple-500: oklch(.64 .154 308.4);--color-purple-600: oklch(.6 .17 308.4);--color-purple-700: oklch(.56 .186 308.4);--color-purple-800: oklch(.52 .198 308.4);--color-purple-900: oklch(.48 .21 308.4);--color-purple-1000: oklch(.44 .222 308.4);--color-pink-100: oklch(.84 .1 21.6);--color-pink-200: oklch(.8 .116 21.6);--color-pink-300: oklch(.76 .132 21.6);--color-pink-400: oklch(.72 .148 21.6);--color-pink-500: oklch(.68 .164 21.6);--color-pink-600: oklch(.64 .18 21.6);--color-pink-700: oklch(.6 .196 21.6);--color-pink-800: oklch(.56 .208 21.6);--color-pink-900: oklch(.52 .22 21.6);--color-pink-1000: oklch(.48 .232 21.6);--color-background-surface-light: var(--color-neutral-0);--color-background-surface-dark: var(--color-neutral-dark-100);--color-background-surface-hovered-light: var(--color-neutral-200);--color-background-surface-hovered-dark: var(--color-neutral-dark-200);--color-background-surface-pressed-light: var(--color-neutral-300);--color-background-surface-pressed-dark: var(--color-neutral-dark-300);--color-background-surface-overlay-light: var(--color-neutral-0);--color-background-surface-overlay-dark: var(--color-neutral-dark-200);--color-background-surface-overlay-hovered-light: var(--color-neutral-200);--color-background-surface-overlay-hovered-dark: var( --color-neutral-dark-300 );--color-background-surface-overlay-pressed-light: var(--color-neutral-300);--color-background-surface-overlay-pressed-dark: var( --color-neutral-dark-400 );--color-background-surface-raised-light: var(--color-neutral-0);--color-background-surface-raised-dark: var(--color-neutral-dark-200);--color-background-surface-raised-hovered-light: var(--color-neutral-200);--color-background-surface-raised-hovered-dark: var( --color-neutral-dark-300 );--color-background-surface-raised-pressed-light: var(--color-neutral-300);--color-background-surface-raised-pressed-dark: var( --color-neutral-dark-300 );--color-background-surface-sunken-light: var(--color-neutral-100);--color-background-surface-sunken-dark: var(--color-neutral-dark-0);--color-background-neutral-light: var(--color-neutral-alpha-200);--color-background-neutral-hovered-light: var(--color-neutral-alpha-300);--color-background-neutral-pressed-light: var(--color-neutral-alpha-400);--color-background-neutral-dark: var(--color-neutral-dark-alpha-200);--color-background-neutral-hovered-dark: var( --color-neutral-dark-alpha-300 );--color-background-neutral-pressed-dark: var( --color-neutral-dark-alpha-400 );--color-background-neutral-subtle-light: transparent;--color-background-neutral-subtle-hovered-light: var( --color-neutral-alpha-200 );--color-background-neutral-subtle-pressed-light: var( --color-neutral-alpha-300 );--color-background-neutral-subtle-dark: transparent;--color-background-neutral-subtle-hovered-dark: var( --color-neutral-dark-alpha-200 );--color-background-neutral-subtle-pressed-dark: var( --color-neutral-dark-alpha-300 );--color-background-neutral-bold-light: var(--color-neutral-800);--color-background-neutral-bold-hovered-light: var(--color-neutral-900);--color-background-neutral-bold-pressed-light: var(--color-neutral-1100);--color-background-neutral-bold-dark: var(--color-neutral-dark-800);--color-background-neutral-bold-hovered-dark: var(--color-neutral-dark-900);--color-background-neutral-bold-pressed-dark: var( --color-neutral-dark-1100 );--color-background-brand-100-light: var(--color-brand-100);--color-background-brand-100-hovered-light: var(--color-brand-200);--color-background-brand-100-pressed-light: var(--color-brand-300);--color-background-brand-100-dark: var(--color-brand-1000);--color-background-brand-100-hovered-dark: var(--color-brand-900);--color-background-brand-100-pressed-dark: var(--color-brand-800);--color-background-brand-200-light: var(--color-brand-700);--color-background-brand-200-hovered-light: var(--color-brand-800);--color-background-brand-200-pressed-light: var(--color-brand-900);--color-background-brand-200-dark: var(--color-brand-400);--color-background-brand-200-hovered-dark: var(--color-brand-300);--color-background-brand-200-pressed-dark: var(--color-brand-200);--color-background-brand-300-light: var(--color-brand-1000);--color-background-brand-300-hovered-light: var(--color-brand-900);--color-background-brand-300-pressed-light: var(--color-brand-800);--color-background-brand-300-dark: var(--color-brand-100);--color-background-brand-300-hovered-dark: var(--color-brand-200);--color-background-brand-300-pressed-dark: var(--color-brand-300);--color-background-information-100-light: var(--color-blue-100);--color-background-information-100-hovered-light: var(--color-blue-200);--color-background-information-100-pressed-light: var(--color-blue-300);--color-background-information-100-dark: var(--color-blue-1000);--color-background-information-100-hovered-dark: var(--color-blue-900);--color-background-information-100-pressed-dark: var(--color-blue-800);--color-background-information-200-light: var(--color-blue-700);--color-background-information-200-hovered-light: var(--color-blue-800);--color-background-information-200-pressed-light: var(--color-blue-900);--color-background-information-200-dark: var(--color-blue-400);--color-background-information-200-hovered-dark: var(--color-blue-300);--color-background-information-200-pressed-dark: var(--color-blue-200);--color-background-success-100-light: var(--color-green-100);--color-background-success-100-hovered-light: var(--color-green-200);--color-background-success-100-pressed-light: var(--color-green-300);--color-background-success-100-dark: var(--color-green-1000);--color-background-success-100-hovered-dark: var(--color-green-900);--color-background-success-100-pressed-dark: var(--color-green-800);--color-background-success-200-light: var(--color-green-700);--color-background-success-200-hovered-light: var(--color-green-800);--color-background-success-200-pressed-light: var(--color-green-900);--color-background-success-200-dark: var(--color-green-400);--color-background-success-200-hovered-dark: var(--color-green-300);--color-background-success-200-pressed-dark: var(--color-green-200);--color-background-warning-100-light: var(--color-yellow-100);--color-background-warning-100-hovered-light: var(--color-yellow-200);--color-background-warning-100-pressed-light: var(--color-yellow-300);--color-background-warning-100-dark: var(--color-yellow-1000);--color-background-warning-100-hovered-dark: var(--color-yellow-900);--color-background-warning-100-pressed-dark: var(--color-yellow-800);--color-background-warning-200-light: var(--color-yellow-300);--color-background-warning-200-hovered-light: var(--color-yellow-400);--color-background-warning-200-pressed-light: var(--color-yellow-500);--color-background-warning-200-dark: var(--color-yellow-300);--color-background-warning-200-hovered-dark: var(--color-yellow-400);--color-background-warning-200-pressed-dark: var(--color-yellow-500);--color-background-danger-100-light: var(--color-red-100);--color-background-danger-100-hovered-light: var(--color-red-200);--color-background-danger-100-pressed-light: var(--color-red-300);--color-background-danger-100-dark: var(--color-red-1000);--color-background-danger-100-hovered-dark: var(--color-red-900);--color-background-danger-100-pressed-dark: var(--color-red-800);--color-background-danger-200-light: var(--color-red-700);--color-background-danger-200-hovered-light: var(--color-red-800);--color-background-danger-200-pressed-light: var(--color-red-900);--color-background-danger-200-dark: var(--color-red-400);--color-background-danger-200-hovered-dark: var(--color-red-300);--color-background-danger-200-pressed-dark: var(--color-red-200);--color-background-discovery-100-light: var(--color-purple-100);--color-background-discovery-100-hovered-light: var(--color-purple-200);--color-background-discovery-100-pressed-light: var(--color-purple-300);--color-background-discovery-100-dark: var(--color-purple-1000);--color-background-discovery-100-hovered-dark: var(--color-purple-900);--color-background-discovery-100-pressed-dark: var(--color-purple-800);--color-background-discovery-200-light: var(--color-purple-700);--color-background-discovery-200-hovered-light: var(--color-purple-800);--color-background-discovery-200-pressed-light: var(--color-purple-900);--color-background-discovery-200-dark: var(--color-purple-400);--color-background-discovery-200-hovered-dark: var(--color-purple-300);--color-background-discovery-200-pressed-dark: var(--color-purple-200);--color-background-disabled-light: var(--color-neutral-alpha-100);--color-background-disabled-dark: var(--color-neutral-dark-alpha-100);--color-background-selected-100-light: var(--color-blue-100);--color-background-selected-100-hovered-light: var(--color-blue-200);--color-background-selected-100-pressed-light: var(--color-blue-300);--color-background-selected-100-dark: var(--color-blue-1000);--color-background-selected-100-hovered-dark: var(--color-blue-900);--color-background-selected-100-pressed-dark: var(--color-blue-800);--color-background-selected-200-light: var(--color-blue-700);--color-background-selected-200-hovered-light: var(--color-blue-800);--color-background-selected-200-pressed-light: var(--color-blue-900);--color-background-selected-200-dark: var(--color-blue-400);--color-background-selected-200-hovered-dark: var(--color-blue-300);--color-background-selected-200-pressed-dark: var(--color-blue-200);--color-background-input-light: var(--color-neutral-0);--color-background-input-hovered-light: var(--color-neutral-100);--color-background-input-pressed-light: var(--color-neutral-0);--color-background-input-dark: var(--color-neutral-dark-200);--color-background-input-hovered-dark: var(--color-neutral-dark-300);--color-background-input-pressed-dark: var(--color-neutral-dark-200);--color-background-accent-gray-100-light: var(--color-neutral-200);--color-background-accent-gray-100-hovered-light: var(--color-neutral-300);--color-background-accent-gray-100-pressed-light: var(--color-neutral-400);--color-background-accent-gray-100-dark: var(--color-neutral-dark-300);--color-background-accent-gray-100-hovered-dark: var( --color-neutral-dark-400 );--color-background-accent-gray-100-pressed-dark: var( --color-neutral-dark-500 );--color-background-accent-gray-200-light: var(--color-neutral-300);--color-background-accent-gray-200-hovered-light: var(--color-neutral-400);--color-background-accent-gray-200-pressed-light: var(--color-neutral-500);--color-background-accent-gray-200-dark: var(--color-neutral-dark-400);--color-background-accent-gray-200-hovered-dark: var( --color-neutral-dark-500 );--color-background-accent-gray-200-pressed-dark: var( --color-neutral-dark-600 );--color-background-accent-gray-300-light: var(--color-neutral-500);--color-background-accent-gray-300-hovered-light: var(--color-neutral-400);--color-background-accent-gray-300-pressed-light: var(--color-neutral-300);--color-background-accent-gray-300-dark: var(--color-neutral-dark-500);--color-background-accent-gray-300-hovered-dark: var( --color-neutral-dark-400 );--color-background-accent-gray-300-pressed-dark: var( --color-neutral-dark-300 );--color-background-accent-gray-400-light: var(--color-neutral-700);--color-background-accent-gray-400-hovered-light: var(--color-neutral-800);--color-background-accent-gray-400-pressed-light: var(--color-neutral-900);--color-background-accent-gray-400-dark: var(--color-neutral-dark-700);--color-background-accent-gray-400-hovered-dark: var( --color-neutral-dark-800 );--color-background-accent-gray-400-pressed-dark: var( --color-neutral-dark-900 );--color-background-accent-blue-100-light: var(--color-blue-100);--color-background-accent-blue-100-hovered-light: var(--color-blue-200);--color-background-accent-blue-100-pressed-light: var(--color-blue-300);--color-background-accent-blue-100-dark: var(--color-blue-1000);--color-background-accent-blue-100-hovered-dark: var(--color-blue-900);--color-background-accent-blue-100-pressed-dark: var(--color-blue-800);--color-background-accent-blue-200-light: var(--color-blue-200);--color-background-accent-blue-200-hovered-light: var(--color-blue-300);--color-background-accent-blue-200-pressed-light: var(--color-blue-400);--color-background-accent-blue-200-dark: var(--color-blue-900);--color-background-accent-blue-200-hovered-dark: var(--color-blue-800);--color-background-accent-blue-200-pressed-dark: var(--color-blue-700);--color-background-accent-blue-300-light: var(--color-blue-400);--color-background-accent-blue-300-hovered-light: var(--color-blue-300);--color-background-accent-blue-300-pressed-light: var(--color-blue-200);--color-background-accent-blue-300-dark: var(--color-blue-800);--color-background-accent-blue-300-hovered-dark: var(--color-blue-900);--color-background-accent-blue-300-pressed-dark: var(--color-blue-1000);--color-background-accent-blue-400-light: var(--color-blue-700);--color-background-accent-blue-400-hovered-light: var(--color-blue-800);--color-background-accent-blue-400-pressed-light: var(--color-blue-900);--color-background-accent-blue-400-dark: var(--color-blue-400);--color-background-accent-blue-400-hovered-dark: var(--color-blue-300);--color-background-accent-blue-400-pressed-dark: var(--color-blue-200);--color-background-accent-green-100-light: var(--color-green-100);--color-background-accent-green-100-hovered-light: var(--color-green-200);--color-background-accent-green-100-pressed-light: var(--color-green-300);--color-background-accent-green-100-dark: var(--color-green-1000);--color-background-accent-green-100-hovered-dark: var(--color-green-900);--color-background-accent-green-100-pressed-dark: var(--color-green-800);--color-background-accent-green-200-light: var(--color-green-200);--color-background-accent-green-200-hovered-light: var(--color-green-300);--color-background-accent-green-200-pressed-light: var(--color-green-400);--color-background-accent-green-200-dark: var(--color-green-900);--color-background-accent-green-200-hovered-dark: var(--color-green-800);--color-background-accent-green-200-pressed-dark: var(--color-green-700);--color-background-accent-green-300-light: var(--color-green-400);--color-background-accent-green-300-hovered-light: var(--color-green-300);--color-background-accent-green-300-pressed-light: var(--color-green-200);--color-background-accent-green-300-dark: var(--color-green-800);--color-background-accent-green-300-hovered-dark: var(--color-green-900);--color-background-accent-green-300-pressed-dark: var(--color-green-1000);--color-background-accent-green-400-light: var(--color-green-700);--color-background-accent-green-400-hovered-light: var(--color-green-800);--color-background-accent-green-400-pressed-light: var(--color-green-900);--color-background-accent-green-400-dark: var(--color-green-400);--color-background-accent-green-400-hovered-dark: var(--color-green-300);--color-background-accent-green-400-pressed-dark: var(--color-green-200);--color-background-accent-orange-100-light: var(--color-orange-100);--color-background-accent-orange-100-hovered-light: var(--color-orange-200);--color-background-accent-orange-100-pressed-light: var(--color-orange-300);--color-background-accent-orange-100-dark: var(--color-orange-1000);--color-background-accent-orange-100-hovered-dark: var(--color-orange-900);--color-background-accent-orange-100-pressed-dark: var(--color-orange-800);--color-background-accent-orange-200-light: var(--color-orange-200);--color-background-accent-orange-200-hovered-light: var(--color-orange-300);--color-background-accent-orange-200-pressed-light: var(--color-orange-400);--color-background-accent-orange-200-dark: var(--color-orange-900);--color-background-accent-orange-200-hovered-dark: var(--color-orange-800);--color-background-accent-orange-200-pressed-dark: var(--color-orange-700);--color-background-accent-orange-300-light: var(--color-orange-400);--color-background-accent-orange-300-hovered-light: var(--color-orange-300);--color-background-accent-orange-300-pressed-light: var(--color-orange-200);--color-background-accent-orange-300-dark: var(--color-orange-800);--color-background-accent-orange-300-hovered-dark: var(--color-orange-900);--color-background-accent-orange-300-pressed-dark: var(--color-orange-1000);--color-background-accent-orange-400-light: var(--color-orange-700);--color-background-accent-orange-400-hovered-light: var(--color-orange-800);--color-background-accent-orange-400-pressed-light: var(--color-orange-900);--color-background-accent-orange-400-dark: var(--color-orange-400);--color-background-accent-orange-400-hovered-dark: var(--color-orange-300);--color-background-accent-orange-400-pressed-dark: var(--color-orange-200);--color-background-accent-red-100-light: var(--color-red-100);--color-background-accent-red-100-hovered-light: var(--color-red-200);--color-background-accent-red-100-pressed-light: var(--color-red-300);--color-background-accent-red-100-dark: var(--color-red-1000);--color-background-accent-red-100-hovered-dark: var(--color-red-900);--color-background-accent-red-100-pressed-dark: var(--color-red-800);--color-background-accent-red-200-light: var(--color-red-200);--color-background-accent-red-200-hovered-light: var(--color-red-300);--color-background-accent-red-200-pressed-light: var(--color-red-400);--color-background-accent-red-200-dark: var(--color-red-900);--color-background-accent-red-200-hovered-dark: var(--color-red-800);--color-background-accent-red-200-pressed-dark: var(--color-red-700);--color-background-accent-red-300-light: var(--color-red-400);--color-background-accent-red-300-hovered-light: var(--color-red-300);--color-background-accent-red-300-pressed-light: var(--color-red-200);--color-background-accent-red-300-dark: var(--color-red-800);--color-background-accent-red-300-hovered-dark: var(--color-red-900);--color-background-accent-red-300-pressed-dark: var(--color-red-1000);--color-background-accent-red-400-light: var(--color-red-700);--color-background-accent-red-400-hovered-light: var(--color-red-800);--color-background-accent-red-400-pressed-light: var(--color-red-900);--color-background-accent-red-400-dark: var(--color-red-400);--color-background-accent-red-400-hovered-dark: var(--color-red-300);--color-background-accent-red-400-pressed-dark: var(--color-red-200);--color-background-accent-yellow-100-light: var(--color-yellow-100);--color-background-accent-yellow-100-hovered-light: var(--color-yellow-200);--color-background-accent-yellow-100-pressed-light: var(--color-yellow-300);--color-background-accent-yellow-100-dark: var(--color-yellow-1000);--color-background-accent-yellow-100-hovered-dark: var(--color-yellow-900);--color-background-accent-yellow-100-pressed-dark: var(--color-yellow-800);--color-background-accent-yellow-200-light: var(--color-yellow-200);--color-background-accent-yellow-200-hovered-light: var(--color-yellow-300);--color-background-accent-yellow-200-pressed-light: var(--color-yellow-400);--color-background-accent-yellow-200-dark: var(--color-yellow-900);--color-background-accent-yellow-200-hovered-dark: var(--color-yellow-800);--color-background-accent-yellow-200-pressed-dark: var(--color-yellow-700);--color-background-accent-yellow-300-light: var(--color-yellow-300);--color-background-accent-yellow-300-hovered-light: var(--color-yellow-400);--color-background-accent-yellow-300-pressed-light: var(--color-yellow-500);--color-background-accent-yellow-300-dark: var(--color-yellow-800);--color-background-accent-yellow-300-hovered-dark: var(--color-yellow-900);--color-background-accent-yellow-300-pressed-dark: var(--color-yellow-1000);--color-background-accent-yellow-400-light: var(--color-yellow-700);--color-background-accent-yellow-400-hovered-light: var(--color-yellow-800);--color-background-accent-yellow-400-pressed-light: var(--color-yellow-900);--color-background-accent-yellow-400-dark: var(--color-yellow-400);--color-background-accent-yellow-400-hovered-dark: var(--color-yellow-300);--color-background-accent-yellow-400-pressed-dark: var(--color-yellow-200);--color-background-accent-teal-100-light: var(--color-teal-100);--color-background-accent-teal-100-hovered-light: var(--color-teal-200);--color-background-accent-teal-100-pressed-light: var(--color-teal-300);--color-background-accent-teal-100-dark: var(--color-teal-1000);--color-background-accent-teal-100-hovered-dark: var(--color-teal-900);--color-background-accent-teal-100-pressed-dark: var(--color-teal-800);--color-background-accent-teal-200-light: var(--color-teal-200);--color-background-accent-teal-200-hovered-light: var(--color-teal-300);--color-background-accent-teal-200-pressed-light: var(--color-teal-400);--color-background-accent-teal-200-dark: var(--color-teal-900);--color-background-accent-teal-200-hovered-dark: var(--color-teal-800);--color-background-accent-teal-200-pressed-dark: var(--color-teal-700);--color-background-accent-teal-300-light: var(--color-teal-400);--color-background-accent-teal-300-hovered-light: var(--color-teal-300);--color-background-accent-teal-300-pressed-light: var(--color-teal-200);--color-background-accent-teal-300-dark: var(--color-teal-800);--color-background-accent-teal-300-hovered-dark: var(--color-teal-900);--color-background-accent-teal-300-pressed-dark: var(--color-teal-1000);--color-background-accent-teal-400-light: var(--color-teal-700);--color-background-accent-teal-400-hovered-light: var(--color-teal-800);--color-background-accent-teal-400-pressed-light: var(--color-teal-900);--color-background-accent-teal-400-dark: var(--color-teal-400);--color-background-accent-teal-400-hovered-dark: var(--color-teal-300);--color-background-accent-teal-400-pressed-dark: var(--color-teal-200);--color-background-accent-purple-100-light: var(--color-purple-100);--color-background-accent-purple-100-hovered-light: var(--color-purple-200);--color-background-accent-purple-100-pressed-light: var(--color-purple-300);--color-background-accent-purple-100-dark: var(--color-purple-1000);--color-background-accent-purple-100-hovered-dark: var(--color-purple-900);--color-background-accent-purple-100-pressed-dark: var(--color-purple-800);--color-background-accent-purple-200-light: var(--color-purple-200);--color-background-accent-purple-200-hovered-light: var(--color-purple-300);--color-background-accent-purple-200-pressed-light: var(--color-purple-400);--color-background-accent-purple-200-dark: var(--color-purple-900);--color-background-accent-purple-200-hovered-dark: var(--color-purple-800);--color-background-accent-purple-200-pressed-dark: var(--color-purple-700);--color-background-accent-purple-300-light: var(--color-purple-400);--color-background-accent-purple-300-hovered-light: var(--color-purple-300);--color-background-accent-purple-300-pressed-light: var(--color-purple-200);--color-background-accent-purple-300-dark: var(--color-purple-800);--color-background-accent-purple-300-hovered-dark: var(--color-purple-900);--color-background-accent-purple-300-pressed-dark: var(--color-purple-1000);--color-background-accent-purple-400-light: var(--color-purple-700);--color-background-accent-purple-400-hovered-light: var(--color-purple-800);--color-background-accent-purple-400-pressed-light: var(--color-purple-900);--color-background-accent-purple-400-dark: var(--color-purple-400);--color-background-accent-purple-400-hovered-dark: var(--color-purple-300);--color-background-accent-purple-400-pressed-dark: var(--color-purple-200);--color-background-accent-pink-100-light: var(--color-pink-100);--color-background-accent-pink-100-hovered-light: var(--color-pink-200);--color-background-accent-pink-100-pressed-light: var(--color-pink-300);--color-background-accent-pink-100-dark: var(--color-pink-1000);--color-background-accent-pink-100-hovered-dark: var(--color-pink-900);--color-background-accent-pink-100-pressed-dark: var(--color-pink-800);--color-background-accent-pink-200-light: var(--color-pink-200);--color-background-accent-pink-200-hovered-light: var(--color-pink-300);--color-background-accent-pink-200-pressed-light: var(--color-pink-400);--color-background-accent-pink-200-dark: var(--color-pink-900);--color-background-accent-pink-200-hovered-dark: var(--color-pink-800);--color-background-accent-pink-200-pressed-dark: var(--color-pink-700);--color-background-accent-pink-300-light: var(--color-pink-400);--color-background-accent-pink-300-hovered-light: var(--color-pink-300);--color-background-accent-pink-300-pressed-light: var(--color-pink-200);--color-background-accent-pink-300-dark: var(--color-pink-800);--color-background-accent-pink-300-hovered-dark: var(--color-pink-900);--color-background-accent-pink-300-pressed-dark: var(--color-pink-1000);--color-background-accent-pink-400-light: var(--color-pink-700);--color-background-accent-pink-400-hovered-light: var(--color-pink-800);--color-background-accent-pink-400-pressed-light: var(--color-pink-900);--color-background-accent-pink-400-dark: var(--color-pink-400);--color-background-accent-pink-400-hovered-dark: var(--color-pink-300);--color-background-accent-pink-400-pressed-dark: var(--color-pink-200);--color-text-light: var(--color-neutral-1000);--color-text-dark: var(--color-neutral-dark-1000);--color-text-subtle-light: var(--color-neutral-600);--color-text-subtle-dark: var(--color-neutral-dark-600);--color-text-subtler-light: var(--color-neutral-500);--color-text-subtler-dark: var(--color-neutral-dark-500);--color-text-brand-light: var(--color-brand-700);--color-text-brand-dark: var(--color-brand-400);--color-text-information-light: var(--color-blue-800);--color-text-information-dark: var(--color-blue-300);--color-text-success-light: var(--color-green-800);--color-text-success-dark: var(--color-green-300);--color-text-warning-light: var(--color-yellow-800);--color-text-warning-dark: var(--color-yellow-300);--color-text-danger-light: var(--color-red-800);--color-text-danger-dark: var(--color-red-300);--color-text-discovery-light: var(--color-purple-800);--color-text-discovery-dark: var(--color-purple-300);--color-text-disabled-light: var(--color-neutral-alpha-400);--color-text-disabled-dark: var(--color-neutral-dark-alpha-400);--color-text-selected-light: var(--color-blue-700);--color-text-selected-dark: var(--color-blue-400);--color-text-inverse-light: var(--color-neutral-0);--color-text-inverse-dark: var(--color-neutral-dark-100);--color-text-accent-gray-100-light: var(--color-neutral-800);--color-text-accent-gray-100-dark: var(--color-neutral-dark-800);--color-text-accent-gray-200-light: var(--color-neutral-1100);--color-text-accent-gray-200-dark: var(--color-neutral-dark-1100);--color-text-accent-blue-100-light: var(--color-blue-800);--color-text-accent-blue-100-dark: var(--color-blue-300);--color-text-accent-blue-200-light: var(--color-blue-900);--color-text-accent-blue-200-dark: var(--color-blue-200);--color-text-accent-green-100-light: var(--color-green-800);--color-text-accent-green-100-dark: var(--color-green-300);--color-text-accent-green-200-light: var(--color-green-900);--color-text-accent-green-200-dark: var(--color-green-200);--color-text-accent-orange-100-light: var(--color-orange-800);--color-text-accent-orange-100-dark: var(--color-orange-300);--color-text-accent-orange-200-light: var(--color-orange-900);--color-text-accent-orange-200-dark: var(--color-orange-200);--color-text-accent-red-100-light: var(--color-red-800);--color-text-accent-red-100-dark: var(--color-red-300);--color-text-accent-red-200-light: var(--color-red-900);--color-text-accent-red-200-dark: var(--color-red-200);--color-text-accent-yellow-100-light: var(--color-yellow-800);--color-text-accent-yellow-100-dark: var(--color-yellow-300);--color-text-accent-yellow-200-light: var(--color-yellow-900);--color-text-accent-yellow-200-dark: var(--color-yellow-200);--color-text-accent-teal-100-light: var(--color-teal-800);--color-text-accent-teal-100-dark: var(--color-teal-300);--color-text-accent-teal-200-light: var(--color-teal-900);--color-text-accent-teal-200-dark: var(--color-teal-200);--color-text-accent-purple-100-light: var(--color-purple-800);--color-text-accent-purple-100-dark: var(--color-purple-300);--color-text-accent-purple-200-light: var(--color-purple-900);--color-text-accent-purple-200-dark: var(--color-purple-200);--color-text-accent-pink-100-light: var(--color-pink-800);--color-text-accent-pink-100-dark: var(--color-pink-300);--color-text-accent-pink-200-light: var(--color-pink-900);--color-text-accent-pink-200-dark: var(--color-pink-200);--color-text-link-light: var(--color-blue-700);--color-text-link-dark: var(--color-blue-400);--color-text-link-pressed-light: var(--color-blue-800);--color-text-link-pressed-dark: var(--color-blue-300);--color-text-link-visited-light: var(--color-purple-800);--color-text-link-visited-dark: var(--color-purple-300);--color-text-link-visited-pressed-light: var(--color-purple-900);--color-text-link-visited-pressed-dark: var(--color-purple-200);--color-icon-light: var(--color-neutral-800);--color-icon-dark: var(--color-neutral-dark-800);--color-icon-subtle-light: var(--color-neutral-700);--color-icon-subtle-dark: var(--color-neutral-dark-700);--color-icon-subtler-light: var(--color-neutral-700);--color-icon-subtler-dark: var(--color-neutral-dark-700);--color-icon-brand-light: var(--color-brand-700);--color-icon-brand-dark: var(--color-brand-400);--color-icon-information-light: var(--color-blue-600);--color-icon-information-dark: var(--color-blue-500);--color-icon-success-light: var(--color-green-600);--color-icon-success-dark: var(--color-green-500);--color-icon-warning-light: var(--color-orange-600);--color-icon-warning-dark: var(--color-yellow-300);--color-icon-danger-light: var(--color-red-700);--color-icon-danger-dark: var(--color-red-500);--color-icon-discovery-light: var(--color-purple-600);--color-icon-discovery-dark: var(--color-purple-500);--color-icon-disabled-light: var(--color-neutral-alpha-400);--color-icon-disabled-dark: var(--color-neutral-dark-alpha-400);--color-icon-selected-light: var(--color-blue-700);--color-icon-selected-dark: var(--color-blue-400);--color-icon-inverse-light: var(--color-neutral-0);--color-icon-inverse-dark: var(--color-neutral-dark-100);--color-icon-accent-gray-light: var(--color-neutral-600);--color-icon-accent-gray-dark: var(--color-neutral-dark-600);--color-icon-accent-blue-light: var(--color-blue-600);--color-icon-accent-blue-dark: var(--color-blue-500);--color-icon-accent-green-light: var(--color-green-600);--color-icon-accent-green-dark: var(--color-green-500);--color-icon-accent-orange-light: var(--color-orange-600);--color-icon-accent-orange-dark: var(--color-orange-500);--color-icon-accent-red-light: var(--color-red-700);--color-icon-accent-red-dark: var(--color-red-600);--color-icon-accent-yellow-light: var(--color-yellow-600);--color-icon-accent-yellow-dark: var(--color-yellow-300);--color-icon-accent-teal-light: var(--color-teal-600);--color-icon-accent-teal-dark: var(--color-teal-500);--color-icon-accent-purple-light: var(--color-purple-600);--color-icon-accent-purple-dark: var(--color-purple-500);--color-icon-accent-pink-light: var(--color-pink-600);--color-icon-accent-pink-dark: var(--color-pink-500);--color-border-100-light: var(--color-neutral-alpha-300);--color-border-100-dark: var(--color-neutral-dark-alpha-300);--color-border-200-light: var(--color-neutral-600);--color-border-200-dark: var(--color-neutral-dark-600);--color-border-brand-light: var(--color-brand-700);--color-border-brand-dark: var(--color-brand-400);--color-border-information-light: var(--color-blue-600);--color-border-information-dark: var(--color-blue-500);--color-border-success-light: var(--color-green-600);--color-border-success-dark: var(--color-green-500);--color-border-warning-light: var(--color-orange-600);--color-border-warning-dark: var(--color-yellow-500);--color-border-danger-light: var(--color-red-600);--color-border-danger-dark: var(--color-red-500);--color-border-discovery-light: var(--color-purple-600);--color-border-discovery-dark: var(--color-purple-500);--color-border-disabled-light: var(--color-neutral-alpha-200);--color-border-disabled-dark: var(--color-neutral-dark-alpha-200);--color-border-focused-light: var(--color-blue-500);--color-border-focused-dark: var(--color-blue-300);--color-border-selected-light: var(--color-blue-700);--color-border-selected-dark: var(--color-blue-400);--color-border-input-light: var(--color-neutral-300);--color-border-input-dark: var(--color-neutral-dark-400);--color-border-input-disabled-light: var(--color-neutral-alpha-200);--color-border-input-disabled-dark: var(--color-neutral-dark-alpha-200);--color-border-inverse-light: var(--color-neutral-0);--color-border-inverse-dark: var(--color-neutral-dark-0);--color-border-accent-gray-light: var(--color-neutral-600);--color-border-accent-gray-dark: var(--color-neutral-dark-600);--color-border-accent-blue-light: var(--color-blue-600);--color-border-accent-blue-dark: var(--color-blue-500);--color-border-accent-green-light: var(--color-green-600);--color-border-accent-green-dark: var(--color-green-500);--color-border-accent-orange-light: var(--color-orange-600);--color-border-accent-orange-dark: var(--color-orange-500);--color-border-accent-red-light: var(--color-red-600);--color-border-accent-red-dark: var(--color-red-500);--color-border-accent-yellow-light: var(--color-yellow-600);--color-border-accent-yellow-dark: var(--color-yellow-500);--color-border-accent-teal-light: var(--color-teal-600);--color-border-accent-teal-dark: var(--color-teal-500);--color-border-accent-purple-light: var(--color-purple-600);--color-border-accent-purple-dark: var(--color-purple-500);--color-border-accent-pink-light: var(--color-pink-600);--color-border-accent-pink-dark: var(--color-pink-500);--color-overlay-light: var(--color-neutral-alpha-500);--color-overlay-dark: var(--color-neutral-dark-alpha-500);--color-skeleton-100-light: var(--color-neutral-alpha-100);--color-skeleton-100-dark: var(--color-neutral-dark-alpha-100);--color-skeleton-200-light: var(--color-neutral-alpha-200);--color-skeleton-200-dark: var(--color-neutral-dark-alpha-200)}.theme{--color-background-brand-100-light: var(--color-brand-100);--color-background-brand-100-hovered-light: var(--color-brand-200);--color-background-brand-100-pressed-light: var(--color-brand-300);--color-background-brand-100-dark: var(--color-brand-1000);--color-background-brand-100-hovered-dark: var(--color-brand-900);--color-background-brand-100-pressed-dark: var(--color-brand-800);--color-background-brand-200-light: var(--color-brand-700);--color-background-brand-200-hovered-light: var(--color-brand-800);--color-background-brand-200-pressed-light: var(--color-brand-900);--color-background-brand-200-dark: var(--color-brand-400);--color-background-brand-200-hovered-dark: var(--color-brand-300);--color-background-brand-200-pressed-dark: var(--color-brand-200);--color-background-brand-300-light: var(--color-brand-1000);--color-background-brand-300-hovered-light: var(--color-brand-900);--color-background-brand-300-pressed-light: var(--color-brand-800);--color-background-brand-300-dark: var(--color-brand-100);--color-background-brand-300-hovered-dark: var(--color-brand-200);--color-background-brand-300-pressed-dark: var(--color-brand-300);--color-text-brand-light: var(--color-brand-700);--color-text-brand-dark: var(--color-brand-400);--color-icon-brand-light: var(--color-brand-700);--color-icon-brand-dark: var(--color-brand-400);--color-border-brand-light: var(--color-brand-700);--color-border-brand-dark: var(--color-brand-400)}:root{--elevation-raised-light: var(--color-neutral-alpha-400) 0px 1px 1px, var(--color-neutral-alpha-500) 0px 0px 1px;--elevation-raised-dark: var(--color-neutral-dark-alpha-300) 0px 1px 1px, var(--color-neutral-dark-alpha-400) 0px 0px 1px;--elevation-overlay-light: var(--color-neutral-alpha-400) 0px 8px 12px 0px, var(--color-neutral-alpha-500) 0px 0px 1px 0px;--elevation-overlay-dark: var(--color-neutral-dark-alpha-200) 0px 0px 0px 1px, var(--color-neutral-dark-alpha-0) 0px 8px 12px 0px, var(--color-neutral-dark-alpha-100) 0px 0px 1px 1px;--elevation-avatar-light: inset 0 0 10px var(--color-neutral-alpha-100);--elevation-avatar-dark: inset 0 0 10px var(--color-neutral-dark-alpha-100)}:root{--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-family-code: ui-monospace, SFMono-Medium, "SF Mono", "Segoe UI Mono", "Roboto Mono", "Ubuntu Mono", Menlo, monospace;--font-style-normal: normal;--font-style-italic: italic;--font-size-default: var(--font-size-14);--font-size-12: 12px;--font-size-13: 13px;--font-size-14: 14px;--font-size-15: 15px;--font-size-16: 16px;--font-size-18: 18px;--font-size-20: 20px;--font-size-24: 24px;--font-size-28: 28px;--font-size-30: 30px;--font-size-32: 32px;--font-size-36: 36px;--font-size-48: 48px;--font-size-60: 60px;--font-size-72: 72px;--font-weight-thin: 100;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-weight-black: 900}:root{--layer-card: 100;--layer-navigation: 200;--layer-dialog: 300;--layer-overlay: 400;--layer-modal: 500;--layer-flag: 600;--layer-spotlight: 700;--layer-tooltip: 800}:root{--size-0: 0px;--size-2: 2px;--size-4: 4px;--size-6: 6px;--size-8: 8px;--size-12: 12px;--size-16: 16px;--size-20: 20px;--size-24: 24px;--size-32: 32px;--size-40: 40px;--size-48: 48px;--size-64: 64px;--size-80: 80px;--size-96: 96px;--size-128: 128px;--size-192: 192px;--size-256: 256px;--size-384: 384px;--size-512: 512px;--size-640: 640px;--size-768: 768px;--size-896: 896px;--size-1024: 1024px;--size-1152: 1152px;--size-1280: 1280px;--size-1408: 1408px;--size-1536: 1536px;--size-1664: 1664px;--size-1792: 1792px;--size-1920: 1920px}:root{--transition-100ms-ease-out: .1s ease-out;--transition-100ms-ease-in-out: .1s ease-in-out;--transition-200ms-ease-in: .2s ease-in;--transition-200ms-ease-in-out: .2s ease-in-out}html,body,p,div,h1,h2,h3,h4,h5,h6,ul,ol,dl,img,pre,form,fieldset{margin:var(--size-0);padding:var(--size-0)}img,fieldset{border:var(--size-0)}body,html,#app{height:100%;width:100%}body{background-color:var(--color-background-surface-light);color:var(--color-text-light);font-family:var(--font-family);font-size:var(--font-size-14);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:20px}input,select,textarea,button{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:25px}p,ul,ol,dl,h1,h2,h3,h4,h5,h6,blockquote,pre,form,table{margin:calc(var(--grid-size) * 2px) var(--size-0) var(--size-0) var(--size-0)}a{color:var(--color-text-link-light);text-decoration:var(--link-text-decoration-default);border-radius:var(--border-width);cursor:pointer;transition:color var(--transition-100ms-ease-in-out),background-color var(--transition-100ms-ease-in-out)}a:hover{text-decoration:var(--link-text-decoration-hover)}a:active{color:var(--color-text-link-pressed-light)}a:visited{color:var(--color-text-link-visited-light)}a.visited:active{color:var(--color-text-link-visited-pressed-light)}h1{font-size:var(--font-size-28);font-style:var(--font-style-normal);line-height:32px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] h1{color:var(--color-text-dark)}h1:first-child{margin-top:var(--size-0)}h2{font-size:var(--font-size-24);font-style:var(--font-style-normal);line-height:28px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] h2{color:var(--color-text-dark)}h2:first-child{margin-top:var(--size-0)}h3{font-size:var(--font-size-20);font-style:var(--font-style-normal);line-height:24px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3.5px)}[dark-mode=true] h3{color:var(--color-text-dark)}h3:first-child{margin-top:var(--size-0)}h4{font-size:var(--font-size-16);font-style:var(--font-style-normal);line-height:20px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3px)}[dark-mode=true] h4{color:var(--color-text-dark)}h4:first-child{margin-top:var(--size-0)}h5{font-size:var(--font-size-14);font-style:var(--font-style-normal);line-height:20px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] h5{color:var(--color-text-dark)}h5:first-child{margin-top:var(--size-0)}h6{font-size:var(--font-size-12);font-style:var(--font-style-normal);line-height:16px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px)}[dark-mode=true] h6{color:var(--color-text-dark)}h6:first-child{margin-top:var(--size-0)}ul,ol,dl{padding-left:calc(var(--grid-size) * 5px)}dd,dd+dt,li+li{margin-top:calc(var(--grid-size) / 2px)}ul ul:not(:first-child),ol ul:not(:first-child),ul ol:not(:first-child),ol ol:not(:first-child){margin-top:calc(var(--grid-size) / 2px)}p:first-child,ul:first-child,ol:first-child,dl:first-child,h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child,blockquote:first-child,pre:first-child,form:first-child,table:first-child{margin-top:var(--size-0)}:focus{outline:none;box-shadow:var(--size-0) var(--size-0) var(--size-0) var(--focus-outline-width) var(--color-border-focused-light)}[data-whatintent=mouse] :focus{outline:none;box-shadow:none}table{border-collapse:collapse;width:100%}thead,tbody,tfoot{border-bottom:var(--border-width) solid var(--color-border-100-light)}td,th{border:none;padding:calc((var(--grid-size) / 2) * 1px) calc(var(--grid-size) * 1px);text-align:left}th{font-size:var(--font-size-12);font-style:var(--font-style-normal);line-height:16px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px);line-height:inherit}[dark-mode=true] th{color:var(--color-text-dark)}th:first-child{margin-top:var(--size-0)}td:first-child,th:first-child{padding-left:var(--size-0)}td:last-child,th:last-child{padding-right:var(--size-0)}tr{transition:background .1s ease-out,box-shadow .15s cubic-bezier(.47,.03,.49,1.38)}tbody tr:hover{background-color:var(--color-background-surface-hovered-light)}hr{background-color:var(--color-border-100-light);height:2px;border-style:none;margin:var(--size-40) var(--size-0)}pre{font-family:var(--font-family-code);white-space:pre-wrap;padding:var(--size-24) var(--size-32);border-radius:var(--border-radius-regular);background:var(--color-background-surface-sunken-light);font-size:var(--font-size-12);line-height:23px;overflow-x:auto}code{font-family:var(--font-family-code);padding:var(--size-0);font-size:var(--font-size-12)}p code{font-family:var(--font-family-code);padding:var(--size-0) var(--size-8);border-radius:var(--border-radius-regular);background:var(--color-background-surface-sunken-light);font-size:var(--font-size-14)}blockquote{white-space:pre-wrap;border-left:var(--border-width-3) solid var(--color-border-100-light);padding-left:var(--size-8);font-style:var(--font-style-italic)}caption{font-size:var(--font-size-20);font-style:var(--font-style-normal);line-height:24px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3.5px);margin-bottom:var(--size-8);text-align:left}[dark-mode=true] caption{color:var(--color-text-dark)}caption:first-child{margin-top:var(--size-0)}[dark-mode=true] body{background-color:var(--color-background-surface-dark);color:var(--color-text-dark)}[dark-mode=true] a{color:var(--color-text-link-dark)}[dark-mode=true] a:active{color:var(--color-text-link-pressed-dark)}[dark-mode=true] a:visited{color:var(--color-text-link-visited-dark)}[dark-mode=true] a.visited:active{color:var(--color-text-link-visited-pressed-dark)}[dark-mode=true] :focus{outline:none;box-shadow:var(--size-0) var(--size-0) var(--size-0) var(--focus-outline-width) var(--color-border-focused-dark)}[dark-mode=true] thead,[dark-mode=true] tbody,[dark-mode=true] tfoot{border-bottom:var(--border-width) solid var(--color-border-100-dark)}[dark-mode=true] tbody tr:hover{background-color:var(--color-background-surface-hovered-dark)}[dark-mode=true] hr{background-color:var(--color-border-100-dark)}[dark-mode=true] pre,[dark-mode=true] p code{background:var(--color-background-surface-sunken-dark)}[dark-mode=true] blockquote{border-left:var(--border-width-3) solid var(--color-border-100-dark)}[dark-mode=true][data-whatintent=mouse] :focus{outline:none;box-shadow:none}:root{--grid-size: 8;--focus-outline-width: 2px;--link-text-decoration-default: none;--link-text-decoration-hover: underline}.heading-xxlarge{font-size:var(--font-size-32);font-style:var(--font-style-normal);line-height:36px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 6.5px)}[dark-mode=true] .heading-xxlarge{color:var(--color-text-dark)}.heading-xxlarge:first-child{margin-top:var(--size-0)}.heading-xlarge{font-size:var(--font-size-28);font-style:var(--font-style-normal);line-height:32px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] .heading-xlarge{color:var(--color-text-dark)}.heading-xlarge:first-child{margin-top:var(--size-0)}.heading-large{font-size:var(--font-size-24);font-style:var(--font-style-normal);line-height:28px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] .heading-large{color:var(--color-text-dark)}.heading-large:first-child{margin-top:var(--size-0)}.heading-medium{font-size:var(--font-size-20);font-style:var(--font-style-normal);line-height:24px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3.5px)}[dark-mode=true] .heading-medium{color:var(--color-text-dark)}.heading-medium:first-child{margin-top:var(--size-0)}.heading-small{font-size:var(--font-size-16);font-style:var(--font-style-normal);line-height:20px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3px)}[dark-mode=true] .heading-small{color:var(--color-text-dark)}.heading-small:first-child{margin-top:var(--size-0)}.heading-xsmall{font-size:var(--font-size-14);font-style:var(--font-style-normal);line-height:20px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] .heading-xsmall{color:var(--color-text-dark)}.heading-xsmall:first-child{margin-top:var(--size-0)}.heading-xxsmall{font-size:var(--font-size-12);font-style:var(--font-style-normal);line-height:16px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px)}[dark-mode=true] .heading-xxsmall{color:var(--color-text-dark)}.heading-xxsmall:first-child{margin-top:var(--size-0)}.text{font-size:var(--font-size-14);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:20px}.text-large{font-size:var(--font-size-16);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:24px}.text-small{font-size:var(--font-size-12);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:16px}.text-intro{font-size:20px;font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:32px}.text-caption{font-size:var(--font-size-12);font-weight:var(--font-weight-regular);display:block;line-height:18px;color:var(--color-text-subtle-light)}[dark-mode=true] .text-caption{color:var(--placeholder-color-dark)}.text-caption-bold{font-size:var(--font-size-12);font-weight:var(--font-weight-semibold)}.text-prominent{font-size:var(--font-size-default);font-weight:var(--font-weight-semibold)}.error{color:var(--color-text-danger-light)}[dark-mode=true] .error{color:var(--color-text-danger-dark)}.theme-switcher-divider[data-v-bcbc87cb]{margin:4px 0}
1
+ :root{--border-radius-regular: 3px;--border-radius-large: 6px;--border-width: var(--border-width-2);--border-width-1: 1px;--border-width-2: 2px;--border-width-3: 3px}:root{--color-neutral-0: oklch(1 0 250);--color-neutral-100: oklch(.976 0 250);--color-neutral-200: oklch(.95 .002 250);--color-neutral-300: oklch(.9 .004 250);--color-neutral-400: oklch(.8 .006 250);--color-neutral-500: oklch(.68 .008 250);--color-neutral-600: oklch(.58 .01 250);--color-neutral-700: oklch(.5 .012 250);--color-neutral-800: oklch(.4 .012 250);--color-neutral-900: oklch(.3 .01 250);--color-neutral-1000: oklch(.2 .008 250);--color-neutral-1100: oklch(.1 .004 250);--color-neutral-dark-0: oklch(0 .0015 250);--color-neutral-dark-100: oklch(.15 .0045 250);--color-neutral-dark-200: oklch(.18 .005 250);--color-neutral-dark-300: oklch(.25 .006 250);--color-neutral-dark-400: oklch(.33 .008 250);--color-neutral-dark-500: oklch(.42 .009 250);--color-neutral-dark-600: oklch(.52 .01 250);--color-neutral-dark-700: oklch(.63 .01 250);--color-neutral-dark-800: oklch(.74 .009 250);--color-neutral-dark-900: oklch(.83 .007 250);--color-neutral-dark-1000: oklch(.9 .005 250);--color-neutral-dark-1100: oklch(.98 .003 250);--color-neutral-alpha-100: oklch(.6 .012 250 / 3%);--color-neutral-alpha-200: oklch(.6 .012 250 / 8%);--color-neutral-alpha-300: oklch(.6 .012 250 / 14%);--color-neutral-alpha-400: oklch(.6 .012 250 / 29%);--color-neutral-alpha-500: oklch(.6 .012 250 / 55%);--color-neutral-dark-alpha-0: oklch(.0993 .0115 195.47 / 46%);--color-neutral-dark-alpha-100: oklch(.9 .02 250 / 4%);--color-neutral-dark-alpha-200: oklch(.9 .02 250 / 7%);--color-neutral-dark-alpha-300: oklch(.9 .02 250 / 12%);--color-neutral-dark-alpha-400: oklch(.9 .02 250 / 25%);--color-neutral-dark-alpha-500: oklch(.9 .02 250 / 45%);--color-brand-seed: var(--color-blue-600);--color-brand-100: var(--color-blue-100);--color-brand-200: var(--color-blue-200);--color-brand-300: var(--color-blue-300);--color-brand-400: var(--color-blue-400);--color-brand-500: var(--color-blue-500);--color-brand-600: var(--color-blue-600);--color-brand-700: var(--color-blue-700);--color-brand-800: var(--color-blue-800);--color-brand-900: var(--color-blue-900);--color-brand-1000: var(--color-blue-1000);--color-brand-surface-soft-light: var(--color-blue-100);--color-brand-surface-soft-hovered-light: var(--color-blue-200);--color-brand-surface-soft-pressed-light: var(--color-blue-300);--color-brand-surface-soft-dark: var(--color-blue-1000);--color-brand-surface-soft-hovered-dark: var(--color-blue-900);--color-brand-surface-soft-pressed-dark: var(--color-blue-800);--color-brand-surface-subtle-light: var(--color-blue-200);--color-brand-surface-subtle-dark: var(--color-blue-900);--color-brand-surface-strong-light: var(--color-blue-600);--color-brand-surface-strong-hovered-light: var(--color-blue-700);--color-brand-surface-strong-pressed-light: var(--color-blue-800);--color-brand-surface-strong-dark: var(--color-blue-400);--color-brand-surface-strong-hovered-dark: var(--color-blue-300);--color-brand-surface-strong-pressed-dark: var(--color-blue-200);--color-brand-on-soft-light: var(--color-blue-600);--color-brand-on-soft-dark: var(--color-blue-400);--color-brand-on-subtle-light: var(--color-blue-700);--color-brand-on-subtle-dark: var(--color-blue-300);--color-brand-on-strong-light: var(--color-neutral-0);--color-brand-on-strong-dark: var(--color-neutral-dark-100);--color-brand-text-light: var(--color-brand-surface-strong-light);--color-brand-text-dark: var(--color-brand-surface-strong-dark);--color-brand-icon-light: var(--color-brand-surface-strong-light);--color-brand-icon-dark: var(--color-brand-surface-strong-dark);--color-brand-border-light: var(--color-brand-surface-strong-light);--color-brand-border-dark: var(--color-brand-surface-strong-dark);--color-blue-100: oklch(.82 .09 257.4);--color-blue-200: oklch(.78 .11 257.4);--color-blue-300: oklch(.74 .13 257.4);--color-blue-400: oklch(.7 .15 257.4);--color-blue-500: oklch(.66 .17 257.4);--color-blue-600: oklch(.62 .19 257.4);--color-blue-700: oklch(.58 .21 257.4);--color-blue-800: oklch(.54 .22 257.4);--color-blue-900: oklch(.5 .23 257.4);--color-blue-1000: oklch(.46 .24 257.4);--color-green-100: oklch(.82 .07 160.83);--color-green-200: oklch(.79 .082 160.83);--color-green-300: oklch(.76 .094 160.83);--color-green-400: oklch(.73 .106 160.83);--color-green-500: oklch(.7 .118 160.83);--color-green-600: oklch(.66 .13 160.83);--color-green-700: oklch(.62 .142 160.83);--color-green-800: oklch(.58 .148 160.83);--color-green-900: oklch(.54 .154 160.83);--color-green-1000: oklch(.5 .16 160.83);--color-orange-100: oklch(.86 .09 73.79);--color-orange-200: oklch(.82 .105 73.79);--color-orange-300: oklch(.78 .12 73.79);--color-orange-400: oklch(.74 .135 73.79);--color-orange-500: oklch(.7 .15 73.79);--color-orange-600: oklch(.66 .165 73.79);--color-orange-700: oklch(.62 .18 73.79);--color-orange-800: oklch(.58 .19 73.79);--color-orange-900: oklch(.54 .2 73.79);--color-orange-1000: oklch(.5 .21 73.79);--color-red-100: oklch(.8 .1 34.02);--color-red-200: oklch(.76 .118 34.02);--color-red-300: oklch(.72 .136 34.02);--color-red-400: oklch(.68 .154 34.02);--color-red-500: oklch(.64 .172 34.02);--color-red-600: oklch(.6 .19 34.02);--color-red-700: oklch(.56 .208 34.02);--color-red-800: oklch(.52 .218 34.02);--color-red-900: oklch(.48 .228 34.02);--color-red-1000: oklch(.44 .238 34.02);--color-yellow-100: oklch(.94 .08 95.2);--color-yellow-200: oklch(.9 .092 95.2);--color-yellow-300: oklch(.86 .104 95.2);--color-yellow-400: oklch(.82 .116 95.2);--color-yellow-500: oklch(.78 .128 95.2);--color-yellow-600: oklch(.74 .14 95.2);--color-yellow-700: oklch(.7 .152 95.2);--color-yellow-800: oklch(.66 .164 95.2);--color-yellow-900: oklch(.62 .176 95.2);--color-yellow-1000: oklch(.58 .188 95.2);--color-teal-100: oklch(.82 .08 200.6);--color-teal-200: oklch(.78 .094 200.6);--color-teal-300: oklch(.74 .108 200.6);--color-teal-400: oklch(.7 .122 200.6);--color-teal-500: oklch(.66 .136 200.6);--color-teal-600: oklch(.62 .15 200.6);--color-teal-700: oklch(.58 .164 200.6);--color-teal-800: oklch(.54 .178 200.6);--color-teal-900: oklch(.5 .19 200.6);--color-teal-1000: oklch(.46 .202 200.6);--color-purple-100: oklch(.8 .09 308.4);--color-purple-200: oklch(.76 .106 308.4);--color-purple-300: oklch(.72 .122 308.4);--color-purple-400: oklch(.68 .138 308.4);--color-purple-500: oklch(.64 .154 308.4);--color-purple-600: oklch(.6 .17 308.4);--color-purple-700: oklch(.56 .186 308.4);--color-purple-800: oklch(.52 .198 308.4);--color-purple-900: oklch(.48 .21 308.4);--color-purple-1000: oklch(.44 .222 308.4);--color-pink-100: oklch(.84 .1 21.6);--color-pink-200: oklch(.8 .116 21.6);--color-pink-300: oklch(.76 .132 21.6);--color-pink-400: oklch(.72 .148 21.6);--color-pink-500: oklch(.68 .164 21.6);--color-pink-600: oklch(.64 .18 21.6);--color-pink-700: oklch(.6 .196 21.6);--color-pink-800: oklch(.56 .208 21.6);--color-pink-900: oklch(.52 .22 21.6);--color-pink-1000: oklch(.48 .232 21.6);--color-background-surface-light: var(--color-neutral-0);--color-background-surface-dark: var(--color-neutral-dark-100);--color-background-surface-hovered-light: var(--color-neutral-200);--color-background-surface-hovered-dark: var(--color-neutral-dark-200);--color-background-surface-pressed-light: var(--color-neutral-300);--color-background-surface-pressed-dark: var(--color-neutral-dark-300);--color-background-surface-overlay-light: var(--color-neutral-0);--color-background-surface-overlay-dark: var(--color-neutral-dark-200);--color-background-surface-overlay-hovered-light: var(--color-neutral-200);--color-background-surface-overlay-hovered-dark: var( --color-neutral-dark-300 );--color-background-surface-overlay-pressed-light: var(--color-neutral-300);--color-background-surface-overlay-pressed-dark: var( --color-neutral-dark-400 );--color-background-surface-raised-light: var(--color-neutral-0);--color-background-surface-raised-dark: var(--color-neutral-dark-200);--color-background-surface-raised-hovered-light: var(--color-neutral-200);--color-background-surface-raised-hovered-dark: var( --color-neutral-dark-300 );--color-background-surface-raised-pressed-light: var(--color-neutral-300);--color-background-surface-raised-pressed-dark: var( --color-neutral-dark-300 );--color-background-surface-sunken-light: var(--color-neutral-100);--color-background-surface-sunken-dark: var(--color-neutral-dark-0);--color-background-neutral-light: var(--color-neutral-alpha-200);--color-background-neutral-hovered-light: var(--color-neutral-alpha-300);--color-background-neutral-pressed-light: var(--color-neutral-alpha-400);--color-background-neutral-dark: var(--color-neutral-dark-alpha-200);--color-background-neutral-hovered-dark: var( --color-neutral-dark-alpha-300 );--color-background-neutral-pressed-dark: var( --color-neutral-dark-alpha-400 );--color-background-neutral-subtle-light: transparent;--color-background-neutral-subtle-hovered-light: var( --color-neutral-alpha-200 );--color-background-neutral-subtle-pressed-light: var( --color-neutral-alpha-300 );--color-background-neutral-subtle-dark: transparent;--color-background-neutral-subtle-hovered-dark: var( --color-neutral-dark-alpha-200 );--color-background-neutral-subtle-pressed-dark: var( --color-neutral-dark-alpha-300 );--color-background-neutral-bold-light: var(--color-neutral-800);--color-background-neutral-bold-hovered-light: var(--color-neutral-900);--color-background-neutral-bold-pressed-light: var(--color-neutral-1100);--color-background-neutral-bold-dark: var(--color-neutral-dark-800);--color-background-neutral-bold-hovered-dark: var(--color-neutral-dark-900);--color-background-neutral-bold-pressed-dark: var( --color-neutral-dark-1100 );--color-background-brand-100-light: var(--color-brand-surface-soft-light);--color-background-brand-100-hovered-light: var( --color-brand-surface-soft-hovered-light );--color-background-brand-100-pressed-light: var( --color-brand-surface-soft-pressed-light );--color-background-brand-100-dark: var(--color-brand-surface-soft-dark);--color-background-brand-100-hovered-dark: var( --color-brand-surface-soft-hovered-dark );--color-background-brand-100-pressed-dark: var( --color-brand-surface-soft-pressed-dark );--color-background-brand-200-light: var(--color-brand-surface-strong-light);--color-background-brand-200-hovered-light: var( --color-brand-surface-strong-hovered-light );--color-background-brand-200-pressed-light: var( --color-brand-surface-strong-pressed-light );--color-background-brand-200-dark: var(--color-brand-surface-strong-dark);--color-background-brand-200-hovered-dark: var( --color-brand-surface-strong-hovered-dark );--color-background-brand-200-pressed-dark: var( --color-brand-surface-strong-pressed-dark );--color-background-brand-300-light: var(--color-brand-on-soft-light);--color-background-brand-300-hovered-light: var(--color-brand-border-light);--color-background-brand-300-pressed-light: var( --color-brand-surface-strong-light );--color-background-brand-300-dark: var(--color-brand-on-soft-dark);--color-background-brand-300-hovered-dark: var(--color-brand-border-dark);--color-background-brand-300-pressed-dark: var( --color-brand-surface-strong-dark );--color-background-information-100-light: var(--color-blue-100);--color-background-information-100-hovered-light: var(--color-blue-200);--color-background-information-100-pressed-light: var(--color-blue-300);--color-background-information-100-dark: var(--color-blue-1000);--color-background-information-100-hovered-dark: var(--color-blue-900);--color-background-information-100-pressed-dark: var(--color-blue-800);--color-background-information-200-light: var(--color-blue-700);--color-background-information-200-hovered-light: var(--color-blue-800);--color-background-information-200-pressed-light: var(--color-blue-900);--color-background-information-200-dark: var(--color-blue-400);--color-background-information-200-hovered-dark: var(--color-blue-300);--color-background-information-200-pressed-dark: var(--color-blue-200);--color-background-success-100-light: var(--color-green-100);--color-background-success-100-hovered-light: var(--color-green-200);--color-background-success-100-pressed-light: var(--color-green-300);--color-background-success-100-dark: var(--color-green-1000);--color-background-success-100-hovered-dark: var(--color-green-900);--color-background-success-100-pressed-dark: var(--color-green-800);--color-background-success-200-light: var(--color-green-700);--color-background-success-200-hovered-light: var(--color-green-800);--color-background-success-200-pressed-light: var(--color-green-900);--color-background-success-200-dark: var(--color-green-400);--color-background-success-200-hovered-dark: var(--color-green-300);--color-background-success-200-pressed-dark: var(--color-green-200);--color-background-warning-100-light: var(--color-yellow-100);--color-background-warning-100-hovered-light: var(--color-yellow-200);--color-background-warning-100-pressed-light: var(--color-yellow-300);--color-background-warning-100-dark: var(--color-yellow-1000);--color-background-warning-100-hovered-dark: var(--color-yellow-900);--color-background-warning-100-pressed-dark: var(--color-yellow-800);--color-background-warning-200-light: var(--color-yellow-300);--color-background-warning-200-hovered-light: var(--color-yellow-400);--color-background-warning-200-pressed-light: var(--color-yellow-500);--color-background-warning-200-dark: var(--color-yellow-300);--color-background-warning-200-hovered-dark: var(--color-yellow-400);--color-background-warning-200-pressed-dark: var(--color-yellow-500);--color-background-danger-100-light: var(--color-red-100);--color-background-danger-100-hovered-light: var(--color-red-200);--color-background-danger-100-pressed-light: var(--color-red-300);--color-background-danger-100-dark: var(--color-red-1000);--color-background-danger-100-hovered-dark: var(--color-red-900);--color-background-danger-100-pressed-dark: var(--color-red-800);--color-background-danger-200-light: var(--color-red-700);--color-background-danger-200-hovered-light: var(--color-red-800);--color-background-danger-200-pressed-light: var(--color-red-900);--color-background-danger-200-dark: var(--color-red-400);--color-background-danger-200-hovered-dark: var(--color-red-300);--color-background-danger-200-pressed-dark: var(--color-red-200);--color-background-discovery-100-light: var(--color-purple-100);--color-background-discovery-100-hovered-light: var(--color-purple-200);--color-background-discovery-100-pressed-light: var(--color-purple-300);--color-background-discovery-100-dark: var(--color-purple-1000);--color-background-discovery-100-hovered-dark: var(--color-purple-900);--color-background-discovery-100-pressed-dark: var(--color-purple-800);--color-background-discovery-200-light: var(--color-purple-700);--color-background-discovery-200-hovered-light: var(--color-purple-800);--color-background-discovery-200-pressed-light: var(--color-purple-900);--color-background-discovery-200-dark: var(--color-purple-400);--color-background-discovery-200-hovered-dark: var(--color-purple-300);--color-background-discovery-200-pressed-dark: var(--color-purple-200);--color-background-disabled-light: var(--color-neutral-alpha-100);--color-background-disabled-dark: var(--color-neutral-dark-alpha-100);--color-background-selected-100-light: var(--color-blue-100);--color-background-selected-100-hovered-light: var(--color-blue-200);--color-background-selected-100-pressed-light: var(--color-blue-300);--color-background-selected-100-dark: var(--color-blue-1000);--color-background-selected-100-hovered-dark: var(--color-blue-900);--color-background-selected-100-pressed-dark: var(--color-blue-800);--color-background-selected-200-light: var(--color-blue-700);--color-background-selected-200-hovered-light: var(--color-blue-800);--color-background-selected-200-pressed-light: var(--color-blue-900);--color-background-selected-200-dark: var(--color-blue-400);--color-background-selected-200-hovered-dark: var(--color-blue-300);--color-background-selected-200-pressed-dark: var(--color-blue-200);--color-background-input-light: var(--color-neutral-0);--color-background-input-hovered-light: var(--color-neutral-100);--color-background-input-pressed-light: var(--color-neutral-0);--color-background-input-dark: var(--color-neutral-dark-200);--color-background-input-hovered-dark: var(--color-neutral-dark-300);--color-background-input-pressed-dark: var(--color-neutral-dark-200);--color-background-accent-gray-100-light: var(--color-neutral-200);--color-background-accent-gray-100-hovered-light: var(--color-neutral-300);--color-background-accent-gray-100-pressed-light: var(--color-neutral-400);--color-background-accent-gray-100-dark: var(--color-neutral-dark-300);--color-background-accent-gray-100-hovered-dark: var( --color-neutral-dark-400 );--color-background-accent-gray-100-pressed-dark: var( --color-neutral-dark-500 );--color-background-accent-gray-200-light: var(--color-neutral-300);--color-background-accent-gray-200-hovered-light: var(--color-neutral-400);--color-background-accent-gray-200-pressed-light: var(--color-neutral-500);--color-background-accent-gray-200-dark: var(--color-neutral-dark-400);--color-background-accent-gray-200-hovered-dark: var( --color-neutral-dark-500 );--color-background-accent-gray-200-pressed-dark: var( --color-neutral-dark-600 );--color-background-accent-gray-300-light: var(--color-neutral-500);--color-background-accent-gray-300-hovered-light: var(--color-neutral-400);--color-background-accent-gray-300-pressed-light: var(--color-neutral-300);--color-background-accent-gray-300-dark: var(--color-neutral-dark-500);--color-background-accent-gray-300-hovered-dark: var( --color-neutral-dark-400 );--color-background-accent-gray-300-pressed-dark: var( --color-neutral-dark-300 );--color-background-accent-gray-400-light: var(--color-neutral-700);--color-background-accent-gray-400-hovered-light: var(--color-neutral-800);--color-background-accent-gray-400-pressed-light: var(--color-neutral-900);--color-background-accent-gray-400-dark: var(--color-neutral-dark-700);--color-background-accent-gray-400-hovered-dark: var( --color-neutral-dark-800 );--color-background-accent-gray-400-pressed-dark: var( --color-neutral-dark-900 );--color-background-accent-blue-100-light: var(--color-blue-100);--color-background-accent-blue-100-hovered-light: var(--color-blue-200);--color-background-accent-blue-100-pressed-light: var(--color-blue-300);--color-background-accent-blue-100-dark: var(--color-blue-1000);--color-background-accent-blue-100-hovered-dark: var(--color-blue-900);--color-background-accent-blue-100-pressed-dark: var(--color-blue-800);--color-background-accent-blue-200-light: var(--color-blue-200);--color-background-accent-blue-200-hovered-light: var(--color-blue-300);--color-background-accent-blue-200-pressed-light: var(--color-blue-400);--color-background-accent-blue-200-dark: var(--color-blue-900);--color-background-accent-blue-200-hovered-dark: var(--color-blue-800);--color-background-accent-blue-200-pressed-dark: var(--color-blue-700);--color-background-accent-blue-300-light: var(--color-blue-400);--color-background-accent-blue-300-hovered-light: var(--color-blue-300);--color-background-accent-blue-300-pressed-light: var(--color-blue-200);--color-background-accent-blue-300-dark: var(--color-blue-800);--color-background-accent-blue-300-hovered-dark: var(--color-blue-900);--color-background-accent-blue-300-pressed-dark: var(--color-blue-1000);--color-background-accent-blue-400-light: var(--color-blue-700);--color-background-accent-blue-400-hovered-light: var(--color-blue-800);--color-background-accent-blue-400-pressed-light: var(--color-blue-900);--color-background-accent-blue-400-dark: var(--color-blue-400);--color-background-accent-blue-400-hovered-dark: var(--color-blue-300);--color-background-accent-blue-400-pressed-dark: var(--color-blue-200);--color-background-accent-green-100-light: var(--color-green-100);--color-background-accent-green-100-hovered-light: var(--color-green-200);--color-background-accent-green-100-pressed-light: var(--color-green-300);--color-background-accent-green-100-dark: var(--color-green-1000);--color-background-accent-green-100-hovered-dark: var(--color-green-900);--color-background-accent-green-100-pressed-dark: var(--color-green-800);--color-background-accent-green-200-light: var(--color-green-200);--color-background-accent-green-200-hovered-light: var(--color-green-300);--color-background-accent-green-200-pressed-light: var(--color-green-400);--color-background-accent-green-200-dark: var(--color-green-900);--color-background-accent-green-200-hovered-dark: var(--color-green-800);--color-background-accent-green-200-pressed-dark: var(--color-green-700);--color-background-accent-green-300-light: var(--color-green-400);--color-background-accent-green-300-hovered-light: var(--color-green-300);--color-background-accent-green-300-pressed-light: var(--color-green-200);--color-background-accent-green-300-dark: var(--color-green-800);--color-background-accent-green-300-hovered-dark: var(--color-green-900);--color-background-accent-green-300-pressed-dark: var(--color-green-1000);--color-background-accent-green-400-light: var(--color-green-700);--color-background-accent-green-400-hovered-light: var(--color-green-800);--color-background-accent-green-400-pressed-light: var(--color-green-900);--color-background-accent-green-400-dark: var(--color-green-400);--color-background-accent-green-400-hovered-dark: var(--color-green-300);--color-background-accent-green-400-pressed-dark: var(--color-green-200);--color-background-accent-orange-100-light: var(--color-orange-100);--color-background-accent-orange-100-hovered-light: var(--color-orange-200);--color-background-accent-orange-100-pressed-light: var(--color-orange-300);--color-background-accent-orange-100-dark: var(--color-orange-1000);--color-background-accent-orange-100-hovered-dark: var(--color-orange-900);--color-background-accent-orange-100-pressed-dark: var(--color-orange-800);--color-background-accent-orange-200-light: var(--color-orange-200);--color-background-accent-orange-200-hovered-light: var(--color-orange-300);--color-background-accent-orange-200-pressed-light: var(--color-orange-400);--color-background-accent-orange-200-dark: var(--color-orange-900);--color-background-accent-orange-200-hovered-dark: var(--color-orange-800);--color-background-accent-orange-200-pressed-dark: var(--color-orange-700);--color-background-accent-orange-300-light: var(--color-orange-400);--color-background-accent-orange-300-hovered-light: var(--color-orange-300);--color-background-accent-orange-300-pressed-light: var(--color-orange-200);--color-background-accent-orange-300-dark: var(--color-orange-800);--color-background-accent-orange-300-hovered-dark: var(--color-orange-900);--color-background-accent-orange-300-pressed-dark: var(--color-orange-1000);--color-background-accent-orange-400-light: var(--color-orange-700);--color-background-accent-orange-400-hovered-light: var(--color-orange-800);--color-background-accent-orange-400-pressed-light: var(--color-orange-900);--color-background-accent-orange-400-dark: var(--color-orange-400);--color-background-accent-orange-400-hovered-dark: var(--color-orange-300);--color-background-accent-orange-400-pressed-dark: var(--color-orange-200);--color-background-accent-red-100-light: var(--color-red-100);--color-background-accent-red-100-hovered-light: var(--color-red-200);--color-background-accent-red-100-pressed-light: var(--color-red-300);--color-background-accent-red-100-dark: var(--color-red-1000);--color-background-accent-red-100-hovered-dark: var(--color-red-900);--color-background-accent-red-100-pressed-dark: var(--color-red-800);--color-background-accent-red-200-light: var(--color-red-200);--color-background-accent-red-200-hovered-light: var(--color-red-300);--color-background-accent-red-200-pressed-light: var(--color-red-400);--color-background-accent-red-200-dark: var(--color-red-900);--color-background-accent-red-200-hovered-dark: var(--color-red-800);--color-background-accent-red-200-pressed-dark: var(--color-red-700);--color-background-accent-red-300-light: var(--color-red-400);--color-background-accent-red-300-hovered-light: var(--color-red-300);--color-background-accent-red-300-pressed-light: var(--color-red-200);--color-background-accent-red-300-dark: var(--color-red-800);--color-background-accent-red-300-hovered-dark: var(--color-red-900);--color-background-accent-red-300-pressed-dark: var(--color-red-1000);--color-background-accent-red-400-light: var(--color-red-700);--color-background-accent-red-400-hovered-light: var(--color-red-800);--color-background-accent-red-400-pressed-light: var(--color-red-900);--color-background-accent-red-400-dark: var(--color-red-400);--color-background-accent-red-400-hovered-dark: var(--color-red-300);--color-background-accent-red-400-pressed-dark: var(--color-red-200);--color-background-accent-yellow-100-light: var(--color-yellow-100);--color-background-accent-yellow-100-hovered-light: var(--color-yellow-200);--color-background-accent-yellow-100-pressed-light: var(--color-yellow-300);--color-background-accent-yellow-100-dark: var(--color-yellow-1000);--color-background-accent-yellow-100-hovered-dark: var(--color-yellow-900);--color-background-accent-yellow-100-pressed-dark: var(--color-yellow-800);--color-background-accent-yellow-200-light: var(--color-yellow-200);--color-background-accent-yellow-200-hovered-light: var(--color-yellow-300);--color-background-accent-yellow-200-pressed-light: var(--color-yellow-400);--color-background-accent-yellow-200-dark: var(--color-yellow-900);--color-background-accent-yellow-200-hovered-dark: var(--color-yellow-800);--color-background-accent-yellow-200-pressed-dark: var(--color-yellow-700);--color-background-accent-yellow-300-light: var(--color-yellow-300);--color-background-accent-yellow-300-hovered-light: var(--color-yellow-400);--color-background-accent-yellow-300-pressed-light: var(--color-yellow-500);--color-background-accent-yellow-300-dark: var(--color-yellow-800);--color-background-accent-yellow-300-hovered-dark: var(--color-yellow-900);--color-background-accent-yellow-300-pressed-dark: var(--color-yellow-1000);--color-background-accent-yellow-400-light: var(--color-yellow-700);--color-background-accent-yellow-400-hovered-light: var(--color-yellow-800);--color-background-accent-yellow-400-pressed-light: var(--color-yellow-900);--color-background-accent-yellow-400-dark: var(--color-yellow-400);--color-background-accent-yellow-400-hovered-dark: var(--color-yellow-300);--color-background-accent-yellow-400-pressed-dark: var(--color-yellow-200);--color-background-accent-teal-100-light: var(--color-teal-100);--color-background-accent-teal-100-hovered-light: var(--color-teal-200);--color-background-accent-teal-100-pressed-light: var(--color-teal-300);--color-background-accent-teal-100-dark: var(--color-teal-1000);--color-background-accent-teal-100-hovered-dark: var(--color-teal-900);--color-background-accent-teal-100-pressed-dark: var(--color-teal-800);--color-background-accent-teal-200-light: var(--color-teal-200);--color-background-accent-teal-200-hovered-light: var(--color-teal-300);--color-background-accent-teal-200-pressed-light: var(--color-teal-400);--color-background-accent-teal-200-dark: var(--color-teal-900);--color-background-accent-teal-200-hovered-dark: var(--color-teal-800);--color-background-accent-teal-200-pressed-dark: var(--color-teal-700);--color-background-accent-teal-300-light: var(--color-teal-400);--color-background-accent-teal-300-hovered-light: var(--color-teal-300);--color-background-accent-teal-300-pressed-light: var(--color-teal-200);--color-background-accent-teal-300-dark: var(--color-teal-800);--color-background-accent-teal-300-hovered-dark: var(--color-teal-900);--color-background-accent-teal-300-pressed-dark: var(--color-teal-1000);--color-background-accent-teal-400-light: var(--color-teal-700);--color-background-accent-teal-400-hovered-light: var(--color-teal-800);--color-background-accent-teal-400-pressed-light: var(--color-teal-900);--color-background-accent-teal-400-dark: var(--color-teal-400);--color-background-accent-teal-400-hovered-dark: var(--color-teal-300);--color-background-accent-teal-400-pressed-dark: var(--color-teal-200);--color-background-accent-purple-100-light: var(--color-purple-100);--color-background-accent-purple-100-hovered-light: var(--color-purple-200);--color-background-accent-purple-100-pressed-light: var(--color-purple-300);--color-background-accent-purple-100-dark: var(--color-purple-1000);--color-background-accent-purple-100-hovered-dark: var(--color-purple-900);--color-background-accent-purple-100-pressed-dark: var(--color-purple-800);--color-background-accent-purple-200-light: var(--color-purple-200);--color-background-accent-purple-200-hovered-light: var(--color-purple-300);--color-background-accent-purple-200-pressed-light: var(--color-purple-400);--color-background-accent-purple-200-dark: var(--color-purple-900);--color-background-accent-purple-200-hovered-dark: var(--color-purple-800);--color-background-accent-purple-200-pressed-dark: var(--color-purple-700);--color-background-accent-purple-300-light: var(--color-purple-400);--color-background-accent-purple-300-hovered-light: var(--color-purple-300);--color-background-accent-purple-300-pressed-light: var(--color-purple-200);--color-background-accent-purple-300-dark: var(--color-purple-800);--color-background-accent-purple-300-hovered-dark: var(--color-purple-900);--color-background-accent-purple-300-pressed-dark: var(--color-purple-1000);--color-background-accent-purple-400-light: var(--color-purple-700);--color-background-accent-purple-400-hovered-light: var(--color-purple-800);--color-background-accent-purple-400-pressed-light: var(--color-purple-900);--color-background-accent-purple-400-dark: var(--color-purple-400);--color-background-accent-purple-400-hovered-dark: var(--color-purple-300);--color-background-accent-purple-400-pressed-dark: var(--color-purple-200);--color-background-accent-pink-100-light: var(--color-pink-100);--color-background-accent-pink-100-hovered-light: var(--color-pink-200);--color-background-accent-pink-100-pressed-light: var(--color-pink-300);--color-background-accent-pink-100-dark: var(--color-pink-1000);--color-background-accent-pink-100-hovered-dark: var(--color-pink-900);--color-background-accent-pink-100-pressed-dark: var(--color-pink-800);--color-background-accent-pink-200-light: var(--color-pink-200);--color-background-accent-pink-200-hovered-light: var(--color-pink-300);--color-background-accent-pink-200-pressed-light: var(--color-pink-400);--color-background-accent-pink-200-dark: var(--color-pink-900);--color-background-accent-pink-200-hovered-dark: var(--color-pink-800);--color-background-accent-pink-200-pressed-dark: var(--color-pink-700);--color-background-accent-pink-300-light: var(--color-pink-400);--color-background-accent-pink-300-hovered-light: var(--color-pink-300);--color-background-accent-pink-300-pressed-light: var(--color-pink-200);--color-background-accent-pink-300-dark: var(--color-pink-800);--color-background-accent-pink-300-hovered-dark: var(--color-pink-900);--color-background-accent-pink-300-pressed-dark: var(--color-pink-1000);--color-background-accent-pink-400-light: var(--color-pink-700);--color-background-accent-pink-400-hovered-light: var(--color-pink-800);--color-background-accent-pink-400-pressed-light: var(--color-pink-900);--color-background-accent-pink-400-dark: var(--color-pink-400);--color-background-accent-pink-400-hovered-dark: var(--color-pink-300);--color-background-accent-pink-400-pressed-dark: var(--color-pink-200);--color-text-light: var(--color-neutral-1000);--color-text-dark: var(--color-neutral-dark-1000);--color-text-subtle-light: var(--color-neutral-600);--color-text-subtle-dark: var(--color-neutral-dark-600);--color-text-subtler-light: var(--color-neutral-500);--color-text-subtler-dark: var(--color-neutral-dark-500);--color-text-brand-light: var(--color-brand-text-light);--color-text-brand-dark: var(--color-brand-text-dark);--color-text-information-light: var(--color-blue-800);--color-text-information-dark: var(--color-blue-300);--color-text-success-light: var(--color-green-800);--color-text-success-dark: var(--color-green-300);--color-text-warning-light: var(--color-yellow-800);--color-text-warning-dark: var(--color-yellow-300);--color-text-danger-light: var(--color-red-800);--color-text-danger-dark: var(--color-red-300);--color-text-discovery-light: var(--color-purple-800);--color-text-discovery-dark: var(--color-purple-300);--color-text-disabled-light: var(--color-neutral-alpha-400);--color-text-disabled-dark: var(--color-neutral-dark-alpha-400);--color-text-selected-light: var(--color-blue-700);--color-text-selected-dark: var(--color-blue-400);--color-text-inverse-light: var(--color-neutral-0);--color-text-inverse-dark: var(--color-neutral-dark-100);--color-text-accent-gray-100-light: var(--color-neutral-800);--color-text-accent-gray-100-dark: var(--color-neutral-dark-800);--color-text-accent-gray-200-light: var(--color-neutral-1100);--color-text-accent-gray-200-dark: var(--color-neutral-dark-1100);--color-text-accent-blue-100-light: var(--color-blue-800);--color-text-accent-blue-100-dark: var(--color-blue-300);--color-text-accent-blue-200-light: var(--color-blue-900);--color-text-accent-blue-200-dark: var(--color-blue-200);--color-text-accent-green-100-light: var(--color-green-800);--color-text-accent-green-100-dark: var(--color-green-300);--color-text-accent-green-200-light: var(--color-green-900);--color-text-accent-green-200-dark: var(--color-green-200);--color-text-accent-orange-100-light: var(--color-orange-800);--color-text-accent-orange-100-dark: var(--color-orange-300);--color-text-accent-orange-200-light: var(--color-orange-900);--color-text-accent-orange-200-dark: var(--color-orange-200);--color-text-accent-red-100-light: var(--color-red-800);--color-text-accent-red-100-dark: var(--color-red-300);--color-text-accent-red-200-light: var(--color-red-900);--color-text-accent-red-200-dark: var(--color-red-200);--color-text-accent-yellow-100-light: var(--color-yellow-800);--color-text-accent-yellow-100-dark: var(--color-yellow-300);--color-text-accent-yellow-200-light: var(--color-yellow-900);--color-text-accent-yellow-200-dark: var(--color-yellow-200);--color-text-accent-teal-100-light: var(--color-teal-800);--color-text-accent-teal-100-dark: var(--color-teal-300);--color-text-accent-teal-200-light: var(--color-teal-900);--color-text-accent-teal-200-dark: var(--color-teal-200);--color-text-accent-purple-100-light: var(--color-purple-800);--color-text-accent-purple-100-dark: var(--color-purple-300);--color-text-accent-purple-200-light: var(--color-purple-900);--color-text-accent-purple-200-dark: var(--color-purple-200);--color-text-accent-pink-100-light: var(--color-pink-800);--color-text-accent-pink-100-dark: var(--color-pink-300);--color-text-accent-pink-200-light: var(--color-pink-900);--color-text-accent-pink-200-dark: var(--color-pink-200);--color-text-link-light: var(--color-blue-700);--color-text-link-dark: var(--color-blue-400);--color-text-link-pressed-light: var(--color-blue-800);--color-text-link-pressed-dark: var(--color-blue-300);--color-text-link-visited-light: var(--color-purple-800);--color-text-link-visited-dark: var(--color-purple-300);--color-text-link-visited-pressed-light: var(--color-purple-900);--color-text-link-visited-pressed-dark: var(--color-purple-200);--color-icon-light: var(--color-neutral-800);--color-icon-dark: var(--color-neutral-dark-800);--color-icon-subtle-light: var(--color-neutral-700);--color-icon-subtle-dark: var(--color-neutral-dark-700);--color-icon-subtler-light: var(--color-neutral-700);--color-icon-subtler-dark: var(--color-neutral-dark-700);--color-icon-brand-light: var(--color-brand-icon-light);--color-icon-brand-dark: var(--color-brand-icon-dark);--color-icon-information-light: var(--color-blue-600);--color-icon-information-dark: var(--color-blue-500);--color-icon-success-light: var(--color-green-600);--color-icon-success-dark: var(--color-green-500);--color-icon-warning-light: var(--color-orange-600);--color-icon-warning-dark: var(--color-yellow-300);--color-icon-danger-light: var(--color-red-700);--color-icon-danger-dark: var(--color-red-500);--color-icon-discovery-light: var(--color-purple-600);--color-icon-discovery-dark: var(--color-purple-500);--color-icon-disabled-light: var(--color-neutral-alpha-400);--color-icon-disabled-dark: var(--color-neutral-dark-alpha-400);--color-icon-selected-light: var(--color-blue-700);--color-icon-selected-dark: var(--color-blue-400);--color-icon-inverse-light: var(--color-neutral-0);--color-icon-inverse-dark: var(--color-neutral-dark-100);--color-icon-accent-gray-light: var(--color-neutral-600);--color-icon-accent-gray-dark: var(--color-neutral-dark-600);--color-icon-accent-blue-light: var(--color-blue-600);--color-icon-accent-blue-dark: var(--color-blue-500);--color-icon-accent-green-light: var(--color-green-600);--color-icon-accent-green-dark: var(--color-green-500);--color-icon-accent-orange-light: var(--color-orange-600);--color-icon-accent-orange-dark: var(--color-orange-500);--color-icon-accent-red-light: var(--color-red-700);--color-icon-accent-red-dark: var(--color-red-600);--color-icon-accent-yellow-light: var(--color-yellow-600);--color-icon-accent-yellow-dark: var(--color-yellow-300);--color-icon-accent-teal-light: var(--color-teal-600);--color-icon-accent-teal-dark: var(--color-teal-500);--color-icon-accent-purple-light: var(--color-purple-600);--color-icon-accent-purple-dark: var(--color-purple-500);--color-icon-accent-pink-light: var(--color-pink-600);--color-icon-accent-pink-dark: var(--color-pink-500);--color-border-100-light: var(--color-neutral-alpha-300);--color-border-100-dark: var(--color-neutral-dark-alpha-300);--color-border-200-light: var(--color-neutral-600);--color-border-200-dark: var(--color-neutral-dark-600);--color-border-brand-light: var(--color-brand-border-light);--color-border-brand-dark: var(--color-brand-border-dark);--color-border-information-light: var(--color-blue-600);--color-border-information-dark: var(--color-blue-500);--color-border-success-light: var(--color-green-600);--color-border-success-dark: var(--color-green-500);--color-border-warning-light: var(--color-orange-600);--color-border-warning-dark: var(--color-yellow-500);--color-border-danger-light: var(--color-red-600);--color-border-danger-dark: var(--color-red-500);--color-border-discovery-light: var(--color-purple-600);--color-border-discovery-dark: var(--color-purple-500);--color-border-disabled-light: var(--color-neutral-alpha-200);--color-border-disabled-dark: var(--color-neutral-dark-alpha-200);--color-border-focused-light: var(--color-blue-500);--color-border-focused-dark: var(--color-blue-300);--color-border-selected-light: var(--color-blue-700);--color-border-selected-dark: var(--color-blue-400);--color-border-input-light: var(--color-neutral-300);--color-border-input-dark: var(--color-neutral-dark-400);--color-border-input-disabled-light: var(--color-neutral-alpha-200);--color-border-input-disabled-dark: var(--color-neutral-dark-alpha-200);--color-border-inverse-light: var(--color-neutral-0);--color-border-inverse-dark: var(--color-neutral-dark-0);--color-border-accent-gray-light: var(--color-neutral-600);--color-border-accent-gray-dark: var(--color-neutral-dark-600);--color-border-accent-blue-light: var(--color-blue-600);--color-border-accent-blue-dark: var(--color-blue-500);--color-border-accent-green-light: var(--color-green-600);--color-border-accent-green-dark: var(--color-green-500);--color-border-accent-orange-light: var(--color-orange-600);--color-border-accent-orange-dark: var(--color-orange-500);--color-border-accent-red-light: var(--color-red-600);--color-border-accent-red-dark: var(--color-red-500);--color-border-accent-yellow-light: var(--color-yellow-600);--color-border-accent-yellow-dark: var(--color-yellow-500);--color-border-accent-teal-light: var(--color-teal-600);--color-border-accent-teal-dark: var(--color-teal-500);--color-border-accent-purple-light: var(--color-purple-600);--color-border-accent-purple-dark: var(--color-purple-500);--color-border-accent-pink-light: var(--color-pink-600);--color-border-accent-pink-dark: var(--color-pink-500);--color-overlay-light: var(--color-neutral-alpha-500);--color-overlay-dark: var(--color-neutral-dark-alpha-500);--color-skeleton-100-light: var(--color-neutral-alpha-100);--color-skeleton-100-dark: var(--color-neutral-dark-alpha-100);--color-skeleton-200-light: var(--color-neutral-alpha-200);--color-skeleton-200-dark: var(--color-neutral-dark-alpha-200)}.theme{--color-background-brand-100-light: var(--color-brand-surface-soft-light);--color-background-brand-100-hovered-light: var( --color-brand-surface-soft-hovered-light );--color-background-brand-100-pressed-light: var( --color-brand-surface-soft-pressed-light );--color-background-brand-100-dark: var(--color-brand-surface-soft-dark);--color-background-brand-100-hovered-dark: var( --color-brand-surface-soft-hovered-dark );--color-background-brand-100-pressed-dark: var( --color-brand-surface-soft-pressed-dark );--color-background-brand-200-light: var(--color-brand-surface-strong-light);--color-background-brand-200-hovered-light: var( --color-brand-surface-strong-hovered-light );--color-background-brand-200-pressed-light: var( --color-brand-surface-strong-pressed-light );--color-background-brand-200-dark: var(--color-brand-surface-strong-dark);--color-background-brand-200-hovered-dark: var( --color-brand-surface-strong-hovered-dark );--color-background-brand-200-pressed-dark: var( --color-brand-surface-strong-pressed-dark );--color-background-brand-300-light: var(--color-brand-on-soft-light);--color-background-brand-300-hovered-light: var(--color-brand-border-light);--color-background-brand-300-pressed-light: var( --color-brand-surface-strong-light );--color-background-brand-300-dark: var(--color-brand-on-soft-dark);--color-background-brand-300-hovered-dark: var(--color-brand-border-dark);--color-background-brand-300-pressed-dark: var( --color-brand-surface-strong-dark );--color-text-brand-light: var(--color-brand-text-light);--color-text-brand-dark: var(--color-brand-text-dark);--color-icon-brand-light: var(--color-brand-icon-light);--color-icon-brand-dark: var(--color-brand-icon-dark);--color-border-brand-light: var(--color-brand-border-light);--color-border-brand-dark: var(--color-brand-border-dark)}:root{--elevation-raised-light: var(--color-neutral-alpha-400) 0px 1px 1px, var(--color-neutral-alpha-500) 0px 0px 1px;--elevation-raised-dark: var(--color-neutral-dark-alpha-300) 0px 1px 1px, var(--color-neutral-dark-alpha-400) 0px 0px 1px;--elevation-overlay-light: var(--color-neutral-alpha-400) 0px 8px 12px 0px, var(--color-neutral-alpha-500) 0px 0px 1px 0px;--elevation-overlay-dark: var(--color-neutral-dark-alpha-200) 0px 0px 0px 1px, var(--color-neutral-dark-alpha-0) 0px 8px 12px 0px, var(--color-neutral-dark-alpha-100) 0px 0px 1px 1px;--elevation-avatar-light: inset 0 0 10px var(--color-neutral-alpha-100);--elevation-avatar-dark: inset 0 0 10px var(--color-neutral-dark-alpha-100)}:root{--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-family-code: ui-monospace, SFMono-Medium, "SF Mono", "Segoe UI Mono", "Roboto Mono", "Ubuntu Mono", Menlo, monospace;--font-style-normal: normal;--font-style-italic: italic;--font-size-default: var(--font-size-14);--font-size-12: 12px;--font-size-13: 13px;--font-size-14: 14px;--font-size-15: 15px;--font-size-16: 16px;--font-size-18: 18px;--font-size-20: 20px;--font-size-24: 24px;--font-size-28: 28px;--font-size-30: 30px;--font-size-32: 32px;--font-size-36: 36px;--font-size-48: 48px;--font-size-60: 60px;--font-size-72: 72px;--font-weight-thin: 100;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-weight-black: 900}:root{--layer-card: 100;--layer-navigation: 200;--layer-dialog: 300;--layer-overlay: 400;--layer-modal: 500;--layer-flag: 600;--layer-spotlight: 700;--layer-tooltip: 800}:root{--size-0: 0px;--size-2: 2px;--size-4: 4px;--size-6: 6px;--size-8: 8px;--size-12: 12px;--size-16: 16px;--size-20: 20px;--size-24: 24px;--size-32: 32px;--size-40: 40px;--size-48: 48px;--size-64: 64px;--size-80: 80px;--size-96: 96px;--size-128: 128px;--size-192: 192px;--size-256: 256px;--size-384: 384px;--size-512: 512px;--size-640: 640px;--size-768: 768px;--size-896: 896px;--size-1024: 1024px;--size-1152: 1152px;--size-1280: 1280px;--size-1408: 1408px;--size-1536: 1536px;--size-1664: 1664px;--size-1792: 1792px;--size-1920: 1920px}:root{--transition-100ms-ease-out: .1s ease-out;--transition-100ms-ease-in-out: .1s ease-in-out;--transition-200ms-ease-in: .2s ease-in;--transition-200ms-ease-in-out: .2s ease-in-out}html,body,p,div,h1,h2,h3,h4,h5,h6,ul,ol,dl,img,pre,form,fieldset{margin:var(--size-0);padding:var(--size-0)}img,fieldset{border:var(--size-0)}body,html,#app{height:100%;width:100%}body{background-color:var(--color-background-surface-light);color:var(--color-text-light);font-family:var(--font-family);font-size:var(--font-size-14);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:20px}input,select,textarea,button{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:25px}p,ul,ol,dl,h1,h2,h3,h4,h5,h6,blockquote,pre,form,table{margin:calc(var(--grid-size) * 2px) var(--size-0) var(--size-0) var(--size-0)}a{color:var(--color-text-link-light);text-decoration:var(--link-text-decoration-default);border-radius:var(--border-width);cursor:pointer;transition:color var(--transition-100ms-ease-in-out),background-color var(--transition-100ms-ease-in-out)}a:hover{text-decoration:var(--link-text-decoration-hover)}a:active{color:var(--color-text-link-pressed-light)}a:visited{color:var(--color-text-link-visited-light)}a.visited:active{color:var(--color-text-link-visited-pressed-light)}h1{font-size:var(--font-size-28);font-style:var(--font-style-normal);line-height:32px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] h1{color:var(--color-text-dark)}h1:first-child{margin-top:var(--size-0)}h2{font-size:var(--font-size-24);font-style:var(--font-style-normal);line-height:28px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] h2{color:var(--color-text-dark)}h2:first-child{margin-top:var(--size-0)}h3{font-size:var(--font-size-20);font-style:var(--font-style-normal);line-height:24px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3.5px)}[dark-mode=true] h3{color:var(--color-text-dark)}h3:first-child{margin-top:var(--size-0)}h4{font-size:var(--font-size-16);font-style:var(--font-style-normal);line-height:20px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3px)}[dark-mode=true] h4{color:var(--color-text-dark)}h4:first-child{margin-top:var(--size-0)}h5{font-size:var(--font-size-14);font-style:var(--font-style-normal);line-height:20px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] h5{color:var(--color-text-dark)}h5:first-child{margin-top:var(--size-0)}h6{font-size:var(--font-size-12);font-style:var(--font-style-normal);line-height:16px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px)}[dark-mode=true] h6{color:var(--color-text-dark)}h6:first-child{margin-top:var(--size-0)}ul,ol,dl{padding-left:calc(var(--grid-size) * 5px)}dd,dd+dt,li+li{margin-top:calc(var(--grid-size) / 2px)}ul ul:not(:first-child),ol ul:not(:first-child),ul ol:not(:first-child),ol ol:not(:first-child){margin-top:calc(var(--grid-size) / 2px)}p:first-child,ul:first-child,ol:first-child,dl:first-child,h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child,blockquote:first-child,pre:first-child,form:first-child,table:first-child{margin-top:var(--size-0)}:focus{outline:none;box-shadow:var(--size-0) var(--size-0) var(--size-0) var(--focus-outline-width) var(--color-border-focused-light)}[data-whatintent=mouse] :focus{outline:none;box-shadow:none}table{border-collapse:collapse;width:100%}thead,tbody,tfoot{border-bottom:var(--border-width) solid var(--color-border-100-light)}td,th{border:none;padding:calc((var(--grid-size) / 2) * 1px) calc(var(--grid-size) * 1px);text-align:left}th{font-size:var(--font-size-12);font-style:var(--font-style-normal);line-height:16px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px);line-height:inherit}[dark-mode=true] th{color:var(--color-text-dark)}th:first-child{margin-top:var(--size-0)}td:first-child,th:first-child{padding-left:var(--size-0)}td:last-child,th:last-child{padding-right:var(--size-0)}tr{transition:background .1s ease-out,box-shadow .15s cubic-bezier(.47,.03,.49,1.38)}tbody tr:hover{background-color:var(--color-background-surface-hovered-light)}hr{background-color:var(--color-border-100-light);height:2px;border-style:none;margin:var(--size-40) var(--size-0)}pre{font-family:var(--font-family-code);white-space:pre-wrap;padding:var(--size-24) var(--size-32);border-radius:var(--border-radius-regular);background:var(--color-background-surface-sunken-light);font-size:var(--font-size-12);line-height:23px;overflow-x:auto}code{font-family:var(--font-family-code);padding:var(--size-0);font-size:var(--font-size-12)}p code{font-family:var(--font-family-code);padding:var(--size-0) var(--size-8);border-radius:var(--border-radius-regular);background:var(--color-background-surface-sunken-light);font-size:var(--font-size-14)}blockquote{white-space:pre-wrap;border-left:var(--border-width-3) solid var(--color-border-100-light);padding-left:var(--size-8);font-style:var(--font-style-italic)}caption{font-size:var(--font-size-20);font-style:var(--font-style-normal);line-height:24px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3.5px);margin-bottom:var(--size-8);text-align:left}[dark-mode=true] caption{color:var(--color-text-dark)}caption:first-child{margin-top:var(--size-0)}[dark-mode=true] body{background-color:var(--color-background-surface-dark);color:var(--color-text-dark)}[dark-mode=true] a{color:var(--color-text-link-dark)}[dark-mode=true] a:active{color:var(--color-text-link-pressed-dark)}[dark-mode=true] a:visited{color:var(--color-text-link-visited-dark)}[dark-mode=true] a.visited:active{color:var(--color-text-link-visited-pressed-dark)}[dark-mode=true] :focus{outline:none;box-shadow:var(--size-0) var(--size-0) var(--size-0) var(--focus-outline-width) var(--color-border-focused-dark)}[dark-mode=true] thead,[dark-mode=true] tbody,[dark-mode=true] tfoot{border-bottom:var(--border-width) solid var(--color-border-100-dark)}[dark-mode=true] tbody tr:hover{background-color:var(--color-background-surface-hovered-dark)}[dark-mode=true] hr{background-color:var(--color-border-100-dark)}[dark-mode=true] pre,[dark-mode=true] p code{background:var(--color-background-surface-sunken-dark)}[dark-mode=true] blockquote{border-left:var(--border-width-3) solid var(--color-border-100-dark)}[dark-mode=true][data-whatintent=mouse] :focus{outline:none;box-shadow:none}:root{--grid-size: 8;--focus-outline-width: 2px;--link-text-decoration-default: none;--link-text-decoration-hover: underline}.heading-xxlarge{font-size:var(--font-size-32);font-style:var(--font-style-normal);line-height:36px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 6.5px)}[dark-mode=true] .heading-xxlarge{color:var(--color-text-dark)}.heading-xxlarge:first-child{margin-top:var(--size-0)}.heading-xlarge{font-size:var(--font-size-28);font-style:var(--font-style-normal);line-height:32px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] .heading-xlarge{color:var(--color-text-dark)}.heading-xlarge:first-child{margin-top:var(--size-0)}.heading-large{font-size:var(--font-size-24);font-style:var(--font-style-normal);line-height:28px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 5px)}[dark-mode=true] .heading-large{color:var(--color-text-dark)}.heading-large:first-child{margin-top:var(--size-0)}.heading-medium{font-size:var(--font-size-20);font-style:var(--font-style-normal);line-height:24px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3.5px)}[dark-mode=true] .heading-medium{color:var(--color-text-dark)}.heading-medium:first-child{margin-top:var(--size-0)}.heading-small{font-size:var(--font-size-16);font-style:var(--font-style-normal);line-height:20px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 3px)}[dark-mode=true] .heading-small{color:var(--color-text-dark)}.heading-small:first-child{margin-top:var(--size-0)}.heading-xsmall{font-size:var(--font-size-14);font-style:var(--font-style-normal);line-height:20px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2px)}[dark-mode=true] .heading-xsmall{color:var(--color-text-dark)}.heading-xsmall:first-child{margin-top:var(--size-0)}.heading-xxsmall{font-size:var(--font-size-12);font-style:var(--font-style-normal);line-height:16px;color:var(--color-text-light);font-weight:var(--font-weight-semibold);margin-top:calc(var(--grid-size) * 2.5px)}[dark-mode=true] .heading-xxsmall{color:var(--color-text-dark)}.heading-xxsmall:first-child{margin-top:var(--size-0)}.text{font-size:var(--font-size-14);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:20px}.text-large{font-size:var(--font-size-16);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:24px}.text-small{font-size:var(--font-size-12);font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:16px}.text-intro{font-size:20px;font-style:var(--font-style-normal);font-weight:var(--font-weight-regular);line-height:32px}.text-caption{font-size:var(--font-size-12);font-weight:var(--font-weight-regular);display:block;line-height:18px;color:var(--color-text-subtle-light)}[dark-mode=true] .text-caption{color:var(--placeholder-color-dark)}.text-caption-bold{font-size:var(--font-size-12);font-weight:var(--font-weight-semibold)}.text-prominent{font-size:var(--font-size-default);font-weight:var(--font-weight-semibold)}.error{color:var(--color-text-danger-light)}[dark-mode=true] .error{color:var(--color-text-danger-dark)}.theme-switcher-divider[data-v-bcbc87cb]{margin:4px 0}