@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: #f4f3ff;
--brand-100: #ebe9fe;
--brand-200: #d9d5ff;
--brand-300: #bbb4fe;
--brand-400: #9a89fc;
--brand-500: #7959f9;
--brand-600: #6737f0;
--brand-700: #5925dc;
--brand-800: #4a1eb9;
--brand-900: #3f1b97;
--brand-950: #250f66;
--white: #ffffff;
--black: #000000;
--gray-50: #f9fafb;
--gray-100: #f3f4f6;
--gray-200: #e5e7eb;
--gray-300: #d1d5db;
--gray-400: #9ca3af;
--gray-500: #6b7280;
--gray-600: #4b5563;
--gray-700: #374151;
--gray-800: #1f2937;
--gray-900: #111827;
--gray-950: #030712;
--success-50: #f0fdf4;
--success-100: #dcfce7;
--success-200: #bbf7d0;
--success-300: #86efac;
--success-400: #4ade80;
--success-500: #22c55e;
--success-600: #16a34a;
--success-700: #15803d;
--success-800: #166534;
--success-900: #14532d;
--success-950: #052e16;
    /* Fonts */
    --font-sans: 'Inter',sans-serif;
--font-ibmplexsansthai: 'IBM Plex Sans Thai',sans-serif;
--font-notosansthailooped: 'Noto Sans Thai Looped',sans-serif;
--font-geist: 'Geist',sans-serif;
--font-geistmono: 'Geist Mono',monospace;
--font-domine: 'Domine',serif;
--font-ibmplexsansthailooped: 'IBM Plex Sans Thai Looped',sans-serif;

    /* Font size */
    --font-10: 0.625rem;
--font-12: 0.75rem;
--font-14: 0.875rem;
--font-16: 1rem;
--font-18: 1.125rem;
--font-20: 1.25rem;
--font-24: 1.5rem;
--font-30: 1.875rem;
--font-36: 2.25rem;
--font-48: 3rem;
--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 */
    --w-100: 100;
--w-200: 200;
--w-300: 300;
--w-400: 400;
--w-500: 500;
--w-600: 600;
--w-700: 700;
--w-800: 800;
--w-900: 900;
--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 */
    --space-4: 0.25rem;
--space-6: 0.375rem;
--space-8: 0.5rem;
--space-12: 0.75rem;
--space-16: 1rem;
--space-24: 1.5rem;
--space-32: 2rem;
--space-40: 2.5rem;
--space-64: 4rem;
--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;
    }
  }
}


    .boDNtP {
      display:flex;
      background:white;
      align-items:center;
      font-family:Geist;
      justify-content:flex-start;
    }

    .KsFov {
      width:var(--width);
      height:var(--height);
      position:fixed;
      overflow-x:hidden;
      overflow-y:hidden;
      align-items:center;
      pointer-events:none;
      justify-content:center;
    }

    .KsFov.modal {
      touch-action:none;
      pointer-events:all;
    }

    .elpFpP {
      width:100%;
      display:flex;
      background:linear-gradient(var(--brand-100) 0%, #ffffff 100%) scroll border-box padding-box repeat repeat 0% 0% / auto;
      align-items:center;
      font-family:inherit;
      padding-top:var(--space-64);
      padding-left:var(--space-32);
      padding-right:var(--space-32);
      padding-bottom:var(--space-64);
      justify-content:center;
    }

    .bxKhMB {
      cursor:pointer;
      row-gap:var(--space-16);
      column-gap:var(--space-16);
      overflow-x:hidden;
      overflow-y:hidden;
      transition:all 300ms ease;
      font-family:inherit;
      padding-top:var(--space-12);
      border-color:var(--border);
      border-style:solid;
      border-width:1px;
      padding-left:var(--space-12);
      padding-right:var(--space-12);
      padding-bottom:var(--space-12);
      border-top-left-radius:var(--space-24);
      border-top-right-radius:var(--space-24);
      border-bottom-left-radius:var(--space-24);
      border-bottom-right-radius:var(--space-24);
    }

    .bxKhMB:hover {
      translate:0 -8px 0;
      box-shadow:0px 4px 16px 0px #00000020;
    }

    .cToKHF {
      width:100%;
      max-width:336px;
      object-fit:cover;
      aspect-ratio:16/9;
      border-top-left-radius:var(--space-16);
      border-top-right-radius:var(--space-16);
      border-bottom-left-radius:var(--space-16);
      border-bottom-right-radius:var(--space-16);
    }

    .fGgCBo {
      row-gap:var(--space-24);
      max-width:800px;
      background:white;
      column-gap:var(--space-24);
      margin-top:0undefined;
      padding-top:var(--space-24);
      padding-left:var(--space-24);
      padding-right:var(--space-24);
      padding-bottom:var(--space-24);
      border-top-left-radius:var(--space-16);
      border-top-right-radius:var(--space-16);
      border-bottom-left-radius:var(--space-16);
      border-bottom-right-radius:var(--space-16);
    }

    @media (max-width: 768px) {

    .fGgCBo {
      row-gap:var(--space-16);
      column-gap:var(--space-16);
      padding-top:var(--space-16);
      padding-left:var(--space-16);
      padding-right:var(--space-16);
      padding-bottom:var(--space-16);
    }
    }

    .bWpTnd {
      width:fit-content;
      height:auto;
    }

    .Backgrounds\:5FvtKYVGb3fdf9UpEmD6C {
      width:100%;
    }

    .fcuJZd {
      color:var(--brand-900);
      font-size:var(--font-48);
      text-align:center;
      font-family:Domine;
      font-weight:var(--w-800);
    }

    .cliZqI {
      color:var(--font-color);
      cursor:pointer;
      height:var(--height);
      display:flex;
      row-gap:8px;
      font-size:var(--font-size);
      background: var(--background-color);
      box-shadow:0px 1px 2px 0px var(--shadow);
      column-gap:8px;
      transition:opacity 300ms ease 0ms normal, background 300ms ease 0ms normal;
      align-items:center;
      font-family:inherit;
      font-weight:var(--w-500);
      line-height:var(--line-height);
      padding-top:8px;
      padding-left:var(--horizontal-padding);
      padding-right:var(--horizontal-padding);
      flex-direction:row;
      padding-bottom:8px;
      justify-content:center;
      border-top-left-radius:8px;
      border-top-right-radius:8px;
      border-bottom-left-radius:8px;
      border-bottom-right-radius:8px;
    }

    .cliZqI:hover {
      opacity:0.9;
      background:;
    }

    .cliZqI:focus-visible {
      box-shadow:0px 0px 0px 3px #A3A3A380;
    }

    .cliZqI:disabled {
      cursor:not-allowed;
      opacity:0.5;
    }

    .cliZqI.outline {
      box-shadow:0px 0px 0px 1px var(--input) inset, 0px 1px 2px 0px #0000000d;
    }

    .cliZqI.outline:hover {
      background: #F5F5F5F5;
    }

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

    .cliZqI.link:hover {
      text-decoration:underline;
    }

    .cliZqI.loading {
      opacity:0.5;
    }

    .dUVZId {
      width:16px;
      height:16px;
      animation:1000ms linear 0ms infinite normal none running animation-foovsV;
    }

    @keyframes animation-foovsV {
        0% {
          rotate: 0;
        }

        100% {
          rotate: 360deg;
        }
    }

    .cjbuGM {
      color:var(--muted-foreground);
      font-size:var(--font-10);
      font-family:inherit;
      text-decoration-line:underline;
    }

    .bFdkvI {
      flex:1;
      display:flex;
      row-gap:var(--space-4);
      column-gap:var(--space-4);
      align-items:flex-start;
      padding-top:var(--space-4);
      padding-left:var(--space-4);
      padding-right:var(--space-4);
      padding-bottom:var(--space-4);
      justify-content:flex-start;
    }

    .dgPrsE {
      display:flex;
      row-gap:var(--space-8);
      max-width:100vw;
      column-gap:var(--space-8);
      overflow-x:scroll;
      align-items:center;
      padding-left:var(--space-16);
      padding-right:var(--space-16);
      flex-direction:row;
      justify-content:center;
      scrollbar-width:none;
    }

    .dgPrsE::-webkit-scrollbar {
    width: 0;
    }

    @media (max-width: 768px) {

    .dgPrsE {
      display:flex;
      align-items:flex-start;
      justify-content:start;
    }
    }

    .chsQel {
      width:100%;
      max-width:752px;
      max-height:423px;
      object-fit:cover;
      aspect-ratio:16/9;
      border-top-left-radius:var(--space-12);
      border-top-right-radius:var(--space-12);
      border-bottom-left-radius:var(--space-12);
      border-bottom-right-radius:var(--space-12);
    }

    .eDMQRO {
      row-gap:var(--space-32);
      max-width:1280px;
      column-gap:var(--space-32);
      font-family:inherit;
    }

    @media (max-width: 768px) {

    .eDMQRO {
      max-width:100vw;
    }
    }

    .drtGpI {
      color:var(--foreground);
      font-size:var(--font-18);
      font-family:Domine;
      font-weight:var(--w-600);
    }

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

    @media (max-width: 768px) {

    .dcOBHL {
      display:flex;
      row-gap:var(--space-8);
      column-gap:var(--space-8);
      align-items:stretch;
      flex-direction:column;
      justify-content:flex-start;
    }
    }

    .SWxlP {
      position:relative;
      outline-color:transparent;
      outline-style:none;
      outline-width:0px;
      pointer-events:all;
    }

    .SWxlP:focus {
      outline-color:transparent;
      outline-style:none;
      outline-width:0px;
    }

    .Backgrounds\:FxwVzXFaLwHz748rJSSD2 {
      margin-top:var(--space-32);
      margin-left:var(--space-32);
      margin-right:var(--space-32);
      margin-bottom:var(--space-32);
    }

    .eSqrkW {
      width:36px;
      height:36px;
      box-shadow:0px 2px 4px 0px #00000020;
      border-top-left-radius:var(--space-12);
      border-top-right-radius:var(--space-12);
      border-bottom-left-radius:var(--space-12);
      border-bottom-right-radius:var(--space-12);
    }

    .byjkOA {
      top:0px;
      left:0px;
      right:0px;
      bottom:0px;
      z-index:-1;
      position:absolute;
    }

    .Backgrounds\:J4TQKcWrtkfFE8OXS_HZY {
      background:#0000004d;
    }

    .dOMUvw {
      width:fit-container;
      max-width:360px;
      align-items:center;
      justify-content:center;
    }

    @media (max-width: 768px) {

    .dOMUvw {
      width:100%;
      max-width:unset;
      flex-direction:column;
    }
    }

    .bGqFOf {
      display:flex;
      row-gap:var(--space-8);
      column-gap:var(--space-8);
      align-items:center;
      justify-content:center;
    }

    .fwVIED {
      color:var(--brand-400);
      font-size:var(--font-18);
      text-align:center;
      font-family:inherit;
      font-weight:var(--w-500);
    }

    .bAybeH {
      display:flex;
      row-gap:var(--space-16);
      max-width:500px;
      column-gap:var(--space-16);
      align-items:center;
      justify-content:center;
    }

    .ijQTc {
      color:var(--brand-900);
      font-family:Domine;
    }

    @media (max-width: 430px) {

    .ijQTc {
      display:none;
    }
    }

    .eXzweP {
      width:100%;
      display:flex;
      align-items:center;
      font-family:inherit;
      justify-content:flex-start;
    }

    .dAZGwo {
      row-gap:var(--space-8);
      column-gap:var(--space-8);
      align-items:stretch;
      flex-direction:row;
    }

    @media (max-width: 768px) {

    .dAZGwo {
      row-gap:var(--space-8);
      column-gap:var(--space-8);
      flex-direction:column-reverse;
    }
    }

    .fcqxj {
      width:100%;
      max-width:336px;
      object-fit:cover;
      border-top-left-radius:var(--space-16);
      border-top-right-radius:var(--space-16);
      border-bottom-left-radius:var(--space-16);
      border-bottom-right-radius:var(--space-16);
    }

    .chQulR {
      color:var(--muted-foreground);
      width:100%;
      font-size:var(--font-14);
      font-family:inherit;
    }

    .pqPZo {
      row-gap:var(--space-8);
      column-gap:var(--space-8);
      font-family:inherit;
      flex-direction:row;
    }

    .bcxMeq {
      color:var(--muted-foreground);
      width:100%;
      font-size:var(--font-14);
      overflow-x:hidden;
      text-align:left;
      font-family:inherit;
      white-space:nowrap;
      text-overflow:ellipsis;
    }

    .bFqHrB {
      row-gap:var(--space-8);
      column-gap:var(--space-8);
      flex-direction:row;
    }

    .eWfbas {
      color:var(--brand-900);
    }

    .dfFUoE {
      display:flex;
      row-gap:var(--space-4);
      column-gap:var(--space-4);
      align-items:flex-start;
      padding-top:var(--space-4);
      padding-left:var(--space-4);
      padding-right:var(--space-4);
      padding-bottom:var(--space-4);
      justify-content:flex-start;
    }

    .bnujSW {
      top:0px;
      width:100%;
      display:flex;
      z-index:var(--z-10);
      position:sticky;
      background:white;
      align-items:center;
      font-family:inherit;
      padding-top:var(--space-8);
      padding-left:var(--space-16);
      padding-right:var(--space-16);
      flex-direction:row;
      padding-bottom:var(--space-8);
      justify-content:space-between;
      border-bottom-color:var(--border);
      border-bottom-style:solid;
      border-bottom-width:1px;
    }

    .GnCys {
      width:100%;
      margin-top:var(--space-64);
      font-family:inherit;
      padding-top:var(--space-32);
      padding-left:var(--space-16);
      padding-right:var(--space-16);
      padding-bottom:var(--space-32);
      border-top-color:var(--border);
      border-top-style:solid;
      border-top-width:1px;
    }

    .qNVB {
      color:var(--neutral-400);
      font-size:var(--font-12);
      font-weight:var(--w-600);
    }

    .ftOTsh {
      display:flex;
      row-gap:var(--space-32);
      flex-wrap:wrap;
      column-gap:var(--space-32);
      align-items:flex-start;
      padding-left:var(--space-32);
      padding-right:var(--space-32);
      flex-direction:row;
      justify-content:center;
    }

    @media (max-width: 768px) {

    .ftOTsh {
      row-gap:var(--space-16);
      column-gap:var(--space-16);
      padding-left:var(--space-16);
      padding-right:var(--space-16);
    }
    }

    @media (max-width: 768px) {

    .Backgrounds\:v55XW-MMcMSAmIRMDRCSv {
      width:100%;
    }
    }

    .dFpFwP {
      color:var(--muted-foreground);
      cursor:pointer;
      transition:all 150ms ease;
      padding-top:var(--space-8);
      border-color:var(--border);
      border-style:solid;
      border-width:1px;
      padding-left:var(--space-12);
      padding-right:var(--space-12);
      padding-bottom:var(--space-8);
      border-top-left-radius:var(--space-64);
      border-top-right-radius:var(--space-64);
      border-bottom-left-radius:var(--space-64);
      border-bottom-right-radius:var(--space-64);
    }

    .dFpFwP:hover {
      color:var(--brand-900);
      background:var(--brand-50);
      border-color:var(--brand-400);
      border-style:solid;
      border-width:1px;
    }

    .dFpFwP.selected {
      color:var(--brand-900);
      background:var(--brand-100);
      border-color:var(--brand-600);
      border-style:solid;
      border-width:1px;
    }

    .dFpFwP:disabled {
      color:var(--muted-foreground);
      cursor:not-allowed;
      background:var(--neutral-200);
    }

    .dymdGY {
      display:flex;
      row-gap:var(--space-8);
      font-size:var(--font-18);
      column-gap:var(--space-8);
      align-items:center;
      font-family:inherit;
      font-weight:var(--w-600);
      flex-direction:row;
      justify-content:flex-start;
    }

    .fGSoyI {
      width:100%;
      object-fit:cover;
      border-top-left-radius:var(--space-16);
      border-top-right-radius:var(--space-16);
      border-bottom-left-radius:var(--space-16);
      border-bottom-right-radius:var(--space-16);
    }