:root{--color-primary:#f5f8fb;--color-secondary:#1e2d24;--color-accent:#c5a059;--color-dark:#1a1a1a;--color-white:#fff;--color-light-gray:#e8ecf0;--color-mid-gray:#94a3b8;--color-border:#d4dae3;--color-accent-light:#d4b876;--color-accent-dark:#a88a3d;--color-accent-subtle:#c5a0591f;--color-accent-glow:#c5a05959;--color-secondary-light:#2a3d30;--color-secondary-dark:#141f18;--color-success:#2e7d4f;--color-error:#c5394a;--color-warning:#d4a72c;--color-info:#3b82c4;--font-en-primary:var(--font-montserrat), "Montserrat";--font-en:var(--font-en-primary), -apple-system, BlinkMacSystemFont, sans-serif;--font-th:var(--font-en-primary), var(--font-thai-ui), "Anuphan", "Noto Sans Thai", "Tahoma", sans-serif;--font-th-display:var(--font-en-primary), var(--font-thai-display), "IBM Plex Sans Thai", "Noto Sans Thai", "Tahoma", sans-serif;--text-xs:.694rem;--text-sm:.833rem;--text-base:1rem;--text-md:1.125rem;--text-lg:1.25rem;--text-xl:1.563rem;--text-2xl:1.953rem;--text-3xl:2.441rem;--text-4xl:3.052rem;--text-5xl:3.815rem;--text-hero:4.768rem;--weight-light:300;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--weight-extrabold:800;--leading-tight:1.15;--leading-snug:1.3;--leading-normal:1.6;--leading-relaxed:1.8;--tracking-tight:0;--tracking-normal:0;--tracking-wide:.05em;--tracking-wider:.1em;--tracking-widest:.2em;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-32:8rem;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:24px;--radius-full:9999px;--shadow-xs:0 1px 2px #0000000a;--shadow-sm:0 2px 4px #0000000f;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 8px 24px #0000001a;--shadow-xl:0 16px 48px #0000001f;--shadow-2xl:0 24px 64px #00000029;--shadow-gold:0 4px 24px #c5a05940;--shadow-inner:inset 0 2px 4px #0000000f;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.4s cubic-bezier(.4, 0, .2, 1);--transition-spring:.5s cubic-bezier(.34, 1.56, .64, 1);--z-base:1;--z-dropdown:100;--z-sticky:200;--z-overlay:300;--z-modal:400;--z-toast:500;--z-tooltip:600;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1280px;--container-2xl:1440px;--container-max:1600px;--nav-height:72px;--thai-page-title:var(--text-5xl);--thai-section-title:var(--text-3xl);--thai-card-title:var(--text-lg);--thai-label:var(--text-sm)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;font-size:16px}body{font-family:var(--font-en);font-size:var(--text-base);font-weight:var(--weight-regular);line-height:var(--leading-normal);color:var(--color-dark);background-color:var(--color-primary);overflow-x:hidden}html[lang=th] body,html[lang=th] button,html[lang=th] input,html[lang=th] select,html[lang=th] textarea{font-family:var(--font-th)}html[lang=th] body{--text-xs:.75rem;--text-sm:.875rem;--weight-semibold:500;--weight-bold:600;--weight-extrabold:600;font-weight:var(--weight-regular);line-height:1.72}h1,h2,h3,h4,h5,h6{font-weight:var(--weight-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--color-secondary)}h1{font-size:var(--text-4xl);font-weight:var(--weight-extrabold)}h2{font-size:var(--text-3xl);font-weight:var(--weight-bold)}h3{font-size:var(--text-2xl)}h4{font-size:var(--text-xl);font-weight:var(--weight-semibold)}h5{font-size:var(--text-lg);font-weight:var(--weight-semibold)}h6{font-size:var(--text-md);font-weight:var(--weight-medium)}html[lang=th] h1,html[lang=th] h2{font-family:var(--font-th-display);font-weight:var(--weight-bold);letter-spacing:0;line-height:1.25}html[lang=th] h3,html[lang=th] h4,html[lang=th] h5,html[lang=th] h6{font-family:var(--font-th);letter-spacing:0;line-height:1.35}html[lang=th] h1{font-size:var(--thai-page-title)}html[lang=th] h2{font-size:var(--thai-section-title)}html[lang=th] h3{font-size:var(--thai-card-title);font-weight:var(--weight-bold)}html[lang=th] p,html[lang=th] li{line-height:1.72}html[lang=th] .text-uppercase,html[lang=th] .badge,html[lang=th] .input-label,html[lang=th] .btn{letter-spacing:0}p{line-height:var(--leading-relaxed);color:var(--color-dark)}a{color:var(--color-accent);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-accent-dark)}img{max-width:100%;height:auto;display:block}.container{width:100%;max-width:var(--container-xl);padding-inline:var(--space-6);margin-inline:auto}.container-wide{max-width:var(--container-max)}.container-narrow{max-width:var(--container-md)}.section{padding-block:var(--space-20)}.section-lg{padding-block:var(--space-32)}.btn{justify-content:center;align-items:center;gap:var(--space-2);max-width:100%;min-height:44px;padding:var(--space-3) var(--space-8);font-family:inherit;font-size:var(--text-sm);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;text-align:center;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);-webkit-user-select:none;user-select:none;border:2px solid #0000;line-height:1.25;display:inline-flex;position:relative;overflow:hidden}.btn-primary{background-color:var(--color-accent);color:var(--color-white);border-color:var(--color-accent)}.btn-primary:hover{background-color:var(--color-accent-dark);border-color:var(--color-accent-dark);box-shadow:var(--shadow-gold);transform:translateY(-1px)}.btn-primary:active{box-shadow:none;background-color:#96792f;transform:translateY(0)}.btn-primary:focus-visible{outline:3px solid var(--color-accent-glow);outline-offset:2px}.btn-primary:disabled{background-color:var(--color-mid-gray);border-color:var(--color-mid-gray);color:var(--color-light-gray);cursor:not-allowed;box-shadow:none;transform:none}.btn-secondary{background-color:var(--color-secondary);color:var(--color-primary);border-color:var(--color-secondary)}.btn-secondary:hover{background-color:var(--color-secondary-light);border-color:var(--color-secondary-light);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-secondary:active{background-color:var(--color-secondary-dark);transform:translateY(0)}.btn-secondary:focus-visible{outline-offset:2px;outline:3px solid #1e2d2466}.btn-secondary:disabled{background-color:var(--color-light-gray);border-color:var(--color-light-gray);color:var(--color-mid-gray);cursor:not-allowed}.btn-outline{color:var(--color-accent);border-color:var(--color-accent);background-color:#0000}.btn-outline:hover{background-color:var(--color-accent);color:var(--color-white);box-shadow:var(--shadow-gold);transform:translateY(-1px)}.btn-outline:active{background-color:var(--color-accent-dark);transform:translateY(0)}.btn-outline:focus-visible{outline:3px solid var(--color-accent-glow);outline-offset:2px}.btn-outline:disabled{border-color:var(--color-border);color:var(--color-mid-gray);cursor:not-allowed}.btn-ghost{color:var(--color-secondary);background-color:#0000;border-color:#0000}.btn-ghost:hover{background-color:var(--color-accent-subtle);color:var(--color-accent)}.btn-ghost:active{background-color:#c5a05933}.btn-sm{min-height:38px;padding:var(--space-2) var(--space-5);font-size:var(--text-xs)}.btn-lg{min-height:52px;padding:var(--space-4) var(--space-10);font-size:var(--text-base)}.card{background-color:var(--color-white);border-radius:var(--radius-lg);border:1px solid var(--color-border);transition:box-shadow var(--transition-normal), transform var(--transition-normal), border-color var(--transition-normal);overflow:hidden}.card:hover{box-shadow:var(--shadow-lg);border-color:var(--color-accent-light);transform:translateY(-4px)}.card-body{padding:var(--space-6)}.card-image{aspect-ratio:4/3;object-fit:cover;width:100%}.card-glass{-webkit-backdrop-filter:blur(20px);background:#ffffffb3;border:1px solid #ffffff4d}.input-group{gap:var(--space-2);flex-direction:column;display:flex}.input-label{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-secondary);letter-spacing:var(--tracking-wide);text-transform:uppercase}.input{width:100%;padding:var(--space-3) var(--space-4);font-family:inherit;font-size:var(--text-base);color:var(--color-dark);background-color:var(--color-white);border:1.5px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--transition-fast), box-shadow var(--transition-fast)}.input:hover{border-color:var(--color-mid-gray)}.input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-subtle);outline:none}.input:disabled{background-color:var(--color-light-gray);color:var(--color-mid-gray);cursor:not-allowed}.input::placeholder{color:var(--color-mid-gray)}@keyframes skeletonShimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg, var(--color-light-gray) 25%, #f0f3f6 37%, var(--color-light-gray) 63%);border-radius:var(--radius-md);background-size:200% 100%;animation:1.5s ease-in-out infinite skeletonShimmer}@keyframes goldShimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton-gold{border-radius:var(--radius-md);background:linear-gradient(90deg,#c5a05914 25%,#c5a0592e 37%,#c5a05914 63%) 0 0/200% 100%;animation:2s ease-in-out infinite goldShimmer}.skeleton-text{width:100%;height:1em}.skeleton-text-sm{width:60%;height:.8em}.skeleton-avatar{border-radius:var(--radius-full);width:48px;height:48px}.skeleton-image{aspect-ratio:4/3;width:100%}.skeleton-card{width:100%;height:320px}.badge{padding:var(--space-1) var(--space-3);font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;border-radius:var(--radius-full);align-items:center;display:inline-flex}.badge-gold{background-color:var(--color-accent-subtle);color:var(--color-accent-dark)}.badge-success{color:var(--color-success);background-color:#2e7d4f1a}.badge-error{color:var(--color-error);background-color:#c5394a1a}.divider{background-color:var(--color-border);border:none;width:100%;height:1px}.divider-gold{background:linear-gradient(90deg, transparent, var(--color-accent), transparent);height:2px}.grid{gap:var(--space-6);display:grid}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}.text-accent{color:var(--color-accent)}.text-secondary{color:var(--color-secondary)}.text-center{text-align:center}.text-uppercase{text-transform:uppercase;letter-spacing:var(--tracking-wider)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:.6s ease-out forwards fadeInUp}.animate-delay-1{animation-delay:.1s}.animate-delay-2{animation-delay:.2s}.animate-delay-3{animation-delay:.3s}.animate-delay-4{animation-delay:.4s}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-primary)}::-webkit-scrollbar-thumb{background:var(--color-mid-gray);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-accent)}@media (max-width:1024px){:root{--text-hero:3.052rem;--text-4xl:2.441rem;--text-3xl:1.953rem;--thai-page-title:var(--text-4xl);--thai-section-title:var(--text-3xl)}.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){:root{--text-hero:2.441rem;--text-4xl:1.953rem;--text-3xl:1.563rem;--text-2xl:1.25rem;--nav-height:64px;--thai-page-title:var(--text-4xl);--thai-section-title:var(--text-2xl);--thai-card-title:var(--text-md)}.container{padding-inline:var(--space-4)}.section{padding-block:var(--space-12)}.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.btn-lg{padding:var(--space-3) var(--space-6);font-size:var(--text-sm)}.hide-mobile{display:none!important}}@media (max-width:480px){:root{--text-hero:1.953rem;--text-4xl:1.563rem;--thai-page-title:var(--text-4xl)}}::selection{background-color:var(--color-accent);color:var(--color-white)}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
