@layer base {
  
  body, :host {
    /* Color */
    --accent: var(--neutral-100);
--accent-foreground: var(--neutral-900);
--background: white;
--border: var(--neutral-200);
--card: white;
--card-foreground: var(--neutral-950);
--destructive: #DC2626;
--destructive-foreground: #FEF2F2;
--foreground: var(--neutral-950);
--input: var(--neutral-200);
--muted: var(--neutral-100);
--muted-foreground: var(--neutral-500);
--popover: white;
--popover-foreground: var(--neutral-950);
--primary: var(--brand-900);
--primary-foreground: var(--neutral-50);
--ring: var(--neutral-400);
--ring-offset: white;
--secondary: var(--neutral-100);
--secondary-foreground: var(--neutral-900);
--transparent: #ffffff00;
--neutral-50: #FAFAFA;
--neutral-100: #F5F5F5;
--neutral-200: #E5E5E5;
--neutral-300: #D4D4D4;
--neutral-400: #A3A3A3;
--neutral-500: #737373;
--neutral-600: #525252;
--neutral-700: #404040;
--neutral-800: #262626;
--neutral-900: #171717;
--neutral-950: #0A0A0A;
--brand-50: #eff6ff;
--brand-100: #dbeafe;
--brand-200: #bfdbfe;
--brand-300: #93c5fd;
--brand-400: #60a5fa;
--brand-500: #3b82f6;
--brand-600: #2563eb;
--brand-700: #1d4ed8;
--brand-800: #1e40af;
--brand-900: #1e3a8a;
--brand-950: #172554;
    /* Fonts */
    --font-geist: 'Geist',sans-serif;
--font-geistmono: 'Geist Mono',monospace;
--font-ibmplexsansthai: 'IBM Plex Sans Thai',sans-serif;
--font-ibmplexsansthailooped: 'IBM Plex Sans Thai Looped',sans-serif;

    /* Font size */
    --text-xs: 0.75rem;
--text-sm: 0.875rem;
--text-base: 1rem;
--text-lg: 1.125rem;
--text-xl: 1.25rem;
--text-2xl: 1.5rem;
--text-3xl: 1.875rem;
--text-4xl: 2.25rem;
--text-5xl: 3rem;
--text-6xl: 3.75rem;
--text-7xl: 4.5rem;
--text-8xl: 6rem;
--text-9xl: 8rem;
    /* Font weight */
    --font-thin: 100;
--font-extralight: 200;
--font-light: 300;
--font-normal: 400;
--font-medium: 500;
--font-semibold: 600;
--font-bold: 700;
--font-extrabold: 800;
--font-black: 900;
    /* Shadows */
    --shadow-sm:  0 1px 2px 0 rgba(0, 0, 0, 0.25);
--shadow-base:  0 1px 3px 0 rgba(0, 0, 0, 0.25), 0 1px 2px 0 rgba(0, 0, 0, 0.25);
--shadow-md:  0 4px 6px -1px rgba(0, 0, 0, 0.25), 0 2px 4px -1px rgba(0, 0, 0, 0.25);
--shadow-lg:  0 10px 15px -3px rgba(0, 0, 0, 0.25), 0 4px 6px -2px rgba(0, 0, 0, 0.25);
--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.25), 0 10px 10px -5px rgba(0, 0, 0, 0.25);
--shadow-2xl:  0 25px 50px -12px rgba(0, 0, 0, 0.25);
    /* Border radius */
    
    /* Spacing */
    --s-1: 0.0625rem;
--s-2: 0.125rem;
--s-4: 0.25rem;
--s-6: 0.375rem;
--s-8: 0.5rem;
--s-10: 0.625rem;
--s-12: 0.75rem;
--s-14: 0.875rem;
--s-16: 1rem;
--s-20: 1.25rem;
--s-24: 1.5rem;
--s-28: 1.75rem;
--s-32: 2rem;
--s-36: 2.25rem;
--s-40: 2.5rem;
--s-44: 2.75rem;
--s-48: 3rem;
--s-56: 3.5rem;
--s-64: 4rem;
--s-80: 5rem;
--s-96: 6rem;
--s-128: 8rem;
--s-192: 12rem;
--s-256: 16rem;
    /* Z-index */
    --z-0: 0;
--z-10: 10;
--z-20: 20;
--z-30: 30;
--z-40: 40;
--z-50: 50;
  }
  @keyframes animation-spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  @keyframes animation-fade-in {
    from {
      opacity:0;
    }
    to {
      opacity:1;
    }
  }
  @keyframes animation-fade-out {
    from {
      opacity:1;
    }
    to {
      opacity:0;
    }
  }
}

      
  .exTbRA {
    flex:1;
  color:var(--foreground);
  background:var(--background);
  font-family:Geist;
  }
      

      
        
      
      
  .ehXvmN {
    font-size:var(--text-sm);
  }
      

      
        
      
      
  
      

      
        
      
      
  .dDeoiH {
    row-gap:var(--s-8);
  column-gap:var(--s-8);
  flex-direction:row;
  }
      

      
        
      
      
  .SOsNz {
    font-weight:var(--font-semibold);
  }
      

      
        
      
      
  .fGgtHo {
    flex:1;
  row-gap:var(--s-8);
  column-gap:var(--s-8);
  }
      

      
        
      
      
  .cEDmxc {
    display:flex;
  row-gap:var(--s-16);
  flex-wrap:wrap;
  column-gap:var(--s-16);
  align-items:center;
  flex-direction:row;
  justify-content:space-between;
  }
      

      
        
      
      
  .bQtDgX {
    width:var(--s-20);
  height:var(--s-20);
  }
      

      
        
      
      
  .ddcgDK {
    row-gap:var(--s-32);
  column-gap:var(--s-32);
  flex-direction:row;
  }
      

      
          @media (max-width: 768px) {
            
  .ddcgDK {
    flex-direction:column;
  }
      

          }
          
        
      
      
  .fuPoqG {
    width:100%;
  row-gap:var(--s-32);
  max-width:1024px;
  column-gap:var(--s-32);
  }
      

      
        
      
      
  .bQFwXh {
    font-size:var(--text-lg);
  font-weight:var(--font-bold);
  }
      

      
        
      
      
  .exdfLo {
    row-gap:var(--s-4);
  column-gap:var(--s-4);
  }
      

      
        
      
      
  .bRbgzm {
    height:60px;
  display:flex;
  align-items:center;
  padding-left:var(--s-16);
  padding-right:var(--s-16);
  justify-content:center;
  border-bottom-color:var(--border);
  border-bottom-style:solid;
  border-bottom-width:1px;
  }
      

      
        
      
      
  .eRhHwK {
    display:flex;
  background:var(--accent);
  align-items:center;
  padding-top:var(--s-32);
  padding-left:var(--s-16);
  padding-right:var(--s-16);
  padding-bottom:var(--s-32);
  justify-content:center;
  }
      

      
        
      
      
  .ddBKKZ {
    cursor:pointer;
  font-size:var(--text-sm);
  transition:background 150ms cubic-bezier(0.42, 0, 0.58, 1);
  padding-top:var(--s-8);
  padding-left:var(--s-16);
  padding-right:var(--s-16);
  padding-bottom:var(--s-8);
  border-top-left-radius:var(--s-8);
  border-top-right-radius:var(--s-8);
  border-bottom-left-radius:var(--s-8);
  border-bottom-right-radius:var(--s-8);
  }
      

      
  .ddBKKZ:hover {
    background:var(--background);
  }
      

        
      
      
  .psgsf {
    display:inline;
  font-size:inherit;
  }
      

      
        
      
      
  .gWjgj {
    row-gap:var(--s-8);
  column-gap:var(--s-8);
  flex-direction:row;
  }
      

      
          @media (max-width: 768px) {
            
  .gWjgj {
    display:none;
  }
      

          }
          
        
      
      
  .cJaURO {
    transition:background 150ms cubic-bezier(0.42, 0, 0.58, 1);
  font-weight:var(--font-medium);
  padding-top:var(--s-8);
  padding-left:var(--s-16);
  padding-right:var(--s-16);
  padding-bottom:var(--s-8);
  border-top-left-radius:var(--s-8);
  border-top-right-radius:var(--s-8);
  border-bottom-left-radius:var(--s-8);
  border-bottom-right-radius:var(--s-8);
  }
      

      
  .cJaURO:hover {
    background:var(--accent);
  }
      

        
      
      
  .bdJrmJ {
    flex:1;
  row-gap:var(--s-16);
  flex-wrap:wrap;
  column-gap:var(--s-16);
  flex-direction:row;
  }
      

      
        
      
      
  .eiZJDm {
    width:100%;
  display:flex;
  max-width:1024px;
  align-items:center;
  flex-direction:row;
  justify-content:space-between;
  }
      

      
        
      
      
  .ehwUPV {
    max-width:100%;
  }
      

      
        
      
      
  .YdRxO {
    color:var(--primary-foreground);
  background:var(--primary);
  font-weight:var(--font-medium);
  padding-top:var(--s-8);
  padding-left:var(--s-16);
  padding-right:var(--s-16);
  padding-bottom:var(--s-8);
  border-top-left-radius:var(--s-8);
  border-top-right-radius:var(--s-8);
  border-bottom-left-radius:var(--s-8);
  border-bottom-right-radius:var(--s-8);
  }
      

      
  .YdRxO:hover {
    opacity:0.9;
  transition:opacity 150ms cubic-bezier(0.42, 0, 0.58, 1);
  }
      

        
      
      
  .fFARmk {
    color:var(--muted-foreground);
  }
      

      
        
      
      
  .fxyVfK {
    color:var(--muted-foreground);
  display:inline;
  font-size:var(--text-sm);
  }
      

      
        
      
      
  .efjzKA {
    display:flex;
  row-gap:var(--s-8);
  column-gap:var(--s-8);
  margin-top:var(--s-8);
  align-items:flex-start;
  flex-direction:row;
  justify-content:flex-start;
  }
      

      
        
      
      
  .dblfhg {
    row-gap:var(--s-8);
  max-width:30%;
  column-gap:var(--s-8);
  }
      

      
          @media (max-width: 768px) {
            
  .dblfhg {
    width:100%;
  max-width:100%;
  }
      

          }
          
        
      
      
  
      

      
        
      
      
  .dtJLen {
    display:flex;
  align-items:center;
  padding-top:var(--s-64);
  padding-bottom:var(--s-64);
  justify-content:center;
  }
      

      
        
      
      
  .eMmSWW {
    font-size:var(--text-4xl);
  font-weight:var(--font-bold);
  }
      

      
        
      
      
  .bRvgXi {
    width:100%;
  max-width:1024px;
  }
      

      
        
      
      
  .BfBwd {
    width:100%;
  display:flex;
  max-width:1024px;
  text-align:center;
  align-items:center;
  justify-content:center;
  }