lism-css 0.10.5 → 0.12.0

package/dist/config/defaults/states.d.ts

@@ -12,18 +12,5 @@ declare const _default: {
     readonly isSide: "is--side";
     readonly isSkipFlow: "is--skipFlow";
     readonly isVertical: "is--vertical";
-    readonly setGutter: "set--gutter";
-    readonly setShadow: "set--shadow";
-    readonly setHov: "set--hov";
-    readonly setTransition: "set--transition";
-    readonly setMask: {
-        readonly className: "set--mask";
-        readonly setStyles: (propVal: string) => {
-            '--maskImg': string;
-        };
-    };
-    readonly setPlain: "set--plain";
-    readonly setInnerRs: "set--innerRs";
-    readonly setBp: "set--bp";
 };
 export default _default;

package/dist/config/defaults/states.js

@@ -1,5 +1,4 @@
-import t from "../helper/getSvgUrl.js";
-const a = {
+const s = {
   isContainer: "is--container",
   isWrapper: {
     className: "is--wrapper",
@@ -12,27 +11,8 @@ const a = {
   isLinkBox: "is--linkBox",
   isSide: "is--side",
   isSkipFlow: "is--skipFlow",
-  isVertical: "is--vertical",
-  setGutter: "set--gutter",
-  // set class
-  setShadow: "set--shadow",
-  setHov: "set--hov",
-  setTransition: "set--transition",
-  setMask: {
-    // 'set--mask',
-    className: "set--mask",
-    setStyles: (e) => {
-      let s = e;
-      return s.startsWith("<svg") && (s = t(e, "base64")), {
-        "--maskImg": s
-      };
-    }
-  },
-  setPlain: "set--plain",
-  // setRevert: 'set--revert',
-  setInnerRs: "set--innerRs",
-  setBp: "set--bp"
+  isVertical: "is--vertical"
 };
 export {
-  a as default
+  s as default
 };

package/dist/config/defaults/tokens.d.ts

@@ -6,8 +6,8 @@ declare const _default: {
     readonly ff: readonly ["base", "accent", "mono"];
     readonly fw: readonly ["light", "normal", "bold"];
     readonly o: readonly ["-10", "-20", "-30"];
-    readonly bdrs: readonly ["5", "10", "20", "30", "40", "50", "99", "inner"];
-    readonly bxsh: readonly ["5", "10", "20", "30", "40", "50"];
+    readonly bdrs: readonly ["10", "20", "30", "40", "99", "inner"];
+    readonly bxsh: readonly ["10", "20", "30", "40"];
     readonly sz: readonly ["xs", "s", "m", "l", "xl", "min", "full", "container"];
     readonly ar: readonly ["og"];
     readonly space: {

package/dist/config/defaults/tokens.js

@@ -6,8 +6,8 @@ const e = {
   ff: ["base", "accent", "mono"],
   fw: ["light", "normal", "bold"],
   o: ["-10", "-20", "-30"],
-  bdrs: ["5", "10", "20", "30", "40", "50", "99", "inner"],
-  bxsh: ["5", "10", "20", "30", "40", "50"],
+  bdrs: ["10", "20", "30", "40", "99", "inner"],
+  bxsh: ["10", "20", "30", "40"],
   sz: ["xs", "s", "m", "l", "xl", "min", "full", "container"],
   ar: ["og"],
   space: {

package/dist/config/index.d.ts

@@ -7,8 +7,8 @@ export declare const CONFIG: {
         readonly ff: readonly ["base", "accent", "mono"];
         readonly fw: readonly ["light", "normal", "bold"];
         readonly o: readonly ["-10", "-20", "-30"];
-        readonly bdrs: readonly ["5", "10", "20", "30", "40", "50", "99", "inner"];
-        readonly bxsh: readonly ["5", "10", "20", "30", "40", "50"];
+        readonly bdrs: readonly ["10", "20", "30", "40", "99", "inner"];
+        readonly bxsh: readonly ["10", "20", "30", "40"];
         readonly sz: readonly ["xs", "s", "m", "l", "xl", "min", "full", "container"];
         readonly ar: readonly ["og"];
         readonly space: {
@@ -95,10 +95,7 @@ export declare const CONFIG: {
         };
         readonly d: {
             readonly prop: "display";
-            readonly presets: readonly ["none", "block"];
-            readonly utils: {
-                readonly 'in-flex': "inline-flex";
-            };
+            readonly presets: readonly ["none", "block", "flex", "inline-flex", "grid", "inline-grid", "inline", "inline-block"];
             readonly bp: 1;
         };
         readonly o: {
@@ -259,7 +256,7 @@ export declare const CONFIG: {
             readonly isVar: 1;
             readonly presets: readonly ["brand", "accent", "divider", "inherit", "transparent"];
             readonly utils: {
-                readonly cc: "currentColor";
+                readonly current: "currentColor";
             };
             readonly token: "color";
         };
@@ -350,11 +347,7 @@ export declare const CONFIG: {
         };
         readonly pos: {
             readonly prop: "position";
-            readonly presets: readonly ["static", "fixed", "sticky"];
-            readonly utils: {
-                readonly rel: "relative";
-                readonly abs: "absolute";
-            };
+            readonly presets: readonly ["static", "fixed", "sticky", "relative", "absolute"];
         };
         readonly z: {
             readonly prop: "zIndex";
@@ -572,12 +565,12 @@ export declare const CONFIG: {
             readonly overwriteBaseVar: 1;
             readonly bp: 1;
         };
-        readonly 'g-x': {
+        readonly cg: {
             readonly prop: "columnGap";
             readonly token: "space";
             readonly bp: 1;
         };
-        readonly 'g-y': {
+        readonly rg: {
             readonly prop: "rowGap";
             readonly token: "space";
             readonly bp: 1;
@@ -600,11 +593,7 @@ export declare const CONFIG: {
         };
         readonly fxd: {
             readonly prop: "flexDirection";
-            readonly utils: {
-                readonly col: "column";
-                readonly 'col-r': "column-reverse";
-                readonly 'row-r': "row-reverse";
-            };
+            readonly presets: readonly ["column", "column-reverse", "row-reverse"];
             readonly bp: 1;
         };
         readonly fx: {
@@ -626,12 +615,6 @@ export declare const CONFIG: {
         };
         readonly gt: {
             readonly prop: "gridTemplate";
-            readonly presets: readonly ["repeat"];
-            readonly exUtility: {
-                readonly repeat: {
-                    readonly 'grid-template': "repeat(var(--rows,1), 1fr) / repeat(var(--cols,1), 1fr)";
-                };
-            };
             readonly bp: 1;
         };
         readonly gta: {
@@ -650,10 +633,7 @@ export declare const CONFIG: {
         };
         readonly gaf: {
             readonly prop: "gridAutoFlow";
-            readonly utils: {
-                readonly row: "row";
-                readonly col: "column";
-            };
+            readonly presets: readonly ["row", "column"];
             readonly bp: 1;
         };
         readonly gac: {
@@ -697,67 +677,55 @@ export declare const CONFIG: {
         };
         readonly ai: {
             readonly prop: "alignItems";
-            readonly presets: readonly ["start", "center", "end", "stretch"];
-            readonly utils: {
-                readonly 'flex-s': "flex-start";
-                readonly 'flex-e': "flex-end";
-            };
+            readonly presets: readonly ["start", "center", "end", "stretch", "flex-start", "flex-end"];
             readonly shorthands: {
                 readonly s: "start";
                 readonly e: "end";
                 readonly c: "center";
-                readonly fs: "flex-s";
-                readonly fe: "flex-e";
+                readonly fs: "flex-start";
+                readonly fe: "flex-end";
             };
             readonly bp: 1;
         };
         readonly ac: {
             readonly prop: "alignContent";
-            readonly presets: readonly ["start", "center", "end"];
+            readonly presets: readonly ["start", "center", "end", "flex-start", "flex-end"];
             readonly utils: {
                 readonly between: "space-between";
-                readonly 'flex-s': "flex-start";
-                readonly 'flex-e': "flex-end";
             };
             readonly shorthands: {
                 readonly s: "start";
                 readonly e: "end";
                 readonly c: "center";
-                readonly fs: "flex-s";
-                readonly fe: "flex-e";
+                readonly fs: "flex-start";
+                readonly fe: "flex-end";
             };
             readonly bp: 1;
         };
         readonly ji: {
             readonly prop: "justifyItems";
-            readonly presets: readonly ["start", "center", "end", "stretch"];
-            readonly utils: {
-                readonly 'flex-s': "flex-start";
-                readonly 'flex-e': "flex-end";
-            };
+            readonly presets: readonly ["start", "center", "end", "stretch", "flex-start", "flex-end"];
             readonly shorthands: {
                 readonly s: "start";
                 readonly e: "end";
                 readonly c: "center";
-                readonly fs: "flex-s";
-                readonly fe: "flex-e";
+                readonly fs: "flex-start";
+                readonly fe: "flex-end";
             };
             readonly bp: 1;
         };
         readonly jc: {
             readonly prop: "justifyContent";
-            readonly presets: readonly ["start", "center", "end"];
+            readonly presets: readonly ["start", "center", "end", "flex-start", "flex-end"];
             readonly utils: {
                 readonly between: "space-between";
-                readonly 'flex-s': "flex-start";
-                readonly 'flex-e': "flex-end";
             };
             readonly shorthands: {
                 readonly s: "start";
                 readonly e: "end";
                 readonly c: "center";
-                readonly fs: "flex-s";
-                readonly fe: "flex-e";
+                readonly fs: "flex-start";
+                readonly fe: "flex-end";
             };
             readonly bp: 1;
         };
@@ -776,8 +744,8 @@ export declare const CONFIG: {
                 readonly s: "start";
                 readonly e: "end";
                 readonly c: "center";
-                readonly fs: "flex-s";
-                readonly fe: "flex-e";
+                readonly fs: "flex-start";
+                readonly fe: "flex-end";
             };
         };
         readonly jslf: {
@@ -787,8 +755,8 @@ export declare const CONFIG: {
                 readonly s: "start";
                 readonly e: "end";
                 readonly c: "center";
-                readonly fs: "flex-s";
-                readonly fe: "flex-e";
+                readonly fs: "flex-start";
+                readonly fe: "flex-end";
             };
         };
         readonly pslf: {
@@ -801,9 +769,7 @@ export declare const CONFIG: {
         };
         readonly ovwrap: {
             readonly prop: "overflowWrap";
-            readonly utils: {
-                readonly any: "anywhere";
-            };
+            readonly presets: readonly ["anywhere"];
         };
         readonly whspace: {
             readonly prop: "whiteSpace";
@@ -836,19 +802,6 @@ export declare const CONFIG: {
         readonly isSide: "is--side";
         readonly isSkipFlow: "is--skipFlow";
         readonly isVertical: "is--vertical";
-        readonly setGutter: "set--gutter";
-        readonly setShadow: "set--shadow";
-        readonly setHov: "set--hov";
-        readonly setTransition: "set--transition";
-        readonly setMask: {
-            readonly className: "set--mask";
-            readonly setStyles: (propVal: string) => {
-                '--maskImg': string;
-            };
-        };
-        readonly setPlain: "set--plain";
-        readonly setInnerRs: "set--innerRs";
-        readonly setBp: "set--bp";
     };
 };
 export declare const TOKENS: {
@@ -859,8 +812,8 @@ export declare const TOKENS: {
     readonly ff: readonly ["base", "accent", "mono"];
     readonly fw: readonly ["light", "normal", "bold"];
     readonly o: readonly ["-10", "-20", "-30"];
-    readonly bdrs: readonly ["5", "10", "20", "30", "40", "50", "99", "inner"];
-    readonly bxsh: readonly ["5", "10", "20", "30", "40", "50"];
+    readonly bdrs: readonly ["10", "20", "30", "40", "99", "inner"];
+    readonly bxsh: readonly ["10", "20", "30", "40"];
     readonly sz: readonly ["xs", "s", "m", "l", "xl", "min", "full", "container"];
     readonly ar: readonly ["og"];
     readonly space: {
@@ -948,10 +901,7 @@ export declare const PROPS: {
     };
     readonly d: {
         readonly prop: "display";
-        readonly presets: readonly ["none", "block"];
-        readonly utils: {
-            readonly 'in-flex': "inline-flex";
-        };
+        readonly presets: readonly ["none", "block", "flex", "inline-flex", "grid", "inline-grid", "inline", "inline-block"];
         readonly bp: 1;
     };
     readonly o: {
@@ -1112,7 +1062,7 @@ export declare const PROPS: {
         readonly isVar: 1;
         readonly presets: readonly ["brand", "accent", "divider", "inherit", "transparent"];
         readonly utils: {
-            readonly cc: "currentColor";
+            readonly current: "currentColor";
         };
         readonly token: "color";
     };
@@ -1203,11 +1153,7 @@ export declare const PROPS: {
     };
     readonly pos: {
         readonly prop: "position";
-        readonly presets: readonly ["static", "fixed", "sticky"];
-        readonly utils: {
-            readonly rel: "relative";
-            readonly abs: "absolute";
-        };
+        readonly presets: readonly ["static", "fixed", "sticky", "relative", "absolute"];
     };
     readonly z: {
         readonly prop: "zIndex";
@@ -1425,12 +1371,12 @@ export declare const PROPS: {
         readonly overwriteBaseVar: 1;
         readonly bp: 1;
     };
-    readonly 'g-x': {
+    readonly cg: {
         readonly prop: "columnGap";
         readonly token: "space";
         readonly bp: 1;
     };
-    readonly 'g-y': {
+    readonly rg: {
         readonly prop: "rowGap";
         readonly token: "space";
         readonly bp: 1;
@@ -1453,11 +1399,7 @@ export declare const PROPS: {
     };
     readonly fxd: {
         readonly prop: "flexDirection";
-        readonly utils: {
-            readonly col: "column";
-            readonly 'col-r': "column-reverse";
-            readonly 'row-r': "row-reverse";
-        };
+        readonly presets: readonly ["column", "column-reverse", "row-reverse"];
         readonly bp: 1;
     };
     readonly fx: {
@@ -1479,12 +1421,6 @@ export declare const PROPS: {
     };
     readonly gt: {
         readonly prop: "gridTemplate";
-        readonly presets: readonly ["repeat"];
-        readonly exUtility: {
-            readonly repeat: {
-                readonly 'grid-template': "repeat(var(--rows,1), 1fr) / repeat(var(--cols,1), 1fr)";
-            };
-        };
         readonly bp: 1;
     };
     readonly gta: {
@@ -1503,10 +1439,7 @@ export declare const PROPS: {
     };
     readonly gaf: {
         readonly prop: "gridAutoFlow";
-        readonly utils: {
-            readonly row: "row";
-            readonly col: "column";
-        };
+        readonly presets: readonly ["row", "column"];
         readonly bp: 1;
     };
     readonly gac: {
@@ -1550,67 +1483,55 @@ export declare const PROPS: {
     };
     readonly ai: {
         readonly prop: "alignItems";
-        readonly presets: readonly ["start", "center", "end", "stretch"];
-        readonly utils: {
-            readonly 'flex-s': "flex-start";
-            readonly 'flex-e': "flex-end";
-        };
+        readonly presets: readonly ["start", "center", "end", "stretch", "flex-start", "flex-end"];
         readonly shorthands: {
             readonly s: "start";
             readonly e: "end";
             readonly c: "center";
-            readonly fs: "flex-s";
-            readonly fe: "flex-e";
+            readonly fs: "flex-start";
+            readonly fe: "flex-end";
         };
         readonly bp: 1;
     };
     readonly ac: {
         readonly prop: "alignContent";
-        readonly presets: readonly ["start", "center", "end"];
+        readonly presets: readonly ["start", "center", "end", "flex-start", "flex-end"];
         readonly utils: {
             readonly between: "space-between";
-            readonly 'flex-s': "flex-start";
-            readonly 'flex-e': "flex-end";
         };
         readonly shorthands: {
             readonly s: "start";
             readonly e: "end";
             readonly c: "center";
-            readonly fs: "flex-s";
-            readonly fe: "flex-e";
+            readonly fs: "flex-start";
+            readonly fe: "flex-end";
         };
         readonly bp: 1;
     };
     readonly ji: {
         readonly prop: "justifyItems";
-        readonly presets: readonly ["start", "center", "end", "stretch"];
-        readonly utils: {
-            readonly 'flex-s': "flex-start";
-            readonly 'flex-e': "flex-end";
-        };
+        readonly presets: readonly ["start", "center", "end", "stretch", "flex-start", "flex-end"];
         readonly shorthands: {
             readonly s: "start";
             readonly e: "end";
             readonly c: "center";
-            readonly fs: "flex-s";
-            readonly fe: "flex-e";
+            readonly fs: "flex-start";
+            readonly fe: "flex-end";
         };
         readonly bp: 1;
     };
     readonly jc: {
         readonly prop: "justifyContent";
-        readonly presets: readonly ["start", "center", "end"];
+        readonly presets: readonly ["start", "center", "end", "flex-start", "flex-end"];
         readonly utils: {
             readonly between: "space-between";
-            readonly 'flex-s': "flex-start";
-            readonly 'flex-e': "flex-end";
         };
         readonly shorthands: {
             readonly s: "start";
             readonly e: "end";
             readonly c: "center";
-            readonly fs: "flex-s";
-            readonly fe: "flex-e";
+            readonly fs: "flex-start";
+            readonly fe: "flex-end";
         };
         readonly bp: 1;
     };
@@ -1629,8 +1550,8 @@ export declare const PROPS: {
             readonly s: "start";
             readonly e: "end";
             readonly c: "center";
-            readonly fs: "flex-s";
-            readonly fe: "flex-e";
+            readonly fs: "flex-start";
+            readonly fe: "flex-end";
         };
     };
     readonly jslf: {
@@ -1640,8 +1561,8 @@ export declare const PROPS: {
             readonly s: "start";
             readonly e: "end";
             readonly c: "center";
-            readonly fs: "flex-s";
-            readonly fe: "flex-e";
+            readonly fs: "flex-start";
+            readonly fe: "flex-end";
         };
     };
     readonly pslf: {
@@ -1654,9 +1575,7 @@ export declare const PROPS: {
     };
     readonly ovwrap: {
         readonly prop: "overflowWrap";
-        readonly utils: {
-            readonly any: "anywhere";
-        };
+        readonly presets: readonly ["anywhere"];
     };
     readonly whspace: {
         readonly prop: "whiteSpace";
@@ -1689,19 +1608,6 @@ export declare const STATES: {
     readonly isSide: "is--side";
     readonly isSkipFlow: "is--skipFlow";
     readonly isVertical: "is--vertical";
-    readonly setGutter: "set--gutter";
-    readonly setShadow: "set--shadow";
-    readonly setHov: "set--hov";
-    readonly setTransition: "set--transition";
-    readonly setMask: {
-        readonly className: "set--mask";
-        readonly setStyles: (propVal: string) => {
-            '--maskImg': string;
-        };
-    };
-    readonly setPlain: "set--plain";
-    readonly setInnerRs: "set--innerRs";
-    readonly setBp: "set--bp";
 };
 export declare const BREAK_POINTS: readonly ["sm", "md", "lg", "xl"];
 export declare const BREAK_POINTS_ALL: readonly ["base", "sm", "md", "lg", "xl"];

package/dist/css/base.css

@@ -1 +1 @@
-@property --sz--container{syntax:"<length-percentage>";initial-value:100cqi;inherits:true}:root{--sz--xl:1600px;--sz--l:1280px;--sz--m:56rem;--sz--s:42rem;--sz--xs:32rem;--sz--min:18rem;--black:#000;--white:#fff;--L:60%;--C:0.22;--red:oklch(var(--L) var(--C) 20);--orange:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.01) 52);--yellow:oklch(calc(var(--L) + 12%) calc(var(--C) - 0.025) 84);--green:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.02) 152);--blue:oklch(calc(var(--L) - 2%) calc(var(--C) + 0.01) 260);--purple:oklch(calc(var(--L) - 4%) calc(var(--C) + 0.02) 292);--pink:oklch(calc(var(--L) + 2%) calc(var(--C) + 0.02) 348);--gray:oklch(calc(var(--L) - 4%) 0.04 256);--brand:#1e5f8c;--accent:#d94a6a;--base:#fcfcfd;--base-2:#f1f2f3;--text:#141415;--text-2:#4d4f56;--link:oklch(50% 0.3 240);--divider:#dedfe3;--o--n10:0.75;--o--n20:0.5;--o--n30:0.25;--bdrs--5:2px;--bdrs--10:0.25rem;--bdrs--20:0.5rem;--bdrs--30:1rem;--bdrs--40:1.5rem;--bdrs--50:2rem;--bdrs--99:99rem;--sh-inset: ;--shc:rgba(20,20,21,.05);--shsz--5:0px 2px 4px;--shsz--10:1px 3px 6px;--shsz--20:1px 5px 10px;--shsz--30:2px 8px 16px;--shsz--40:3px 13px 26px;--shsz--50:5px 21px 42px;--ar--og:1.91/1;--gutter-size:var(--s30);--vertical-mode:vertical-rl;--REM:clamp(0.95rem,0.915rem + 0.15vw,1.05rem);--fz--base:var(--REM);--fz-mol:8;--fz--5xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 6));--fz--4xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 5));--fz--3xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 4));--fz--2xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 3));--fz--xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 2));--fz--l:calc(1em*var(--fz-mol)/(var(--fz-mol) - 1));--fz--m:1em;--fz--s:calc(1em*var(--fz-mol)/(var(--fz-mol) + 1));--fz--xs:calc(1em*var(--fz-mol)/(var(--fz-mol) + 2));--fz--2xs:calc(1em*var(--fz-mol)/(var(--fz-mol) + 3));--ff--base:-apple-system,"BlinkMacSystemFont","Hiragino Sans",sans-serif,"Segoe UI Emoji";--ff--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--ff--accent:"Garamond","Baskerville","Times New Roman",serif;--fw--light:300;--fw--normal:400;--fw--bold:600;--lts--base:normal;--lts--s:-0.05em;--lts--l:0.05em;--hl-unit:calc(var(--REM)*0.125);--hl--xs:var(--hl-unit);--hl--s:calc(var(--hl-unit)*2);--hl--base:calc(var(--hl-unit)*3);--hl--l:calc(var(--hl-unit)*4);--s-unit:calc(var(--REM)*0.5);--s5:calc(var(--s-unit)*0.5);--s10:var(--s-unit);--s15:calc(var(--s-unit)*1.5);--s20:calc(var(--s-unit)*2);--s30:calc(var(--s-unit)*3);--s40:calc(var(--s-unit)*5);--s50:calc(var(--s-unit)*8);--s60:calc(var(--s-unit)*13);--s70:calc(var(--s-unit)*21);--s80:calc(var(--s-unit)*34)}@property --hl{syntax:"<length>";inherits:true;initial-value:.25rem}.set--shadow,:root{--sh--5:var(--sh-inset) var(--shsz--5) var(--shc);--sh--10:var(--sh-inset) var(--shsz--10) var(--shc);--sh--20:var(--sh-inset) var(--shsz--20) var(--shc);--sh--30:var(--sh-inset) var(--shsz--30) var(--shc);--sh--40:var(--sh-inset) var(--shsz--40) var(--shc);--sh--50:var(--sh-inset) var(--shsz--50) var(--shc);--bxsh--5:var(--sh--5);--bxsh--10:var(--sh--5),var(--sh--10);--bxsh--20:var(--sh--10),var(--sh--20);--bxsh--30:var(--sh--20),var(--sh--30);--bxsh--40:var(--sh--30),var(--sh--40);--bxsh--50:var(--sh--40),var(--sh--50)}body{--hl:var(--hl--base);background-color:var(--base);color:var(--text);font-family:var(--ff--base);font-size:var(--fz--base);letter-spacing:var(--lts--base);text-underline-offset:var(--under-offset,.125em)}*{line-height:calc(1em + var(--hl)*2)}:is(h1,h2,h3,h4,h5,h6){font-family:var(--headings-ff,inherit);font-weight:var(--headings-fw,var(--fw--bold))}h1{font-size:var(--fz--3xl)}h2{font-size:var(--fz--2xl)}h3{font-size:var(--fz--xl)}h4{font-size:var(--fz--l)}h5,h6{font-size:var(--fz--m)}a{color:var(--link-c,var(--link));-webkit-text-decoration:var(--link-td,underline);text-decoration:var(--link-td,underline);text-decoration-color:var(--link-td-color,currentColor);text-decoration-thickness:var(--link-td-thickness,auto)}small{--hl:var(--hl--s);font-size:var(--fz--xs)}b,strong{font-weight:var(--fw--bold)}sub,sup{--hl:var(--hl--xs);font-size:80%}caption,figcaption,legend{font-size:var(--fz--s)}code,kbd,samp,var{font-family:var(--ff--mono)}blockquote{background-color:var(--base-2);padding:var(--s30)}hr{block-size:0;border:none;border-block-start:1px solid var(--divider)}:is(ul,ol):where(:not([class])),:is(ul,ol):where([class^="-"]){list-style:revert;padding-inline-start:var(--s30)}dt{font-weight:var(--fw--bold)}dd+dt{margin-block-start:var(--s20)}table{--td-c:inherit;--td-bgc:transparent;--td-p:var(--s5) var(--s10);--td-min-sz:initial}td{background-color:var(--td-bgc);color:var(--td-c);min-inline-size:var(--td-min-sz);padding:var(--td-p)}th{background-color:var(--th-bgc,var(--td-bgc));color:var(--th-c,var(--td-c));min-inline-size:var(--th-min-sz,var(--td-min-sz));padding:var(--th-p,var(--td-p))}::file-selector-button,button,input,select,textarea{background-color:var(--controls-bgc,var(--base-2));border:1px solid var(--controls-bdc,var(--divider));border-radius:var(--controls-bdrs,var(--bdrs--10));padding:var(--controls-p,var(--s5) var(--s10))}:disabled{opacity:var(--o--n20)}:focus-visible{outline-offset:var(--focus-offset,0)}:root{--_is_sm:unset;--_is_md:unset}@container (min-width: 480px){.set--bp{--_is_sm: }}@container (min-width: 800px){.set--bp{--_is_md: }}@media (any-hover:hover){.set--hov:hover{--_notHov: }.set--hov:not(:is(:hover,:focus-within)){--_isHov: }}@media (any-hover:none){.set--hov{--_isHov: }}.set--hov:is(:focus-visible,:focus-within){--_notHov: }.set--transition{transition:var(--hov-duration,.25s) var(--hov-ease,linear) var(--hov-delay,0s);transition-property:var(--hov-prop,all)}.set--innerRs{--bdrs--inner:calc(var(--bdrs, 0px) - var(--p, 0px))}.set--plain{background:none;border:none;border-radius:0;color:inherit;font:inherit;height:auto;line-height:calc(1em + var(--hl)*2);margin:0;max-height:none;max-width:none;min-height:0;min-width:0;padding:0;text-decoration:none;width:auto}.set--gutter{padding-inline:var(--gutter-size)}
+@property --sz--container{syntax:"<length-percentage>";initial-value:100cqi;inherits:true}:root{--sz--xl:1600px;--sz--l:1280px;--sz--m:56rem;--sz--s:42rem;--sz--xs:32rem;--sz--min:18rem;--black:#000;--white:#fff;--L:60%;--C:0.22;--red:oklch(var(--L) var(--C) 20);--orange:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.01) 52);--yellow:oklch(calc(var(--L) + 12%) calc(var(--C) - 0.025) 84);--green:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.02) 152);--blue:oklch(calc(var(--L) - 2%) calc(var(--C) + 0.01) 260);--purple:oklch(calc(var(--L) - 4%) calc(var(--C) + 0.02) 292);--pink:oklch(calc(var(--L) + 2%) calc(var(--C) + 0.02) 348);--gray:oklch(calc(var(--L) - 4%) 0.04 256);--brand:#1e5f8c;--accent:#d94a6a;--base:#fcfcfd;--base-2:#f1f2f3;--text:#141415;--text-2:#4d4f56;--link:oklch(50% 0.3 240);--divider:#dedfe3;--o--n10:0.75;--o--n20:0.5;--o--n30:0.25;--bdrs--10:0.25rem;--bdrs--20:0.5rem;--bdrs--30:1rem;--bdrs--40:1.5rem;--bdrs--99:99rem;--shc:rgba(20,20,21,.05);--shsz--5:0px 1px 3px;--shsz--10:0px 2px 6px;--shsz--20:0px 4px 12px;--shsz--30:0px 8px 24px;--shsz--40:0px 16px 48px;--ar--og:1.91/1;--gutter-size:var(--s30);--vertical-mode:vertical-rl;--REM:clamp(0.95rem,0.915rem + 0.15vw,1.05rem);--fz--base:var(--REM);--fz-mol:8;--fz--5xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 6));--fz--4xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 5));--fz--3xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 4));--fz--2xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 3));--fz--xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 2));--fz--l:calc(1em*var(--fz-mol)/(var(--fz-mol) - 1));--fz--m:1em;--fz--s:calc(1em*var(--fz-mol)/(var(--fz-mol) + 1));--fz--xs:calc(1em*var(--fz-mol)/(var(--fz-mol) + 2));--fz--2xs:calc(1em*var(--fz-mol)/(var(--fz-mol) + 3));--ff--base:-apple-system,"BlinkMacSystemFont","Hiragino Sans",sans-serif,"Segoe UI Emoji";--ff--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--ff--accent:"Garamond","Baskerville","Times New Roman",serif;--fw--light:300;--fw--normal:400;--fw--bold:600;--lts--base:normal;--lts--s:-0.05em;--lts--l:0.05em;--hl-unit:calc(var(--REM)*0.125);--hl--xs:var(--hl-unit);--hl--s:calc(var(--hl-unit)*2);--hl--base:calc(var(--hl-unit)*3);--hl--l:calc(var(--hl-unit)*4);--s-unit:calc(var(--REM)*0.5);--s5:calc(var(--s-unit)*0.5);--s10:var(--s-unit);--s15:calc(var(--s-unit)*1.5);--s20:calc(var(--s-unit)*2);--s30:calc(var(--s-unit)*3);--s40:calc(var(--s-unit)*5);--s50:calc(var(--s-unit)*8);--s60:calc(var(--s-unit)*13);--s70:calc(var(--s-unit)*21);--s80:calc(var(--s-unit)*34)}@property --hl{syntax:"<length>";inherits:true;initial-value:.25rem}.set--shadow,:root{--sh--5:var(--shsz--5) var(--shc);--sh--10:var(--shsz--10) var(--shc);--sh--20:var(--shsz--20) var(--shc);--sh--30:var(--shsz--30) var(--shc);--sh--40:var(--shsz--40) var(--shc);--bxsh--10:var(--sh--5),var(--sh--10);--bxsh--20:var(--sh--10),var(--sh--20);--bxsh--30:var(--sh--20),var(--sh--30);--bxsh--40:var(--sh--30),var(--sh--40)}body{--hl:var(--hl--base);background-color:var(--base);color:var(--text);font-family:var(--ff--base);font-size:var(--fz--base);letter-spacing:var(--lts--base);text-underline-offset:var(--under-offset,.125em)}*{line-height:calc(1em + var(--hl)*2)}:is(h1,h2,h3,h4,h5,h6){font-family:var(--headings-ff,inherit);font-weight:var(--headings-fw,var(--fw--bold))}h1{font-size:var(--fz--3xl)}h2{font-size:var(--fz--2xl)}h3{font-size:var(--fz--xl)}h4{font-size:var(--fz--l)}h5,h6{font-size:var(--fz--m)}a{color:var(--link-c,var(--link));-webkit-text-decoration:var(--link-td,underline);text-decoration:var(--link-td,underline);text-decoration-color:var(--link-td-color,currentColor);text-decoration-thickness:var(--link-td-thickness,auto)}small{--hl:var(--hl--s);font-size:var(--fz--xs)}b,strong{font-weight:var(--fw--bold)}sub,sup{--hl:var(--hl--xs);font-size:80%}code,kbd,samp,var{font-family:var(--ff--mono)}blockquote{background-color:var(--base-2);padding:var(--s30)}caption,figcaption,legend{font-size:var(--fz--s)}hr{block-size:0;border:none;border-block-start:1px solid var(--divider)}:is(ul,ol):where(:not([class])),:is(ul,ol):where([class^="-"]){list-style:revert;padding-inline-start:var(--list-px-s,var(--s30))}dt{font-weight:var(--fw--bold)}dd+dt{margin-block-start:var(--s20)}table{--td-c:inherit;--td-bgc:transparent;--td-p:var(--s10);--td-min-sz:initial}td{background-color:var(--td-bgc);color:var(--td-c);min-inline-size:var(--td-min-sz);padding:var(--td-p)}th{background-color:var(--th-bgc,var(--td-bgc));color:var(--th-c,var(--td-c));min-inline-size:var(--th-min-sz,var(--td-min-sz));padding:var(--th-p,var(--td-p))}::file-selector-button,button,input,select,textarea{background-color:var(--controls-bgc,var(--base-2));border:1px solid var(--controls-bdc,var(--divider));border-radius:var(--controls-bdrs,var(--bdrs--10));padding:var(--controls-p,var(--s5) var(--s10))}:disabled{opacity:var(--o--n20)}:focus-visible{outline-offset:var(--focus-offset,0)}:root{--_is_sm:unset;--_is_md:unset}@container (min-width: 480px){.set--bp{--_is_sm: }}@container (min-width: 800px){.set--bp{--_is_md: }}@media (any-hover:hover){.set--hov:hover{--_notHov: }.set--hov:not(:is(:hover,:focus-within)){--_isHov: }}@media (any-hover:none){.set--hov{--_isHov: }}.set--hov:is(:focus-visible,:focus-within){--_notHov: }.set--transition{transition:var(--hov-duration,.25s) var(--hov-ease,linear) var(--hov-delay,0s);transition-property:var(--hov-prop,all)}.set--innerRs{--bdrs--inner:calc(var(--bdrs, 0px) - var(--p, 0px))}.set--plain{background:none;border:none;border-radius:0;color:inherit;font:inherit;height:auto;line-height:calc(1em + var(--hl)*2);margin:0;max-height:none;max-width:none;min-height:0;min-width:0;padding:0;text-decoration:none;width:auto}.set--gutter{padding-inline:var(--gutter-size)}