/**
 * Generated from packages/soracom-design-system/dist/tokens.json.
 * DO NOT EDIT - run npm run generate:token-artifacts instead.
 */

:root,
:host {

  /* space */
  --ds-space-xxlarge: 80px;
  --ds-space-xlarge: 60px;
  --ds-space-mlarge: 50px;
  --ds-space-large: 40px;
  --ds-space-medium: 30px;
  --ds-space-small: 20px;
  --ds-space-xsmall: 10px;
  --ds-space-xxsmall: 5px;

  /* color */
  --color-red: oklch(58.87% .1915 28.23deg);
  --color-blue: oklch(57.94% .2301 262.18deg);
  --color-celeste: oklch(77.67% .1218 201.68deg);
  --color-ink: oklch(60.79% .0384 248.46deg);
  --color-gray: oklch(53.08% .0174 298.27deg);
  --color-mauve: oklch(53.62% .0487 296.55deg);
  --color-green: oklch(59.03% .1285 154.14deg);
  --color-yellow: oklch(87.59% .1673 97.84deg);
  --color-purple: oklch(50.18% .1551 290.55deg);
  --color-orange: oklch(68.19% .1699 54.49deg);
  --color-magenta: oklch(61.36% .2283 341.38deg);
  --color-red-950: oklch(24.51% .0944 31.43deg);
  --color-red-900: oklch(32.66% .1255 30.09deg);
  --color-red-800: oklch(37.72% .1424 29.71deg);
  --color-red-700: oklch(44.98% .1669 29.44deg);
  --color-red-600: oklch(51.4% .1852 29.18deg);
  --color-red-400: oklch(65.53% .1866 23.46deg);
  --color-red-300: oklch(75.14% .1338 16.19deg);
  --color-red-200: oklch(88.25% .0654 4.2deg);
  --color-red-100: oklch(93.2% .0364 2.98deg);
  --color-red-50: oklch(96.78% .0166 3.65deg);
  --color-blue-950: oklch(22.96% .0969 260.61deg);
  --color-blue-900: oklch(30.53% .1385 261.73deg);
  --color-blue-800: oklch(35.57% .165 262.04deg);
  --color-blue-700: oklch(42.98% .2047 262.37deg);
  --color-blue-600: oklch(49.72% .2412 262.59deg);
  --color-blue-400: oklch(66.4% .1779 262.7deg);
  --color-blue-300: oklch(76.9% .1173 263.52deg);
  --color-blue-200: oklch(86.86% .0641 264.59deg);
  --color-blue-100: oklch(93.24% .0321 264.41deg);
  --color-blue-50: oklch(97.2% .0132 262.38deg);
  --color-celeste-950: oklch(27.54% .0434 225.95deg);
  --color-celeste-900: oklch(35.5% .0589 225.23deg);
  --color-celeste-800: oklch(43.71% .0721 223.78deg);
  --color-celeste-700: oklch(55.36% .089 212.26deg);
  --color-celeste-600: oklch(65.74% .1058 207.96deg);
  --color-celeste-400: oklch(82.05% .1062 200.6deg);
  --color-celeste-300: oklch(87.27% .0777 200.92deg);
  --color-celeste-200: oklch(92.73% .0463 199.73deg);
  --color-celeste-100: oklch(96.27% .0241 199.93deg);
  --color-celeste-50: oklch(98.39% .0106 204.13deg);
  --color-ink-950: oklch(24.53% .0136 253.08deg);
  --color-ink-900: oklch(28.53% .0162 248.4deg);
  --color-ink-800: oklch(35.11% .022 248.45deg);
  --color-ink-700: oklch(39.96% .0256 248.47deg);
  --color-ink-600: oklch(51.7% .0352 249.99deg);
  --color-ink-400: oklch(70.13% .0346 249.75deg);
  --color-ink-300: oklch(80.06% .0258 246.27deg);
  --color-ink-200: oklch(89.33% .0157 248deg);
  --color-ink-100: oklch(94.68% .0086 247.92deg);
  --color-ink-50: oklch(98.07% .0051 247.88deg);
  --color-gray-950: oklch(22.02% .006 301.06deg);
  --color-gray-900: oklch(28.76% .0073 297.37deg);
  --color-gray-800: oklch(32.94% .0108 300.97deg);
  --color-gray-700: oklch(39.49% .0119 298.89deg);
  --color-gray-600: oklch(45.46% .0147 295.99deg);
  --color-gray-400: oklch(64.29% .0165 298.39deg);
  --color-gray-300: oklch(76.41% .0101 299.18deg);
  --color-gray-200: oklch(86.88% .0055 297.71deg);
  --color-gray-100: oklch(93.26% .0041 301.42deg);
  --color-gray-50: oklch(97.31% 0 0deg);
  --color-mauve-950: oklch(22.37% .0156 296.57deg);
  --color-mauve-900: oklch(28.92% .022 296.46deg);
  --color-mauve-800: oklch(33.43% .0264 294.1deg);
  --color-mauve-700: oklch(39.95% .0338 296.3deg);
  --color-mauve-600: oklch(45.86% .041 297.59deg);
  --color-mauve-400: oklch(63.95% .0497 297.47deg);
  --color-mauve-300: oklch(75.99% .0331 297.54deg);
  --color-mauve-200: oklch(86.53% .0209 298.14deg);
  --color-mauve-100: oklch(92.91% .0122 296.34deg);
  --color-mauve-50: oklch(96.93% .0067 295.45deg);
  --color-green-950: oklch(23.89% .0434 155.69deg);
  --color-green-900: oklch(31.29% .0612 155.1deg);
  --color-green-800: oklch(36.27% .074 154.89deg);
  --color-green-700: oklch(43.36% .0903 154.93deg);
  --color-green-600: oklch(50.14% .1069 154.42deg);
  --color-green-400: oklch(73.7% .1567 154.55deg);
  --color-green-300: oklch(81.31% .1117 157.78deg);
  --color-green-200: oklch(89.21% .0634 159.74deg);
  --color-green-100: oklch(94.41% .0338 160.44deg);
  --color-green-50: oklch(97.6% .0132 159.92deg);
  --color-yellow-950: oklch(28.35% .0194 98.89deg);
  --color-yellow-900: oklch(38.43% .0353 99.08deg);
  --color-yellow-800: oklch(46.44% .0575 99.34deg);
  --color-yellow-700: oklch(61.32% .0932 99.09deg);
  --color-yellow-600: oklch(80.12% .1262 98.53deg);
  --color-yellow-400: oklch(90.03% .144 98.34deg);
  --color-yellow-300: oklch(93.07% .1056 99.36deg);
  --color-yellow-200: oklch(95.98% .0601 98.18deg);
  --color-yellow-100: oklch(97.89% .0317 99.2deg);
  --color-yellow-50: oklch(98.99% .0133 97.44deg);
  --color-purple-950: oklch(20.94% .0503 292.11deg);
  --color-purple-900: oklch(27.12% .0753 291.54deg);
  --color-purple-800: oklch(31.19% .0897 290.9deg);
  --color-purple-700: oklch(37.25% .1118 290.8deg);
  --color-purple-600: oklch(42.72% .1329 290.64deg);
  --color-purple-400: oklch(61.82% .1165 293.3deg);
  --color-purple-300: oklch(74.42% .0764 294.86deg);
  --color-purple-200: oklch(85.98% .0404 296.59deg);
  --color-purple-100: oklch(92.67% .0219 297.41deg);
  --color-purple-50: oklch(96.96% .008 293.91deg);
  --color-orange-950: oklch(26.75% .0609 63.27deg);
  --color-orange-900: oklch(35.54% .0839 59.35deg);
  --color-orange-800: oklch(41.2% .0996 57.06deg);
  --color-orange-700: oklch(50.02% .1222 56.13deg);
  --color-orange-600: oklch(57.84% .1432 55.01deg);
  --color-orange-400: oklch(75.01% .1733 54.88deg);
  --color-orange-300: oklch(82.14% .1244 60.82deg);
  --color-orange-200: oklch(89.56% .0695 61.81deg);
  --color-orange-100: oklch(94.46% .0357 61.95deg);
  --color-orange-50: oklch(97.8% .0144 64.35deg);
  --color-magenta-950: oklch(24.38% .0829 340.33deg);
  --color-magenta-900: oklch(32.31% .1181 341.04deg);
  --color-magenta-800: oklch(37.81% .1407 341.37deg);
  --color-magenta-700: oklch(45.6% .1731 341.47deg);
  --color-magenta-600: oklch(52.96% .2042 341.9deg);
  --color-magenta-400: oklch(68.23% .1867 339.26deg);
  --color-magenta-300: oklch(77.66% .1263 337.49deg);
  --color-magenta-200: oklch(87.18% .07 335.39deg);
  --color-magenta-100: oklch(93.41% .0344 336.19deg);
  --color-magenta-50: oklch(97.2% .0157 335.05deg);
  --color-red-dim: light-dark(var(--color-red-950), var(--color-red-50));
  --color-red-dark: light-dark(var(--color-red-700), var(--color-red-300));
  --color-red-darker: light-dark(var(--color-red-800), var(--color-red-200));
  --color-red-darkest: light-dark(var(--color-red-900), var(--color-red-100));
  --color-red-shade: light-dark(var(--color-red-600), var(--color-red-400));
  --color-red-tint: light-dark(var(--color-red-400), var(--color-red-600));
  --color-red-light: light-dark(var(--color-red-300), var(--color-red-700));
  --color-red-lighter: light-dark(var(--color-red-200), var(--color-red-800));
  --color-red-lightest: light-dark(var(--color-red-100), var(--color-red-900));
  --color-red-bright: light-dark(var(--color-red-50), var(--color-red-950));
  --color-blue-dim: light-dark(var(--color-blue-950), var(--color-blue-50));
  --color-blue-dark: light-dark(var(--color-blue-700), var(--color-blue-300));
  --color-blue-darker: light-dark(var(--color-blue-800), var(--color-blue-200));
  --color-blue-darkest: light-dark(var(--color-blue-900), var(--color-blue-100));
  --color-blue-shade: light-dark(var(--color-blue-600), var(--color-blue-400));
  --color-blue-tint: light-dark(var(--color-blue-400), var(--color-blue-600));
  --color-blue-light: light-dark(var(--color-blue-300), var(--color-blue-700));
  --color-blue-lighter: light-dark(var(--color-blue-200), var(--color-blue-800));
  --color-blue-lightest: light-dark(var(--color-blue-100), var(--color-blue-900));
  --color-blue-bright: light-dark(var(--color-blue-50), var(--color-blue-950));
  --color-celeste-dim: light-dark(var(--color-celeste-950), var(--color-celeste-50));
  --color-celeste-dark: light-dark(var(--color-celeste-700), var(--color-celeste-300));
  --color-celeste-darker: light-dark(var(--color-celeste-800), var(--color-celeste-200));
  --color-celeste-darkest: light-dark(var(--color-celeste-900), var(--color-celeste-100));
  --color-celeste-shade: light-dark(var(--color-celeste-600), var(--color-celeste-400));
  --color-celeste-tint: light-dark(var(--color-celeste-400), var(--color-celeste-600));
  --color-celeste-light: light-dark(var(--color-celeste-300), var(--color-celeste-700));
  --color-celeste-lighter: light-dark(var(--color-celeste-200), var(--color-celeste-800));
  --color-celeste-lightest: light-dark(var(--color-celeste-100), var(--color-celeste-900));
  --color-celeste-bright: light-dark(var(--color-celeste-50), var(--color-celeste-950));
  --color-ink-dim: light-dark(var(--color-ink-950), var(--color-ink-50));
  --color-ink-dark: light-dark(var(--color-ink-700), var(--color-ink-300));
  --color-ink-darker: light-dark(var(--color-ink-800), var(--color-ink-200));
  --color-ink-darkest: light-dark(var(--color-ink-900), var(--color-ink-100));
  --color-ink-shade: light-dark(var(--color-ink-600), var(--color-ink-400));
  --color-ink-tint: light-dark(var(--color-ink-400), var(--color-ink-600));
  --color-ink-light: light-dark(var(--color-ink-300), var(--color-ink-700));
  --color-ink-lighter: light-dark(var(--color-ink-200), var(--color-ink-800));
  --color-ink-lightest: light-dark(var(--color-ink-100), var(--color-ink-900));
  --color-ink-bright: light-dark(var(--color-ink-50), var(--color-ink-950));
  --color-gray-dim: light-dark(var(--color-gray-950), var(--color-gray-50));
  --color-gray-dark: light-dark(var(--color-gray-700), var(--color-gray-300));
  --color-gray-darker: light-dark(var(--color-gray-800), var(--color-gray-200));
  --color-gray-darkest: light-dark(var(--color-gray-900), var(--color-gray-100));
  --color-gray-shade: light-dark(var(--color-gray-600), var(--color-gray-400));
  --color-gray-tint: light-dark(var(--color-gray-400), var(--color-gray-600));
  --color-gray-light: light-dark(var(--color-gray-300), var(--color-gray-700));
  --color-gray-lighter: light-dark(var(--color-gray-200), var(--color-gray-800));
  --color-gray-lightest: light-dark(var(--color-gray-100), var(--color-gray-900));
  --color-gray-bright: light-dark(var(--color-gray-50), var(--color-gray-950));
  --color-mauve-dim: light-dark(var(--color-mauve-950), var(--color-mauve-50));
  --color-mauve-dark: light-dark(var(--color-mauve-700), var(--color-mauve-300));
  --color-mauve-darker: light-dark(var(--color-mauve-800), var(--color-mauve-200));
  --color-mauve-darkest: light-dark(var(--color-mauve-900), var(--color-mauve-100));
  --color-mauve-shade: light-dark(var(--color-mauve-600), var(--color-mauve-400));
  --color-mauve-tint: light-dark(var(--color-mauve-400), var(--color-mauve-600));
  --color-mauve-light: light-dark(var(--color-mauve-300), var(--color-mauve-700));
  --color-mauve-lighter: light-dark(var(--color-mauve-200), var(--color-mauve-800));
  --color-mauve-lightest: light-dark(var(--color-mauve-100), var(--color-mauve-900));
  --color-mauve-bright: light-dark(var(--color-mauve-50), var(--color-mauve-950));
  --color-green-dim: light-dark(var(--color-green-950), var(--color-green-50));
  --color-green-dark: light-dark(var(--color-green-700), var(--color-green-300));
  --color-green-darker: light-dark(var(--color-green-800), var(--color-green-200));
  --color-green-darkest: light-dark(var(--color-green-900), var(--color-green-100));
  --color-green-shade: light-dark(var(--color-green-600), var(--color-green-400));
  --color-green-tint: light-dark(var(--color-green-400), var(--color-green-600));
  --color-green-light: light-dark(var(--color-green-300), var(--color-green-700));
  --color-green-lighter: light-dark(var(--color-green-200), var(--color-green-800));
  --color-green-lightest: light-dark(var(--color-green-100), var(--color-green-900));
  --color-green-bright: light-dark(var(--color-green-50), var(--color-green-950));
  --color-yellow-dim: light-dark(var(--color-yellow-950), var(--color-yellow-50));
  --color-yellow-dark: light-dark(var(--color-yellow-700), var(--color-yellow-300));
  --color-yellow-darker: light-dark(var(--color-yellow-800), var(--color-yellow-200));
  --color-yellow-darkest: light-dark(var(--color-yellow-900), var(--color-yellow-100));
  --color-yellow-shade: light-dark(var(--color-yellow-600), var(--color-yellow-400));
  --color-yellow-tint: light-dark(var(--color-yellow-400), var(--color-yellow-600));
  --color-yellow-light: light-dark(var(--color-yellow-300), var(--color-yellow-700));
  --color-yellow-lighter: light-dark(var(--color-yellow-200), var(--color-yellow-800));
  --color-yellow-lightest: light-dark(var(--color-yellow-100), var(--color-yellow-900));
  --color-yellow-bright: light-dark(var(--color-yellow-50), var(--color-yellow-950));
  --color-purple-dim: light-dark(var(--color-purple-950), var(--color-purple-50));
  --color-purple-dark: light-dark(var(--color-purple-700), var(--color-purple-300));
  --color-purple-darker: light-dark(var(--color-purple-800), var(--color-purple-200));
  --color-purple-darkest: light-dark(var(--color-purple-900), var(--color-purple-100));
  --color-purple-shade: light-dark(var(--color-purple-600), var(--color-purple-400));
  --color-purple-tint: light-dark(var(--color-purple-400), var(--color-purple-600));
  --color-purple-light: light-dark(var(--color-purple-300), var(--color-purple-700));
  --color-purple-lighter: light-dark(var(--color-purple-200), var(--color-purple-800));
  --color-purple-lightest: light-dark(var(--color-purple-100), var(--color-purple-900));
  --color-purple-bright: light-dark(var(--color-purple-50), var(--color-purple-950));
  --color-orange-dim: light-dark(var(--color-orange-950), var(--color-orange-50));
  --color-orange-dark: light-dark(var(--color-orange-700), var(--color-orange-300));
  --color-orange-darker: light-dark(var(--color-orange-800), var(--color-orange-200));
  --color-orange-darkest: light-dark(var(--color-orange-900), var(--color-orange-100));
  --color-orange-shade: light-dark(var(--color-orange-600), var(--color-orange-400));
  --color-orange-tint: light-dark(var(--color-orange-400), var(--color-orange-600));
  --color-orange-light: light-dark(var(--color-orange-300), var(--color-orange-700));
  --color-orange-lighter: light-dark(var(--color-orange-200), var(--color-orange-800));
  --color-orange-lightest: light-dark(var(--color-orange-100), var(--color-orange-900));
  --color-orange-bright: light-dark(var(--color-orange-50), var(--color-orange-950));
  --color-magenta-dim: light-dark(var(--color-magenta-950), var(--color-magenta-50));
  --color-magenta-dark: light-dark(var(--color-magenta-700), var(--color-magenta-300));
  --color-magenta-darker: light-dark(var(--color-magenta-800), var(--color-magenta-200));
  --color-magenta-darkest: light-dark(var(--color-magenta-900), var(--color-magenta-100));
  --color-magenta-shade: light-dark(var(--color-magenta-600), var(--color-magenta-400));
  --color-magenta-tint: light-dark(var(--color-magenta-400), var(--color-magenta-600));
  --color-magenta-light: light-dark(var(--color-magenta-300), var(--color-magenta-700));
  --color-magenta-lighter: light-dark(var(--color-magenta-200), var(--color-magenta-800));
  --color-magenta-lightest: light-dark(var(--color-magenta-100), var(--color-magenta-900));
  --color-magenta-bright: light-dark(var(--color-magenta-50), var(--color-magenta-950));
  --color-warning: var(--color-orange);
  --color-alert: var(--color-red);
  --color-success: var(--color-green);
  --color-info: var(--color-blue);
  --color-mute: var(--color-ink-400);
  --color-default: light-dark(var(--color-ink-600), var(--color-ink-200));
  --color-default-shade: light-dark(var(--color-ink-700), var(--color-ink-100));
  --color-default-tint: light-dark(var(--color-ink), var(--color-ink-300));
  --color-default-light: var(--color-ink-400);
  --color-default-lighter: light-dark(var(--color-ink-300), var(--color-ink));
  --color-default-lightest: light-dark(var(--color-ink-200), var(--color-ink-600));
  --color-background: light-dark(oklch(100% 0 0deg), var(--color-ink-900));
  --color-background-shade: light-dark(oklch(60.79% .0384 248.46deg / 6.25%), var(--color-ink-800));
  --color-background-dark: light-dark(oklch(60.79% .0384 248.46deg / 15%), var(--color-ink-700));
  --color-background-darker: light-dark(oklch(60.79% .0384 248.46deg / 29%), var(--color-ink-600));
  --color-background-darkest: light-dark(oklch(60.79% .0384 248.46deg / 52%), var(--color-ink));
  --color-highlight: var(--color-celeste);
  --color-link: light-dark(var(--color-celeste-700), var(--color-celeste));
  --color-dark-dark: var(--color-ink-900);
  --color-dark-light: light-dark(var(--color-ink-900), oklch(100% 0 0deg));
  --color-light-light: oklch(100% 0 0deg);
  --color-light-dark: light-dark(oklch(100% 0 0deg), var(--color-ink-900));
  --color-shadow-light: light-dark(oklch(32.29% .0554 269.14deg / 5%), oklch(11.51% .0094 267.45deg / 5%));
  --color-shadow: light-dark(oklch(32.29% .0554 269.14deg / 10%), oklch(11.51% .0094 267.45deg / 10%));
  --color-shadow-dark: light-dark(oklch(32.29% .0554 269.14deg / 30%), oklch(11.51% .0094 267.45deg / 30%));
  --color-transparent: oklch(100% 0 0deg / 0%);
  --color-focus: oklch(86.77% .1478 203.44deg);
  --color-black: oklch(0% 0 0deg);
  --color-white: oklch(100% 0 0deg);

  /* icon-size */
  --ds-icon-size-4xsmall: 1.2rem;
  --ds-icon-size-3xsmall: 1.3rem;
  --ds-icon-size-2xsmall: 1.5rem;
  --ds-icon-size-xsmall: 1.8rem;
  --ds-icon-size-small: 2.2rem;
  --ds-icon-size-medium: 2.8rem;
  --ds-icon-size-large: 3.6rem;
  --ds-icon-size-xlarge: 4.6rem;
  --ds-icon-size-2xlarge: 5.8rem;
  --ds-icon-size-3xlarge: 7.2rem;
  --ds-icon-size-4xlarge: 8.8rem;
  --ds-icon-size-huge: 10.6rem;
  --ds-icon-size-xhuge: 12.6rem;
  --ds-icon-size-2xhuge: 14.8rem;
  --ds-icon-size-3xhuge: 17.2rem;
  --ds-icon-size-4xhuge: 19.8rem;
  --ds-icon-size-xxtiny: var(--ds-icon-size-3xsmall);
  --ds-icon-size-xtiny: var(--ds-icon-size-2xsmall);
  --ds-icon-size-tiny: var(--ds-icon-size-xsmall);
  --ds-icon-size-xxsmall: var(--ds-icon-size-2xsmall);
  --ds-icon-size-xxlarge: var(--ds-icon-size-2xlarge);
  --ds-icon-size-xxhuge: var(--ds-icon-size-2xhuge);
  --ds-icon-size-massive: var(--ds-icon-size-3xhuge);
  --ds-icon-size-xmassive: var(--ds-icon-size-4xhuge);
  --ds-icon-size-xxmassive: 22.6rem;

  /* text-size */
  --ds-text-size-4xsmall: .8rem;
  --ds-text-size-3xsmall: .9rem;
  --ds-text-size-2xsmall: 1rem;
  --ds-text-size-xsmall: 1.1rem;
  --ds-text-size-small: 1.2rem;
  --ds-text-size-medium: 1.3rem;
  --ds-text-size-large: 1.5rem;
  --ds-text-size-xlarge: 1.8rem;
  --ds-text-size-2xlarge: 2.2rem;
  --ds-text-size-3xlarge: 2.8rem;
  --ds-text-size-4xlarge: 3.6rem;
  --ds-text-size-huge: 4.6rem;
  --ds-text-size-xhuge: 5.8rem;
  --ds-text-size-2xhuge: 7.2rem;
  --ds-text-size-3xhuge: 8.8rem;
  --ds-text-size-4xhuge: 10.6rem;
  --ds-text-size-xxsmall: var(--ds-text-size-2xsmall);
  --ds-text-size-xxlarge: var(--ds-text-size-2xlarge);
  --ds-text-size-xxhuge: var(--ds-text-size-2xhuge);

  /* opacity */
  --ds-normal: 100%;
  --ds-tint: 77%;
  --ds-light: 52%;
  --ds-lighter: 29%;
  --ds-lightest: 15%;
  --ds-bright: 6.25%;
  --ds-disabled-opacity: 30%;

  /* font */
  --ds-font-default: 'Source Han Sans JP', 'Arial', 'Helvetica', sans-serif;
  --ds-font-heading: 'Aeonik', 'Source Han Sans JP', 'Arial', 'Helvetica', sans-serif;
  --ds-font-mono: 'Source Code', monospace;
  --ds-font-weight-light: 280;
  --ds-font-weight-normal: 420;
  --ds-font-weight-bold: 820;
}