:root{--color-primary: #A8FF00;--color-primary-light: rgba(168, 255, 0, .16);--color-accent: #FFD21A;--color-on-primary: #050800;--color-bg: #010500;--color-bg-2: #071006;--color-bg-3: #0B1707;--color-border: rgba(168, 255, 0, .42);--color-border-subtle: rgba(168, 255, 0, .2);--color-text: #F7FFF2;--color-text-muted: #B2C7A8;--color-white: #ffffff;--brand-highlight: #A8FF00;--glass-bg: rgba(1, 7, 2, .76);--glass-blur: blur(14px);--glass-border: 1px solid rgba(168, 255, 0, .34);--glass-bg-mobile: rgba(1, 7, 2, .92);--glass-border-mobile: 1px solid rgba(168, 255, 0, .42);--header-glass-shadow: 0 1px 0 rgba(168, 255, 0, .3), 0 8px 30px rgba(0, 0, 0, .82), 0 0 24px rgba(116, 255, 0, .3);--nav-text: #F7FFF2;--nav-active-bg: rgba(168, 255, 0, .2);--btn-primary-bg: #A8FF00;--btn-primary-text: #050800;--btn-outline-text: #A8FF00;--action-btn-h: 120px;--page-overlay: rgba(1, 5, 0, .8);--glow-sm: 0 0 10px rgba(140, 255, 0, .42);--glow-md: 0 0 22px rgba(140, 255, 0, .52);--glow-lg: 0 0 40px rgba(140, 255, 0, .6);--font-sans: "Sarabun", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 16px;--radius-xl: 24px;--radius-pill: 999px;--container-max: 1200px;--container-pad: 1.25rem;--section-pad-y: 2.5rem;--header-height: 96px;--header-logo-height: 100px;--header-logo-height-mobile: 64px;--header-logo-height-xs: 44px;--fz-display: clamp(2rem, 5vw, 4rem);--fz-hero-title: var(--fz-page-title);--fz-page-title: clamp(1.5rem, 3.5vw, 2.2rem);--fz-section-title: clamp(1.125rem, 2.2vw, 1.5rem);--fz-card-title: clamp(1rem, 1.6vw, 1.25rem);--fz-body-lg: clamp(.9375rem, 1.35vw, 1rem);--fz-body: clamp(.8125rem, 1.2vw, .9rem);--fz-small: .875rem;--fz-xs: .75rem;--fz-eyebrow: .72rem;--fz-button: 1rem;--fz-button-lg: 1.125rem;--fz-button-sm: .875rem;--fz-heading: var(--fz-section-title);--lh-heading: 1.4;--lh-body: 1.8;--bottom-nav-height: 64px;--bottom-nav-bar-shadow: 0 -4px 24px rgba(0, 0, 0, .86), 0 0 20px rgba(140, 255, 0, .3);--bottom-nav-item-color: var(--nav-text);--bottom-nav-item-hover: var(--brand-highlight);--bottom-nav-item-active: var(--brand-highlight);--bottom-nav-play-bg: linear-gradient(180deg, #D7FF3F 0%, #A8FF00 48%, #57B800 100%);--bottom-nav-play-text: #050800;--bottom-nav-play-shadow: 0 -3px 18px rgba(0, 0, 0, .8), 0 0 26px rgba(168, 255, 0, .48);--bottom-nav-play-hover-brightness: 1.08}