lism-css 0.20.0 → 0.22.0

package/config/defaults/props.ts

@@ -79,6 +79,7 @@ export default {
   'min-h': { prop: 'minHeight', presets: ['100%'], token: 'sz', bp: 1 },
   'max-h': { prop: 'maxHeight', presets: ['100%'], token: 'sz', bp: 1 },
 
+  contentSize: { isVar: 1, presets: ['s', 'm', 'l', 'xl'], token: 'sz' },
   sz: { prop: 'inlineSize', token: 'sz' },
   'min-sz': { prop: 'minInlineSize', token: 'sz' },
   'max-sz': {
@@ -171,6 +172,7 @@ export default {
   pos: {
     prop: 'position',
     presets: ['static', 'fixed', 'sticky', 'relative', 'absolute'],
+    bp: 1,
   },
   z: { prop: 'zIndex', presets: ['-1', '0', '1', '99'] },
   t: { prop: 'top', utils: { 0: '0%' }, presets: ['50%', '100%'], token: 'space' },
@@ -316,7 +318,7 @@ export default {
     shorthands: PLACE_SHORTHANDS,
   },
   pslf: { prop: 'placeSelf', presets: PLACE_PRESETS },
-  order: { prop: 'order', presets: ['0', '-1', '1'] },
+  order: { prop: 'order', presets: ['0', '-1', '1'], bp: 1 },
 
   // transform
   // translate: {

package/config/defaults/traits.ts

@@ -1,12 +1,6 @@
 export default {
   isContainer: 'is--container',
-  isWrapper: {
-    className: 'is--wrapper',
-    preset: ['s', 'l'],
-    presetClass: '-contentSize',
-    customVar: '--contentSize',
-    tokenKey: 'sz',
-  },
+  isWrapper: 'is--wrapper',
   isLayer: 'is--layer',
   isBoxLink: 'is--boxLink',
   isCoverLink: 'is--coverLink',

package/dist/components/atomic/Icon/presets.d.ts

@@ -181,6 +181,10 @@ export declare const phIcons: {
     };
 };
 export declare const logoIcons: {
+    'logo-discord': {
+        viewBox: string;
+        path: string;
+    };
     'logo-facebook': {
         viewBox: string;
         path: string;
@@ -189,6 +193,10 @@ export declare const logoIcons: {
         viewBox: string;
         path: string;
     };
+    'logo-linkedin': {
+        viewBox: string;
+        path: string;
+    };
     'logo-line': {
         viewBox: string;
         path: string;
@@ -197,27 +205,27 @@ export declare const logoIcons: {
         viewBox: string;
         path: string;
     };
-    'logo-tiktok': {
+    'logo-threads': {
         viewBox: string;
         path: string;
     };
-    'logo-x': {
+    'logo-reddit': {
         viewBox: string;
         path: string;
     };
-    'logo-youtube': {
+    'logo-tiktok': {
         viewBox: string;
         path: string;
     };
-    'logo-codepen': {
+    'logo-x': {
         viewBox: string;
         path: string;
     };
-    'logo-github': {
+    'logo-youtube': {
         viewBox: string;
         path: string;
     };
-    'logo-tumblr': {
+    'logo-github': {
         viewBox: string;
         path: string;
     };
@@ -227,6 +235,10 @@ export declare const logoIcons: {
     };
 };
 declare const _default: {
+    'logo-discord': {
+        viewBox: string;
+        path: string;
+    };
     'logo-facebook': {
         viewBox: string;
         path: string;
@@ -235,6 +247,10 @@ declare const _default: {
         viewBox: string;
         path: string;
     };
+    'logo-linkedin': {
+        viewBox: string;
+        path: string;
+    };
     'logo-line': {
         viewBox: string;
         path: string;
@@ -243,27 +259,27 @@ declare const _default: {
         viewBox: string;
         path: string;
     };
-    'logo-tiktok': {
+    'logo-threads': {
         viewBox: string;
         path: string;
     };
-    'logo-x': {
+    'logo-reddit': {
         viewBox: string;
         path: string;
     };
-    'logo-youtube': {
+    'logo-tiktok': {
         viewBox: string;
         path: string;
     };
-    'logo-codepen': {
+    'logo-x': {
         viewBox: string;
         path: string;
     };
-    'logo-github': {
+    'logo-youtube': {
         viewBox: string;
         path: string;
     };
-    'logo-tumblr': {
+    'logo-github': {
         viewBox: string;
         path: string;
     };

package/dist/components/atomic/Icon/presets.js

@@ -205,58 +205,63 @@ const a = {
     // path: 'M221.66,133.66l-72,72a8,8,0,0,1-11.32-11.32L196.69,136H40a8,8,0,0,1,0-16H196.69L138.34,61.66a8,8,0,0,1,11.32-11.32l72,72A8,8,0,0,1,221.66,133.66',
   }
   // 右矢印、
-}, l = {
+}, c = {
+  "logo-discord": {
+    viewBox: "0 0 32 32",
+    path: "M26.07,6.66c-1.88-0.88-3.88-1.52-5.98-1.88c-0.26,0.47-0.56,1.09-0.77,1.59c-2.23-0.34-4.44-0.34-6.63,0 c-0.21-0.5-0.52-1.13-0.78-1.59c-2.1,0.36-4.11,1-5.99,1.88c-3.79,5.72-4.81,11.3-4.3,16.8c2.51,1.88,4.95,3.01,7.34,3.76 c0.59-0.81,1.12-1.68,1.57-2.59c-0.86-0.33-1.69-0.73-2.47-1.2c0.21-0.15,0.41-0.31,0.61-0.48c4.77,2.23,9.96,2.23,14.67,0 c0.2,0.17,0.4,0.33,0.61,0.48c-0.78,0.47-1.61,0.88-2.48,1.21c0.45,0.91,0.98,1.78,1.57,2.59c2.4-0.75,4.83-1.88,7.34-3.76 C30.98,17.09,29.35,11.56,26.07,6.66z M11.18,20.08c-1.43,0-2.61-1.34-2.61-2.97s1.15-2.97,2.61-2.97c1.46,0,2.63,1.34,2.61,2.97 C13.79,18.74,12.64,20.08,11.18,20.08z M20.82,20.08c-1.43,0-2.61-1.34-2.61-2.97s1.15-2.97,2.61-2.97c1.46,0,2.63,1.34,2.61,2.97 C23.42,18.74,22.27,20.08,20.82,20.08z"
+  },
   "logo-facebook": {
-    viewBox: "0 0 48 48",
-    path: "m34.5 26.8 1.2-8.1h-7.8v-5.3c0-2.2 1.1-4.4 4.6-4.4h3.6V2.1s-3.2-.6-6.3-.6c-6.4 0-10.6 3.9-10.6 11v6.2H12v8.1h7.2v19.7H28V26.8h6.5z"
+    viewBox: "0 0 32 32",
+    path: "M30,16.09c0-7.73-6.27-14-14-14s-14,6.27-14,14c0,6.99,5.12,12.78,11.81,13.83v-9.78h-3.55v-4.05h3.55V13 c0-3.51,2.09-5.45,5.29-5.45c1.53,0,3.13,0.27,3.13,0.27v3.45h-1.77c-1.74,0-2.28,1.08-2.28,2.19v2.63h3.88l-0.62,4.05h-3.26v9.78 C24.88,28.86,30,23.07,30,16.09"
   },
   "logo-instagram": {
-    viewBox: "0 0 48 48",
-    path: "M24 12.2c-6.5 0-11.8 5.2-11.8 11.8S17.4 35.8 24 35.8 35.8 30.6 35.8 24 30.5 12.2 24 12.2zm0 19.4c-4.2 0-7.6-3.4-7.6-7.6s3.4-7.6 7.6-7.6 7.6 3.4 7.6 7.6-3.4 7.6-7.6 7.6zm15-19.8c0 1.6-1.3 2.7-2.7 2.7-1.6 0-2.7-1.3-2.7-2.7s1.3-2.7 2.7-2.7 2.7 1.1 2.7 2.7zm7.8 2.7c-.2-3.7-1-6.9-3.8-9.6s-6-3.5-9.6-3.8c-3.8-.1-15-.1-18.9.1-3.7.2-6.9 1-9.6 3.7s-3.5 5.9-3.8 9.6c-.2 3.8-.2 15.1 0 18.9.2 3.7 1 6.9 3.8 9.6s5.9 3.5 9.6 3.8c3.8.2 15.1.2 18.9 0 3.7-.2 6.9-1 9.6-3.8 2.7-2.7 3.5-5.9 3.8-9.6.3-3.8.3-15 0-18.9zM42 37.6c-.8 2-2.3 3.5-4.4 4.4-3 1.1-10.2.9-13.6.9s-10.5.3-13.6-.9c-2-.8-3.5-2.3-4.4-4.4-1.1-3-.8-10.2-.8-13.6s-.3-10.5 1-13.6c.7-2 2.3-3.5 4.3-4.3 3-1.3 10.2-.9 13.6-.9s10.5-.3 13.6.9c2 .8 3.5 2.3 4.4 4.4 1.1 3 .9 10.2.9 13.6s.1 10.4-1 13.5z"
+    viewBox: "0 0 32 32",
+    path: "M16.01,8.83c-3.95,0-7.17,3.16-7.17,7.17s3.16,7.17,7.17,7.17s7.17-3.16,7.17-7.17S19.96,8.83,16.01,8.83z M16.01,20.62 c-2.55,0-4.62-2.07-4.62-4.62s2.07-4.62,4.62-4.62s4.62,2.07,4.62,4.62S18.56,20.62,16.01,20.62L16.01,20.62z M25.12,8.59 c0,0.97-0.79,1.64-1.64,1.64c-0.97,0-1.64-0.79-1.64-1.64c0-0.85,0.79-1.64,1.64-1.64C24.33,6.95,25.12,7.62,25.12,8.59z  M29.86,10.23c-0.12-2.25-0.61-4.19-2.31-5.83c-1.7-1.64-3.65-2.13-5.83-2.31c-2.31-0.06-9.12-0.06-11.49,0.06 C7.99,2.27,6.04,2.76,4.4,4.4s-2.13,3.59-2.31,5.83c-0.12,2.31-0.12,9.18,0,11.49c0.12,2.25,0.61,4.19,2.31,5.83 c1.7,1.64,3.59,2.13,5.83,2.31c2.31,0.12,9.18,0.12,11.49,0c2.25-0.12,4.19-0.61,5.83-2.31c1.64-1.64,2.13-3.59,2.31-5.83 C30.05,19.41,30.05,12.6,29.86,10.23L29.86,10.23z M26.95,24.27c-0.49,1.22-1.4,2.13-2.67,2.67c-1.82,0.67-6.2,0.55-8.26,0.55 s-6.38,0.18-8.26-0.55c-1.22-0.49-2.13-1.4-2.67-2.67C4.4,22.45,4.58,18.07,4.58,16S4.4,9.62,5.19,7.74 c0.43-1.22,1.4-2.13,2.61-2.61c1.82-0.79,6.2-0.55,8.26-0.55s6.38-0.18,8.26,0.55c1.22,0.49,2.13,1.4,2.67,2.67 c0.67,1.82,0.55,6.2,0.55,8.26S27.61,22.39,26.95,24.27z"
+  },
+  "logo-linkedin": {
+    viewBox: "0 0 32 32",
+    path: "M25.86,25.86h-4.15v-6.5c0-1.55-0.03-3.54-2.16-3.54c-2.16,0-2.49,1.69-2.49,3.43v6.61h-4.15V12.5h3.98v1.83h0.06 c0.81-1.39,2.32-2.22,3.93-2.16c4.2,0,4.98,2.77,4.98,6.36L25.86,25.86z M8.23,10.67c-1.33,0-2.41-1.08-2.41-2.41 c0-1.33,1.08-2.41,2.41-2.41c1.33,0,2.41,1.08,2.41,2.41c0,0.64-0.25,1.25-0.7,1.7C9.48,10.42,8.87,10.67,8.23,10.67 M10.3,25.86 H6.15V12.5h4.15V25.86z M27.93,2H4.07C2.94,1.99,2.01,2.89,2,4.02v23.96c0.01,1.13,0.94,2.03,2.07,2.02h23.86 c1.13,0.01,2.06-0.89,2.07-2.02V4.02C29.98,2.89,29.06,1.99,27.93,2"
   },
+  // LINE 公式ロゴ（テンプレートの SNS リンクで使用）
   "logo-line": {
-    viewBox: "0 0 48 48",
-    path: "M20.2 39.2c2.7.6 2.4 1.6 1.8 5.2-.1.6-.4 2.3 2 1.3 2.5-1 13.3-7.8 18.1-13.4 3.3-3.7 4.9-7.4 4.9-11.5C47 10.4 36.6 2 24 2S1 10.4 1 20.8C1 30 9.2 37.7 20.2 39.2zm12.3-23c0-.2.2-.4.4-.4h6.5c.2 0 .4.2.4.4v1.6c0 .2-.2.4-.4.4H35v1.7h4.4c.2 0 .4.2.4.4V22c0 .2-.2.4-.4.4H35V24h4.4c.2 0 .4.2.4.4V26c0 .2-.2.4-.4.4h-6.5c-.2 0-.4-.2-.4-.4v-9.8zm-11.1.1c0-.2.2-.4.4-.4h1.6c.1 0 .3.1.4.2l4.6 6.2v-6c0-.2.2-.4.4-.4h1.6c.2 0 .4.2.4.4v10c0 .2-.2.4-.4.4h-1.6c-.1 0-.3-.1-.4-.2l-4.6-6.2v6c0 .2-.2.4-.4.4h-1.6c-.2 0-.4-.2-.4-.4v-10zm-4.2-.1c0-.2.2-.4.4-.4h1.6c.2 0 .4.2.4.4v10c0 .2-.2.4-.4.4h-1.5c-.2 0-.4-.2-.4-.4v-10h-.1zm-8.7 0c0-.2.2-.4.4-.4h1.6c.2 0 .4.2.4.4v7.9h4.4c.2 0 .4.2.4.4v1.6c0 .2-.2.4-.4.4H8.9c-.1 0-.2-.1-.3-.1-.1-.1-.1-.2-.1-.3v-9.9z"
+    viewBox: "0 0 32 32",
+    path: "M13.6,25.58c1.7,0.38,1.51,1.01,1.13,3.28c-0.06,0.38-0.25,1.45,1.26,0.82c1.58-0.63,8.38-4.92,11.41-8.45 c2.08-2.33,3.09-4.67,3.09-7.25c0-6.56-6.56-11.85-14.5-11.85S1.5,7.42,1.5,13.98C1.5,19.78,6.67,24.63,13.6,25.58z M21.36,11.08 c0-0.13,0.13-0.25,0.25-0.25h4.1c0.13,0,0.25,0.13,0.25,0.25v1.01c0,0.13-0.13,0.25-0.25,0.25h-2.77v1.07h2.77 c0.13,0,0.25,0.13,0.25,0.25v1.07c0,0.13-0.13,0.25-0.25,0.25h-2.77V16h2.77c0.13,0,0.25,0.13,0.25,0.25v1.01 c0,0.13-0.13,0.25-0.25,0.25h-4.1c-0.13,0-0.25-0.13-0.25-0.25V11.08z M14.36,11.14c0-0.13,0.13-0.25,0.25-0.25h1.01 c0.06,0,0.19,0.06,0.25,0.13l2.9,3.91v-3.78c0-0.13,0.13-0.25,0.25-0.25h1.01c0.13,0,0.25,0.13,0.25,0.25v6.3 c0,0.13-0.13,0.25-0.25,0.25h-1.01c-0.06,0-0.19-0.06-0.25-0.13l-2.9-3.91v3.78c0,0.13-0.13,0.25-0.25,0.25h-1.01 c-0.13,0-0.25-0.13-0.25-0.25V11.14z M11.71,11.08c0-0.13,0.13-0.25,0.25-0.25h1.01c0.13,0,0.25,0.13,0.25,0.25v6.3 c0,0.13-0.13,0.25-0.25,0.25h-0.95c-0.13,0-0.25-0.13-0.25-0.25v-6.3H11.71z M6.23,11.08c0-0.13,0.13-0.25,0.25-0.25h1.01 c0.13,0,0.25,0.13,0.25,0.25v4.98h2.77c0.13,0,0.25,0.13,0.25,0.25v1.01c0,0.13-0.13,0.25-0.25,0.25H6.48 c-0.06,0-0.13-0.06-0.19-0.06c-0.06-0.06-0.06-0.13-0.06-0.19L6.23,11.08z"
   },
   "logo-pinterest": {
-    viewBox: "0 0 48 48",
-    path: "M47 24c0 12.8-10.2 23-23 23-2.4 0-4.7-.3-6.8-1 .9-1.6 2.3-4.1 2.8-6.1.3-1 1.5-5.4 1.5-5.4.7 1.5 2.9 2.6 5.2 2.6 6.9 0 11.9-6.4 11.9-14.3 0-7.6-6.2-13.3-14.2-13.3-9.9 0-15.2 6.7-15.2 13.9 0 3.3 1.8 7.5 4.7 8.9.4.2.6.1.7-.3.1-.3.4-1.9.6-2.6.1-.2 0-.4-.2-.6-.9-1.2-1.7-3.2-1.7-5.2 0-5.1 3.9-9.9 10.4-9.9 5.6 0 9.6 3.9 9.6 9.4 0 6.3-3.1 10.6-7.2 10.6-2.3 0-4-1.9-3.4-4.2.6-2.7 1.9-5.6 1.9-7.6 0-1.8-.9-3.2-2.9-3.2-2.3 0-4.2 2.4-4.2 5.5 0 2.1.7 3.4.7 3.4s-2.3 9.6-2.7 11.4c-.4 2-.3 4.8-.1 6.6C7.1 42.1 1 33.7 1 24 1 11.2 11.2 1 24 1s23 10.2 23 23z"
+    viewBox: "0 0 32 32",
+    path: "M30,16c0,7.79-6.21,14-14,14c-1.46,0-2.86-0.18-4.14-0.61c0.55-0.97,1.4-2.5,1.7-3.71c0.18-0.61,0.91-3.29,0.91-3.29 c0.43,0.91,1.77,1.58,3.17,1.58c4.2,0,7.24-3.9,7.24-8.7c0-4.63-3.77-8.1-8.64-8.1c-6.03,0-9.25,4.08-9.25,8.46 c0,2.01,1.1,4.57,2.86,5.42c0.24,0.12,0.37,0.06,0.43-0.18c0.06-0.18,0.24-1.16,0.37-1.58c0.06-0.12,0-0.24-0.12-0.37 c-0.55-0.73-1.03-1.95-1.03-3.17c0-3.1,2.37-6.03,6.33-6.03c3.41,0,5.84,2.37,5.84,5.72c0,3.83-1.89,6.45-4.38,6.45 c-1.4,0-2.43-1.16-2.07-2.56c0.37-1.64,1.16-3.41,1.16-4.63c0-1.1-0.55-1.95-1.77-1.95c-1.4,0-2.56,1.46-2.56,3.35 c0,1.28,0.43,2.07,0.43,2.07s-1.4,5.84-1.64,6.94c-0.24,1.22-0.18,2.92-0.06,4.02C5.71,27.02,2,21.9,2,16C2,8.21,8.21,2,16,2 S30,8.21,30,16z"
+  },
+  "logo-threads": {
+    viewBox: "0 0 32 32",
+    path: "M16.22,30L16.22,30c-4.19-0.03-7.4-1.41-9.56-4.09c-1.92-2.39-2.91-5.72-2.94-9.9v-0.02c0.03-4.17,1.02-7.5,2.95-9.9c2.16-2.69,5.37-4.07,9.55-4.1h0.01h0.01c3.2,0.02,5.88,0.85,7.96,2.45c1.96,1.51,3.33,3.65,4.09,6.38l-2.38,0.66c-1.29-4.62-4.55-6.98-9.69-7.02c-3.39,0.03-5.96,1.09-7.63,3.17C7.02,9.59,6.22,12.4,6.19,16c0.03,3.6,0.84,6.41,2.4,8.36c1.67,2.08,4.24,3.15,7.63,3.17c3.06-0.02,5.08-0.74,6.77-2.39c1.92-1.88,1.89-4.19,1.27-5.6c-0.36-0.83-1.02-1.52-1.91-2.04c-0.22,1.58-0.73,2.85-1.5,3.82c-1.03,1.29-2.5,1.99-4.35,2.09c-1.4,0.08-2.76-0.25-3.8-0.94c-1.24-0.8-1.97-2.03-2.04-3.46c-0.08-1.39,0.48-2.67,1.55-3.6c1.03-0.89,2.47-1.41,4.18-1.51c1.26-0.07,2.44-0.01,3.52,0.17c-0.15-0.87-0.44-1.55-0.87-2.05c-0.6-0.68-1.53-1.03-2.75-1.04c-0.01,0-0.02,0-0.03,0c-0.99,0-2.32,0.27-3.18,1.54l-2.05-1.37c1.14-1.7,3-2.63,5.22-2.63c0.02,0,0.03,0,0.05,0c3.73,0.02,5.95,2.3,6.17,6.29c0.13,0.05,0.25,0.11,0.38,0.17c1.74,0.82,3.01,2.06,3.68,3.58c0.93,2.13,1.02,5.59-1.81,8.35C22.56,29.02,19.94,29.97,16.22,30L16.22,30L16.22,30z M17.39,16.36c-0.28,0-0.57,0.01-0.86,0.03c-2.14,0.12-3.48,1.1-3.4,2.5c0.08,1.46,1.69,2.14,3.25,2.06c1.43-0.08,3.29-0.63,3.6-4.33C19.18,16.45,18.32,16.36,17.39,16.36z"
+  },
+  "logo-reddit": {
+    viewBox: "0 0 32 32",
+    path: "M18.92,20.91c-0.62,0.63-1.97,0.85-2.92,0.85c-0.95,0-2.29-0.22-2.92-0.85c-0.15-0.15-0.38-0.15-0.53,0c-0.15,0.15-0.15,0.38,0,0.53c0.98,0.98,2.89,1.07,3.46,1.07c0.55,0,2.45-0.07,3.45-1.07c0.13-0.15,0.13-0.38,0-0.53C19.3,20.76,19.07,20.76,18.92,20.91z M14.23,17.59c0-0.8-0.65-1.45-1.45-1.45c-0.8,0-1.45,0.65-1.45,1.45c0,0.8,0.65,1.47,1.45,1.45C13.58,19.04,14.23,18.39,14.23,17.59z M16,2C8.27,2,2,8.27,2,16s6.27,14,14,14s14-6.27,14-14S23.73,2,16,2z M24.11,18c0.03,0.2,0.05,0.42,0.05,0.62c0,3.15-3.66,5.69-8.16,5.69c-4.51,0-8.16-2.55-8.16-5.69c0-0.22,0.02-0.42,0.05-0.62c-0.7-0.32-1.2-1.02-1.2-1.85c0-1.12,0.9-2.04,2.04-2.04c0.55,0,1.05,0.22,1.42,0.57c1.42-1.02,3.37-1.67,5.54-1.74l1.04-4.87c0.02-0.1,0.07-0.18,0.15-0.23c0.07-0.05,0.17-0.07,0.27-0.05l3.39,0.72c0.23-0.48,0.73-0.82,1.3-0.82c0.8,0,1.45,0.65,1.45,1.45c0,0.8-0.65,1.45-1.45,1.45c-0.78,0-1.42-0.62-1.45-1.39l-3.04-0.65l-0.93,4.37c2.14,0.08,4.06,0.73,5.46,1.74c0.37-0.35,0.87-0.57,1.42-0.57c1.12,0,2.04,0.9,2.04,2.04C25.31,16.97,24.81,17.69,24.11,18z M19.19,16.15c-0.8,0-1.45,0.65-1.45,1.45c0,0.8,0.65,1.45,1.45,1.45c0.8,0,1.45-0.67,1.45-1.45C20.64,16.8,19.99,16.15,19.19,16.15z"
   },
   "logo-tiktok": {
-    viewBox: "0 0 48 48",
-    path: "M43.2 20c-3.8 0-7.5-1.2-10.6-3.4V32c0 7.7-6.3 14-14 14s-14-6.3-14-14 6.3-14 14-14c.6 0 1.3 0 1.9.1v7.7c-3.4-1.1-7 .8-8 4.2s.8 7 4.2 8c3.4 1.1 7-.8 8-4.2.2-.6.3-1.3.3-1.9V2h7.6c0 .6 0 1.3.2 1.9.5 2.8 2.2 5.3 4.6 6.9 1.7 1.1 3.7 1.7 5.8 1.7V20z"
+    viewBox: "0 0 32 32",
+    path: "M28.28,13.45c-2.42,0-4.77-0.76-6.75-2.16v9.8c0,4.9-4.01,8.91-8.91,8.91s-8.91-4.01-8.91-8.91s4.01-8.91,8.91-8.91c0.38,0,0.83,0,1.21,0.06v4.9c-2.16-0.7-4.45,0.51-5.09,2.67c-0.64,2.16,0.51,4.45,2.67,5.09c2.16,0.7,4.45-0.51,5.09-2.67c0.13-0.38,0.19-0.83,0.19-1.21V2h4.84c0,0.38,0,0.83,0.13,1.21l0,0c0.32,1.78,1.4,3.37,2.93,4.39c1.08,0.7,2.35,1.08,3.69,1.08C28.28,8.68,28.28,13.45,28.28,13.45z"
   },
-  // 'logo-twitter': {
-  // 	viewBox: '0 0 48 48',
-  // 	path: 'M41.5 15v1.2c0 11.9-9.1 25.7-25.7 25.7-5.1 0-9.9-1.5-13.8-4 .7.1 1.4.1 2.2.1 4.2 0 8.1-1.4 11.2-3.9-4-.1-7.3-2.7-8.4-6.3.5.1 1.1.2 1.6.2.8 0 1.6-.1 2.4-.3-4.1-.8-7.2-4.5-7.2-8.9v-.1c1.2.7 2.6 1.1 4.1 1.1-2.4-1.6-4-4.4-4-7.5 0-1.7.4-3.2 1.2-4.6 4.4 5.5 11.1 9 18.6 9.4-.1-.7-.2-1.4-.2-2.1 0-5 4-9 9-9 2.6 0 4.9 1.1 6.6 2.8 2-.4 4-1.1 5.7-2.2-.7 2.1-2.1 3.9-4 5 1.8-.2 3.6-.7 5.2-1.4-1.2 2-2.8 3.6-4.5 4.8z',
-  // },
   "logo-x": {
-    viewBox: "0 0 48 48",
-    path: "M28.1,20.6L44.1,2h-3.8L26.4,18.2L15.3,2H2.5l16.8,24.5L2.5,46h3.8L21,28.9L32.7,46h12.8L28.1,20.6L28.1,20.6z M22.9,26.7 l-1.7-2.4L7.6,4.9h5.8l10.9,15.6l1.7,2.4l14.2,20.3h-5.8L22.9,26.7L22.9,26.7z"
+    viewBox: "0 0 32 32",
+    path: "M18.42,13.99L27.88,3h-2.25l-8.21,9.57L10.86,3H3.3l9.93,14.48L3.3,29h2.25l8.69-10.1L21.14,29h7.56 L18.42,13.99L18.42,13.99z M15.35,17.6l-1-1.42L6.31,4.71h3.43l6.44,9.22l1,1.42l8.39,12h-3.43L15.35,17.6L15.35,17.6z"
   },
   "logo-youtube": {
-    viewBox: "0 0 48 48",
-    path: "M46.1 12.9c-.5-2-2.1-3.6-4.1-4.1-3.6-1-18-1-18-1s-14.4 0-18 .9c-2 .5-3.6 2.1-4.1 4.1C1 16.5 1 24 1 24s0 7.5.9 11.2c.5 2 2.1 3.5 4.1 4.1 3.6.9 18 .9 18 .9s14.4 0 18-.9c2-.5 3.6-2 4.1-4.1.9-3.7.9-11.2.9-11.2s0-7.5-.9-11.1zm-26.8 18V17.2l12 6.8-12 6.9z"
-  },
-  "logo-codepen": {
-    viewBox: "0 0 48 48",
-    path: "M45.7 15.5 25.2 1.8c-.7-.4-1.4-.4-2.1 0L2.4 15.5c-.5.3-.8 1-.8 1.6v13.7c0 .6.3 1.2.8 1.6L23 46.1c.7.4 1.4.4 2.1 0l20.6-13.7c.5-.3.8-1 .8-1.6V17.1c0-.6-.3-1.2-.8-1.6zM26 7l15.1 10.1-6.8 4.5L26 16V7zm-3.9 0v9l-8.4 5.6L7 17.1 22.1 7zM5.4 20.7l4.8 3.3-4.8 3.3v-6.6zM22.1 41 7 30.9l6.7-4.5 8.4 5.6v9zM24 28.6 17.2 24l6.9-4.6L31 24l-7 4.6zM26 41v-9l8.4-5.6 6.8 4.5L26 41zm16.7-13.7L37.8 24l4.8-3.3v6.6h.1z"
+    viewBox: "0 0 32 32",
+    path: "M29.93,9c-0.32-1.26-1.32-2.27-2.58-2.58C25.08,5.79,16,5.79,16,5.79s-9.08,0-11.35,0.57 C3.39,6.67,2.38,7.68,2.07,8.94C1.5,11.27,1.5,16,1.5,16s0,4.73,0.57,7.06c0.32,1.26,1.32,2.21,2.58,2.58 C6.92,26.21,16,26.21,16,26.21s9.08,0,11.35-0.57c1.26-0.32,2.27-1.26,2.58-2.58C30.5,20.73,30.5,16,30.5,16S30.5,11.27,29.93,9z M13.04,20.35v-8.64L20.6,16L13.04,20.35L13.04,20.35z"
   },
   "logo-github": {
-    viewBox: "0 0 48 48",
-    path: "M23.7 1.5C10.8 1.5 1 11.3 1 24.2c0 10.2 6.5 19.1 15.7 22.2 1.1.2 1.6-.5 1.6-1.1v-5.6s-6.5 1.4-7.8-2.7c0 0-1-2.7-2.6-3.3 0 0-2.1-1.5.1-1.5 0 0 2.3.2 3.6 2.4 2 3.6 5.4 2.5 6.8 2 .2-1.5.8-2.5 1.5-3.1-5.2-.5-10.5-1.4-10.5-10.2 0-2.5.7-3.9 2.2-5.4-.2-.6-1-3.1.2-6.3 2-.6 6.4 2.5 6.4 2.5 1.9-.5 3.9-.8 5.9-.8s4 .3 5.9.8c0 0 4.5-3.1 6.4-2.5 1.3 3.2.5 5.6.2 6.3 1.5 1.7 2.4 2.9 2.4 5.4 0 9-5.4 9.6-10.7 10.2.8.7 1.6 2.1 1.6 4.3v7.7c0 .6.4 1.4 1.6 1.2 9.5-3.1 15.8-12 15.8-22.3C47 11.3 36.5 1.5 23.7 1.5z"
+    viewBox: "0 0 32 32",
+    path: "M15.73,2.32C7.93,2.32,2,8.25,2,16.05c0,6.17,3.93,11.55,9.49,13.43c0.67,0.12,0.97-0.3,0.97-0.67s0-2.3,0-3.39c0,0-3.93,0.85-4.72-1.63c0,0-0.6-1.63-1.57-2c0,0-1.27-0.91,0.06-0.91c0,0,1.39,0.12,2.18,1.45c1.21,2.18,3.27,1.51,4.11,1.21c0.12-0.91,0.48-1.51,0.91-1.87c-3.14-0.3-6.35-0.85-6.35-6.17c0-1.51,0.42-2.36,1.33-3.27c-0.12-0.36-0.6-1.87,0.12-3.81c1.21-0.36,3.87,1.51,3.87,1.51c1.15-0.3,2.36-0.48,3.57-0.48s2.42,0.18,3.57,0.48c0,0,2.72-1.87,3.87-1.51c0.79,1.94,0.3,3.39,0.12,3.81c0.91,1.03,1.45,1.75,1.45,3.27c0,5.44-3.27,5.81-6.47,6.17c0.48,0.42,0.97,1.27,0.97,2.6c0,1.87,0,4.23,0,4.66c0,0.36,0.24,0.85,0.97,0.73C26.19,27.78,30,22.4,30,16.17C29.82,8.25,23.47,2.32,15.73,2.32z"
   },
   // 'logo-medium': {
   // 	viewBox: '0 0 48 48',
   // 	path: 'M14 10.9C6.9 10.9 1 16.8 1 24s5.9 13.1 13 13.1S27 31.2 27 24s-5.8-13.1-13-13.1zm20.7.8c-3.6 0-6.5 5.5-6.5 12.3s2.9 12.3 6.5 12.3 6.5-5.5 6.5-12.3c-.1-6.8-2.9-12.3-6.5-12.3zm10 1.3c-1.3 0-2.3 4.9-2.3 11s1 11 2.3 11C46 35 47 30.1 47 24s-1-11-2.3-11z',
   // },
-  "logo-tumblr": {
-    viewBox: "0 0 48 48",
-    path: "M36.9 43.3c-1.2 1.3-4.3 2.7-8.4 2.7-10.4 0-12.6-7.6-12.6-12.1V21.6h-4.1c-.5 0-.9-.4-.9-.9v-5.9c0-.6.4-1.2 1-1.4 5.3-1.9 7-6.6 7.2-10.1.1-1 .6-1.4 1.4-1.4h6.1c.5 0 .9.4.9.9v9.9h7.1c.5 0 .9.4.9.9v7c0 .5-.4.9-.9.9h-7.1V33c0 2.9 2.1 4.6 5.9 3 .4-.2.8-.3 1.1-.2.3.1.5.3.7.7l1.9 5.6c0 .4.1.9-.2 1.2z"
-  },
   "logo-amazon": {
-    viewBox: "0 0 48 48",
-    path: "M27.4 15c-4.9.2-17.2 1.6-17.2 11.9 0 11.1 14 11.6 18.6 4.4.7 1 3.6 3.8 4.6 4.7l5.8-5.7s-3.3-2.6-3.3-5.4V10.1c0-2.6-2.5-8.3-11.4-8.3S10.8 7.4 10.8 12.4l7.5.7c1.7-5 5.5-5 5.5-5 4.1-.1 3.6 3 3.6 6.9zm0 8.8c0 8.1-8.5 6.9-8.5 1.7 0-4.8 5.1-5.7 8.5-5.9v4.2zm13.8 16.6c-.8 1-7.1 6.8-17.7 6.8S4.8 40 2.3 37c-.7-.8.1-1.1.6-.8 7.4 4.5 19 11.9 37.8 3.1.7-.5 1.2.1.5 1.1zm4 .2c-.7 1.6-1.6 2.7-2.1 3.1-.6.5-1 .3-.7-.4s2-4.7 1.3-5.6c-.7-.8-3.8-.4-4.9-.3-1.1.1-1.3.2-1.4 0-.2-.6 2.2-1.6 3.8-1.8s4.2-.1 4.7.6c.3.6 0 2.8-.7 4.4z"
+    viewBox: "0 0 32 32",
+    path: "M18.08,10.14c-3.02,0.12-10.61,0.99-10.61,7.34c0,6.85,8.63,7.15,11.47,2.71c0.43,0.62,2.22,2.34,2.84,2.9l3.58-3.52c0,0-2.04-1.6-2.04-3.33V7.12c0-1.6-1.54-5.12-7.03-5.12S7.85,5.45,7.85,8.54l4.63,0.43c1.05-3.08,3.39-3.08,3.39-3.08C18.39,5.82,18.08,7.74,18.08,10.14L18.08,10.14z M18.08,15.57c0,5-5.24,4.26-5.24,1.05c0-2.96,3.15-3.52,5.24-3.64V15.57z M26.6,25.81C26.1,26.42,22.22,30,15.68,30S4.15,25.56,2.6,23.71c-0.43-0.49,0.06-0.68,0.37-0.49c4.56,2.78,11.72,7.34,23.31,1.91C26.72,24.82,27.03,25.19,26.6,25.81z M29.06,25.93c-0.43,0.99-0.99,1.67-1.3,1.91c-0.37,0.31-0.62,0.19-0.43-0.25c0.19-0.43,1.23-2.9,0.8-3.45c-0.43-0.49-2.34-0.25-3.02-0.19c-0.68,0.06-0.8,0.12-0.86,0c-0.12-0.37,1.36-0.99,2.34-1.11c0.99-0.12,2.59-0.06,2.9,0.37C29.68,23.59,29.49,24.94,29.06,25.93L29.06,25.93z"
   }
   // 'logo-wordpress': {
   // 	viewBox: '0 0 48 48',
@@ -267,10 +272,10 @@ const a = {
   // Snapchat
 }, h = {
   ...a,
-  ...l
+  ...c
 };
 export {
   h as default,
-  l as logoIcons,
+  c as logoIcons,
   a as phIcons
 };

package/dist/components/layout/AutoColumns/AutoColumns.stories.d.ts

@@ -4,4 +4,4 @@ declare const meta: Meta<typeof AutoColumns>;
 export default meta;
 type Story = StoryObj<typeof AutoColumns>;
 export declare const Default: Story;
-export declare const WithAutoFill: Story;
+export declare const WithAutoFit: Story;

package/dist/components/state/Wrapper/Wrapper.d.ts

@@ -1,6 +1,4 @@
 import { LismComponentProps } from '../../Lism';
-type WrapperProps = LismComponentProps & {
-    contentSize?: LismComponentProps['isWrapper'];
-};
-export default function Wrapper({ contentSize, ...props }: WrapperProps): import("react").JSX.Element;
+type WrapperProps = LismComponentProps;
+export default function Wrapper(props: WrapperProps): import("react").JSX.Element;
 export {};

package/dist/components/state/Wrapper/index.js

@@ -1,8 +1,8 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "../../Lism/index.js";
-function m({ contentSize: r, ...p }) {
-  return /* @__PURE__ */ t(e, { isWrapper: r || !0, ...p });
+import { jsx as p } from "react/jsx-runtime";
+import t from "../../Lism/index.js";
+function i(r) {
+  return /* @__PURE__ */ p(t, { isWrapper: !0, ...r });
 }
 export {
-  m as default
+  i as default
 };

package/dist/config/default-config.d.ts

@@ -169,6 +169,11 @@ declare const _default: {
             readonly token: "sz";
             readonly bp: 1;
         };
+        readonly contentSize: {
+            readonly isVar: 1;
+            readonly presets: readonly ["s", "m", "l", "xl"];
+            readonly token: "sz";
+        };
         readonly sz: {
             readonly prop: "inlineSize";
             readonly token: "sz";
@@ -346,6 +351,7 @@ declare const _default: {
         readonly pos: {
             readonly prop: "position";
             readonly presets: readonly ["static", "fixed", "sticky", "relative", "absolute"];
+            readonly bp: 1;
         };
         readonly z: {
             readonly prop: "zIndex";
@@ -756,6 +762,7 @@ declare const _default: {
         readonly order: {
             readonly prop: "order";
             readonly presets: readonly ["0", "-1", "1"];
+            readonly bp: 1;
         };
         readonly ovw: {
             readonly prop: "overflowWrap";
@@ -785,13 +792,7 @@ declare const _default: {
     };
     readonly traits: {
         readonly isContainer: "is--container";
-        readonly isWrapper: {
-            readonly className: "is--wrapper";
-            readonly preset: readonly ["s", "l"];
-            readonly presetClass: "-contentSize";
-            readonly customVar: "--contentSize";
-            readonly tokenKey: "sz";
-        };
+        readonly isWrapper: "is--wrapper";
         readonly isLayer: "is--layer";
         readonly isBoxLink: "is--boxLink";
         readonly isCoverLink: "is--coverLink";

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

@@ -159,6 +159,11 @@ declare const _default: {
         readonly token: "sz";
         readonly bp: 1;
     };
+    readonly contentSize: {
+        readonly isVar: 1;
+        readonly presets: readonly ["s", "m", "l", "xl"];
+        readonly token: "sz";
+    };
     readonly sz: {
         readonly prop: "inlineSize";
         readonly token: "sz";
@@ -336,6 +341,7 @@ declare const _default: {
     readonly pos: {
         readonly prop: "position";
         readonly presets: readonly ["static", "fixed", "sticky", "relative", "absolute"];
+        readonly bp: 1;
     };
     readonly z: {
         readonly prop: "zIndex";
@@ -746,6 +752,7 @@ declare const _default: {
     readonly order: {
         readonly prop: "order";
         readonly presets: readonly ["0", "-1", "1"];
+        readonly bp: 1;
     };
     readonly ovw: {
         readonly prop: "overflowWrap";

package/dist/config/defaults/props.js

@@ -54,6 +54,7 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
   "max-w": { prop: "maxWidth", presets: ["100%"], token: "sz", bp: 1 },
   "min-h": { prop: "minHeight", presets: ["100%"], token: "sz", bp: 1 },
   "max-h": { prop: "maxHeight", presets: ["100%"], token: "sz", bp: 1 },
+  contentSize: { isVar: 1, presets: ["s", "m", "l", "xl"], token: "sz" },
   sz: { prop: "inlineSize", token: "sz" },
   "min-sz": { prop: "minInlineSize", token: "sz" },
   "max-sz": {
@@ -142,7 +143,8 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
   // position
   pos: {
     prop: "position",
-    presets: ["static", "fixed", "sticky", "relative", "absolute"]
+    presets: ["static", "fixed", "sticky", "relative", "absolute"],
+    bp: 1
   },
   z: { prop: "zIndex", presets: ["-1", "0", "1", "99"] },
   t: { prop: "top", utils: { 0: "0%" }, presets: ["50%", "100%"], token: "space" },
@@ -283,7 +285,7 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
     shorthands: p
   },
   pslf: { prop: "placeSelf", presets: e },
-  order: { prop: "order", presets: ["0", "-1", "1"] },
+  order: { prop: "order", presets: ["0", "-1", "1"], bp: 1 },
   // transform
   // translate: {
   // 	prop: 'translate',

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

@@ -1,12 +1,6 @@
 declare const _default: {
     readonly isContainer: "is--container";
-    readonly isWrapper: {
-        readonly className: "is--wrapper";
-        readonly preset: readonly ["s", "l"];
-        readonly presetClass: "-contentSize";
-        readonly customVar: "--contentSize";
-        readonly tokenKey: "sz";
-    };
+    readonly isWrapper: "is--wrapper";
     readonly isLayer: "is--layer";
     readonly isBoxLink: "is--boxLink";
     readonly isCoverLink: "is--coverLink";

package/dist/config/defaults/traits.js

@@ -1,12 +1,6 @@
 const s = {
   isContainer: "is--container",
-  isWrapper: {
-    className: "is--wrapper",
-    preset: ["s", "l"],
-    presetClass: "-contentSize",
-    customVar: "--contentSize",
-    tokenKey: "sz"
-  },
+  isWrapper: "is--wrapper",
   isLayer: "is--layer",
   isBoxLink: "is--boxLink",
   isCoverLink: "is--coverLink",

package/dist/config/index.d.ts

@@ -169,6 +169,11 @@ export declare const CONFIG: {
             readonly token: "sz";
             readonly bp: 1;
         };
+        readonly contentSize: {
+            readonly isVar: 1;
+            readonly presets: readonly ["s", "m", "l", "xl"];
+            readonly token: "sz";
+        };
         readonly sz: {
             readonly prop: "inlineSize";
             readonly token: "sz";
@@ -346,6 +351,7 @@ export declare const CONFIG: {
         readonly pos: {
             readonly prop: "position";
             readonly presets: readonly ["static", "fixed", "sticky", "relative", "absolute"];
+            readonly bp: 1;
         };
         readonly z: {
             readonly prop: "zIndex";
@@ -756,6 +762,7 @@ export declare const CONFIG: {
         readonly order: {
             readonly prop: "order";
             readonly presets: readonly ["0", "-1", "1"];
+            readonly bp: 1;
         };
         readonly ovw: {
             readonly prop: "overflowWrap";
@@ -785,13 +792,7 @@ export declare const CONFIG: {
     };
     traits: {
         readonly isContainer: "is--container";
-        readonly isWrapper: {
-            readonly className: "is--wrapper";
-            readonly preset: readonly ["s", "l"];
-            readonly presetClass: "-contentSize";
-            readonly customVar: "--contentSize";
-            readonly tokenKey: "sz";
-        };
+        readonly isWrapper: "is--wrapper";
         readonly isLayer: "is--layer";
         readonly isBoxLink: "is--boxLink";
         readonly isCoverLink: "is--coverLink";
@@ -974,6 +975,11 @@ export declare const PROPS: {
         readonly token: "sz";
         readonly bp: 1;
     };
+    readonly contentSize: {
+        readonly isVar: 1;
+        readonly presets: readonly ["s", "m", "l", "xl"];
+        readonly token: "sz";
+    };
     readonly sz: {
         readonly prop: "inlineSize";
         readonly token: "sz";
@@ -1151,6 +1157,7 @@ export declare const PROPS: {
     readonly pos: {
         readonly prop: "position";
         readonly presets: readonly ["static", "fixed", "sticky", "relative", "absolute"];
+        readonly bp: 1;
     };
     readonly z: {
         readonly prop: "zIndex";
@@ -1561,6 +1568,7 @@ export declare const PROPS: {
     readonly order: {
         readonly prop: "order";
         readonly presets: readonly ["0", "-1", "1"];
+        readonly bp: 1;
     };
     readonly ovw: {
         readonly prop: "overflowWrap";
@@ -1590,13 +1598,7 @@ export declare const PROPS: {
 };
 export declare const TRAITS: {
     readonly isContainer: "is--container";
-    readonly isWrapper: {
-        readonly className: "is--wrapper";
-        readonly preset: readonly ["s", "l"];
-        readonly presetClass: "-contentSize";
-        readonly customVar: "--contentSize";
-        readonly tokenKey: "sz";
-    };
+    readonly isWrapper: "is--wrapper";
     readonly isLayer: "is--layer";
     readonly isBoxLink: "is--boxLink";
     readonly isCoverLink: "is--coverLink";

package/dist/css/base/set.css

@@ -1 +1 @@
-@media (any-hover:hover){.set--var\:hov:hover{--_notHov: }.set--var\:hov:not(:is(:hover,:focus-within)){--_isHov: }}@media (any-hover:none){.set--var\:hov{--_isHov: }}.set--var\:hov:is(:focus-visible,:focus-within){--_notHov: }.set--var\:bdrsInner{--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}:is(ul,ol).set--revert{list-style:revert;padding-inline-start:var(--list-ps,1.75em)}
+@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--bdrsInner{--bdrs--inner:calc(var(--bdrs, 0px) - var(--p, 0px))}.set--bleed{--bleed:max(var(--gutter,var(--gutter--base)),calc((100cqi - min(100cqi, var(--contentSize, var(--sz--m)))) / 2))}.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}:is(ul,ol).set--revert{list-style:revert;padding-inline-start:var(--list-ps,1.75em)}

package/dist/css/base.css

@@ -1 +1 @@
-@property --sz--bleed{syntax:"<length-percentage>";initial-value:100svi;inherits:true}:root{--sz--xl:1600px;--sz--l:1200px;--sz--m:880px;--sz--s:640px;--sz--xs:400px;--black:#000;--white:#fff;--L:60%;--C:0.2;--red:oklch(var(--L) var(--C) 20);--orange:oklch(calc(var(--L) + 6%) calc(var(--C) - 0.01) 48);--yellow:oklch(calc(var(--L) + 12%) calc(var(--C) - 0.02) 80);--green:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.01) 152);--blue:oklch(calc(var(--L) - 4%) calc(var(--C) + 0.01) 264);--purple:oklch(calc(var(--L) - 4%) calc(var(--C) + 0.01) 288);--pink:oklch(calc(var(--L) + 2%) calc(var(--C) + 0.01) 352);--gray:oklch(calc(var(--L) - 4%) calc(var(--C)/10) 240);--brand:#1e5f8c;--accent:#d94a6a;--base:#fcfcfc;--base-2:#f2f2f3;--text:#141414;--text-2:#4e5155;--link:oklch(50% 0.3 240);--divider:#dfe0e2;--shadow:rgba(20,20,21,.12);--neutral:#cbcccd;--o--mp:0.9;--o--p:0.75;--o--pp:0.5;--o--ppp:0.25;--bdrs--10:0.25rem;--bdrs--20:0.5rem;--bdrs--30:1rem;--bdrs--40:1.5rem;--bdrs--99:99rem;--ar--og:1.91/1;--gutter-size:var(--s30);--flow--base:var(--s30);--flow--s:var(--s20)}:root:where([lang=ja]){--flow--base:var(--s35)}@property --hl{syntax:"<length>";inherits:true;initial-value:.25rem}:root{--fz--base:1rem;--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.025em;--lts--l:0.05em;--lts--xl:0.1em;--hl-unit:calc(var(--fz--base)*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)}.set--var\:s,:root{--s-unit:calc(var(--fz--base)*0.5);--s10:var(--s-unit);--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);--s5:calc(var(--s-unit)*0.5);--s15:calc(var(--s-unit)*1.5);--s25:calc(var(--s-unit)*2.5);--s35:calc(var(--s-unit)*4)}.set--var\:s{--s-unit:0.5em}:root{--shc:var(--shadow);--shsz--10:0px 1px 3px;--shsz--20:0px 2px 6px;--shsz--30:0px 4px 12px;--shsz--40:0px 8px 24px;--shsz--50:0px 16px 48px}.set--var\:bxsh,:root{--bxsh--10:var(--shsz--10) var(--shc);--bxsh--20:var(--shsz--20) var(--shc);--bxsh--30:var(--shsz--30) var(--shc);--bxsh--40:var(--shsz--40) var(--shc);--bxsh--50:var(--shsz--50) var(--shc)}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,.25em)}*{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)}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);letter-spacing:normal}:where(blockquote>p)+p{margin-block-start:var(--s10)}blockquote,q{font-style:italic}blockquote,pre{background-color:var(--base-2);padding:var(--s20)}caption,figcaption{font-size:var(--fz--s)}hr{block-size:0;border:none;border-block-start:1px solid var(--divider)}:is(ul,ol):where(:not([class])){list-style:revert;padding-inline-start:var(--list-ps,1.75em)}dt{font-weight:var(--fw--bold)}dd+dt{margin-block-start:var(--s20)}table{--td-c:inherit;--td-bgc:transparent;--td-p:var(--s10) var(--s15);--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:not([type=range]),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--pp)}:focus-visible{outline-offset:var(--focus-offset,0)}@media (any-hover:hover){.set--var\:hov:hover{--_notHov: }.set--var\:hov:not(:is(:hover,:focus-within)){--_isHov: }}@media (any-hover:none){.set--var\:hov{--_isHov: }}.set--var\:hov:is(:focus-visible,:focus-within){--_notHov: }.set--var\:bdrsInner{--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}:is(ul,ol).set--revert{list-style:revert;padding-inline-start:var(--list-ps,1.75em)}
+@property --sz--bleed{syntax:"<length-percentage>";initial-value:100svi;inherits:true}:root{--sz--xl:1600px;--sz--l:1200px;--sz--m:880px;--sz--s:640px;--sz--xs:400px;--black:#000;--white:#fff;--L:60%;--C:0.2;--red:oklch(var(--L) var(--C) 20);--orange:oklch(calc(var(--L) + 6%) calc(var(--C) - 0.01) 48);--yellow:oklch(calc(var(--L) + 12%) calc(var(--C) - 0.02) 80);--green:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.01) 152);--blue:oklch(calc(var(--L) - 4%) calc(var(--C) + 0.01) 264);--purple:oklch(calc(var(--L) - 4%) calc(var(--C) + 0.01) 288);--pink:oklch(calc(var(--L) + 2%) calc(var(--C) + 0.01) 352);--gray:oklch(calc(var(--L) - 4%) calc(var(--C)/10) 240);--brand:#1e5f8c;--accent:#d94a6a;--base:#fcfcfc;--base-2:#f2f2f3;--text:#141414;--text-2:#4e5155;--link:oklch(50% 0.3 240);--divider:#dfe0e2;--shadow:rgba(20,20,21,.12);--neutral:#cbcccd;--o--mp:0.9;--o--p:0.75;--o--pp:0.5;--o--ppp:0.25;--bdrs--10:0.25rem;--bdrs--20:0.5rem;--bdrs--30:1rem;--bdrs--40:1.5rem;--bdrs--99:99rem;--ar--og:1.91/1;--gutter--base:var(--s30);--flow--base:var(--s30);--flow--s:var(--s20)}:root:where([lang=ja]){--flow--base:var(--s35)}@property --hl{syntax:"<length>";inherits:true;initial-value:.25rem}:root{--fz--base:1rem;--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.025em;--lts--l:0.05em;--lts--xl:0.1em;--hl-unit:calc(var(--fz--base)*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)}.set--s,:root{--s-unit:calc(var(--fz--base)*0.5);--s10:var(--s-unit);--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);--s5:calc(var(--s-unit)*0.5);--s15:calc(var(--s-unit)*1.5);--s25:calc(var(--s-unit)*2.5);--s35:calc(var(--s-unit)*4)}.set--s{--s-unit:0.5em}:root{--shc:var(--shadow);--shsz--10:0px 1px 3px;--shsz--20:0px 2px 6px;--shsz--30:0px 4px 12px;--shsz--40:0px 8px 24px;--shsz--50:0px 16px 48px}.set--bxsh,:root{--bxsh--10:var(--shsz--10) var(--shc);--bxsh--20:var(--shsz--20) var(--shc);--bxsh--30:var(--shsz--30) var(--shc);--bxsh--40:var(--shsz--40) var(--shc);--bxsh--50:var(--shsz--50) var(--shc)}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);-moz-tab-size:4;-o-tab-size:4;tab-size:4;text-underline-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)}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);letter-spacing:normal}:where(blockquote>p)+p{margin-block-start:var(--s10)}blockquote,q{font-style:italic}blockquote,pre{background-color:var(--base-2);padding:var(--s20)}caption,figcaption{font-size:var(--fz--s)}hr{block-size:0;border:none;border-block-start:1px solid var(--divider)}:is(ul,ol):where(:not([class])){list-style:revert;padding-inline-start:var(--list-ps,1.75em)}dt{font-weight:var(--fw--bold)}dd+dt{margin-block-start:var(--s20)}td,th{padding:var(--cells-p,.625em .875em)}::file-selector-button,button,input:not([type=range]),select,textarea{background-color:var(--controls-bgc,var(--base-2));border:1px solid var(--controls-bdc,var(--divider));padding:var(--controls-p,.25em .5em)}:disabled{opacity:var(--o--pp)}:focus-visible{outline-offset:var(--focus-offset,0)}@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--bdrsInner{--bdrs--inner:calc(var(--bdrs, 0px) - var(--p, 0px))}.set--bleed{--bleed:max(var(--gutter,var(--gutter--base)),calc((100cqi - min(100cqi, var(--contentSize, var(--sz--m)))) / 2))}.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}:is(ul,ol).set--revert{list-style:revert;padding-inline-start:var(--list-ps,1.75em)}