:root{--na-primary:#131922;--na-on-primary:#fff;--na-ink:#000;--na-body:#2b313b;--na-muted:#50555e;--na-faint:#737373;--na-hairline:#e4e8ef;--na-border-em:#d4d4d4;--na-border-input:#949aa4;--na-canvas:#fff;--na-surface:#f1f1f1;--na-accent:#262626;--na-blue:#0074e2;--na-mint:#b3efbd;--na-peach:#ffafa3;--na-lilac:#d3bdff;--na-aqua:#b3f4ef;--na-butter:#ffe299;--na-success-bg:#e7f5ec;--na-success-fg:#14532d;--na-success-border:#b3efbd;--na-success-solid:#1a6b3c;--na-warning-bg:#fff6e5;--na-warning-fg:#7a4a00;--na-warning-border:#ffe299;--na-danger-bg:#fdecec;--na-danger-fg:#8e1b14;--na-zone-rose:#fcd6d4;--na-zone-sand:#f7dfb3;--na-danger-border:#ffafa3;--na-danger-solid:#b42318;--na-info-bg:#e5f1fd;--na-info-fg:#0b4a8f;--na-info-border:#b3d6f7;--na-space-1:4px;--na-space-2:8px;--na-space-3:12px;--na-space-4:16px;--na-space-5:20px;--na-space-6:24px;--na-space-8:32px;--na-space-10:40px;--na-space-12:48px;--na-space-14:56px;--na-radius-sm:12px;--na-radius-md:20px;--na-radius-lg:32px;--na-radius-full:9999px;--na-shadow:0 2px 4px 0 #00000014;--na-shadow-pop:0 12px 32px #13192224, 0 2px 6px #1319220f;--na-font-thai:"IBM Plex Sans Thai", "Noto Sans Thai", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--na-font-en:"Inter", "IBM Plex Sans Thai", "Noto Sans Thai", -apple-system, sans-serif;--na-font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;--na-text-display:2.5rem;--na-text-h1:2rem;--na-text-h2:1.5rem;--na-text-h3:1.25rem;--na-text-body:1rem;--na-text-sm:.9375rem;--na-text-caption:.8125rem;--na-content:1041px;--na-gutter:20px;--na-tap:48px;--na-header-h:56px;--na-event-bar-h:52px;--na-prose:640px}@media (width>=768px){:root{--na-text-display:3rem;--na-text-h1:2.5rem;--na-text-h2:2rem;--na-gutter:32px;--na-event-bar-h:56px}}@media (width>=1024px){:root{--na-text-display:4rem}}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--na-canvas);min-height:100dvh;color:var(--na-body);font-family:var(--na-font-thai);font-size:var(--na-text-body);-webkit-font-smoothing:antialiased;flex-direction:column;margin:0;line-height:1.6;display:flex}h1,h2,h3,p,ul,ol,figure{margin:0}h1,h2,h3{color:var(--na-primary);font-weight:600;line-height:1.35}a{color:inherit}img{max-width:100%;display:block}:focus-visible{outline:3px solid var(--na-blue);outline-offset:2px}.na-skip{z-index:100;background:var(--na-primary);color:var(--na-on-primary);padding:var(--na-space-3) var(--na-space-4);border-radius:var(--na-radius-sm);position:absolute;top:0;left:-9999px}.na-skip:focus{left:var(--na-space-3);top:var(--na-space-3)}.na-sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.na-container{width:100%;max-width:var(--na-content);padding-inline:var(--na-gutter);margin-inline:auto}.na-main{padding-block:var(--na-space-6) var(--na-space-12);flex:1}.na-stack>*+*{margin-top:var(--na-space-4)}.na-row{align-items:center;gap:var(--na-space-3);flex-wrap:wrap;display:flex}.na-spread{justify-content:space-between;align-items:center;gap:var(--na-space-3);display:flex}.na-grid{gap:var(--na-space-4);grid-template-columns:1fr;display:grid}@media (width>=768px){.na-grid--products{grid-template-columns:repeat(2,1fr)}}@media (width>=1024px){.na-grid--products{grid-template-columns:repeat(3,1fr)}}.na-header{z-index:20;background:var(--na-canvas);border-bottom:1px solid var(--na-hairline);position:sticky;top:0}.na-header__inner{justify-content:space-between;align-items:center;gap:var(--na-space-3);min-height:var(--na-header-h);display:flex}.na-brand{align-items:center;gap:var(--na-space-2);color:var(--na-primary);min-height:var(--na-tap);font-weight:600;text-decoration:none;display:inline-flex}.na-brand__mark{border-radius:var(--na-radius-full);background:var(--na-primary);width:32px;height:32px;color:var(--na-on-primary);font-family:var(--na-font-en);font-size:var(--na-text-sm);place-items:center;display:inline-grid}.na-nav{align-items:center;gap:var(--na-space-1);display:flex}.na-nav__link{align-items:center;gap:var(--na-space-1);min-height:var(--na-tap);padding:0 var(--na-space-3);border-radius:var(--na-radius-full);color:var(--na-muted);font-size:var(--na-text-sm);text-decoration:none;display:inline-flex}.na-nav__link:hover{background:var(--na-surface);color:var(--na-primary)}.na-footer{border-top:1px solid var(--na-hairline);padding-block:var(--na-space-6);color:var(--na-faint);font-size:var(--na-text-sm)}.na-page-header{margin-bottom:var(--na-space-6)}.na-page-header__eyebrow{color:var(--na-faint);font-family:var(--na-font-en);font-size:var(--na-text-caption);letter-spacing:.06em;text-transform:uppercase;margin-bottom:var(--na-space-1)}.na-page-header h1{font-size:var(--na-text-h1)}.na-page-header__meta{color:var(--na-muted);margin-top:var(--na-space-2)}.na-card{background:var(--na-canvas);border:1px solid var(--na-hairline);border-radius:var(--na-radius-sm);padding:var(--na-space-5)}.na-card--raised{box-shadow:var(--na-shadow)}.na-card--muted{background:var(--na-surface);border-color:#0000}.na-card__title{font-size:var(--na-text-h3);margin-bottom:var(--na-space-2)}.na-btn{justify-content:center;align-items:center;gap:var(--na-space-2);min-height:var(--na-tap);padding:var(--na-space-3) var(--na-space-6);border-radius:var(--na-radius-full);background:var(--na-primary);color:var(--na-on-primary);font-family:inherit;font-size:var(--na-text-body);cursor:pointer;text-align:center;border:1px solid #0000;font-weight:600;text-decoration:none;display:inline-flex}.na-btn:hover{background:var(--na-accent)}.na-btn[disabled],.na-btn[aria-disabled=true]{background:var(--na-surface);color:var(--na-faint);cursor:not-allowed}.na-btn--block{width:100%;display:flex}.na-btn--outline{color:var(--na-primary);border-color:var(--na-border-em);background:0 0}.na-btn--outline:hover{background:var(--na-surface)}.na-btn--danger{background:var(--na-danger-solid)}.na-btn--sm{min-height:44px;padding:var(--na-space-2) var(--na-space-4);font-size:var(--na-text-sm)}.na-link{color:var(--na-blue);text-underline-offset:2px;text-decoration:underline}.na-badge{align-items:center;gap:var(--na-space-1);border-radius:var(--na-radius-full);font-size:var(--na-text-caption);white-space:nowrap;border:1px solid #0000;padding:4px 10px;font-weight:600;display:inline-flex}.na-badge--neutral{background:var(--na-surface);color:var(--na-muted)}.na-badge--success{background:var(--na-success-bg);color:var(--na-success-fg);border-color:var(--na-success-border)}.na-badge--warning{background:var(--na-warning-bg);color:var(--na-warning-fg);border-color:var(--na-warning-border)}.na-badge--danger{background:var(--na-danger-bg);color:var(--na-danger-fg);border-color:var(--na-danger-border)}.na-badge--info{background:var(--na-info-bg);color:var(--na-info-fg);border-color:var(--na-info-border)}.na-alert{gap:var(--na-space-3);padding:var(--na-space-4);border-radius:var(--na-radius-sm);font-size:var(--na-text-sm);border:1px solid;display:flex}.na-alert--info{background:var(--na-info-bg);color:var(--na-info-fg);border-color:var(--na-info-border)}.na-alert--success{background:var(--na-success-bg);color:var(--na-success-fg);border-color:var(--na-success-border)}.na-alert--warning{background:var(--na-warning-bg);color:var(--na-warning-fg);border-color:var(--na-warning-border)}.na-alert--danger{background:var(--na-danger-bg);color:var(--na-danger-fg);border-color:var(--na-danger-border)}.na-alert__title{margin-bottom:2px;font-weight:600}.na-error{color:var(--na-danger-fg);font-size:var(--na-text-sm);margin-top:var(--na-space-2)}.na-error:empty{display:none}.na-field{margin-bottom:var(--na-space-4);display:block}.na-field__label{font-size:var(--na-text-body);color:var(--na-primary);margin-bottom:var(--na-space-2);font-weight:500;display:block}.na-field__hint{font-size:var(--na-text-sm);color:var(--na-muted);margin-top:var(--na-space-1);display:block}.na-input,.na-select,.na-textarea{width:100%;min-height:var(--na-tap);padding:var(--na-space-3) var(--na-space-4);border:1px solid var(--na-border-input);border-radius:var(--na-radius-sm);background:var(--na-canvas);color:var(--na-body);font-family:inherit;font-size:var(--na-text-body)}.na-textarea{resize:vertical;min-height:96px}.na-input:focus,.na-select:focus,.na-textarea:focus{border-color:var(--na-primary);outline:none;box-shadow:0 0 0 3px #13192247}.na-input--code{font-family:var(--na-font-mono);letter-spacing:.06em}.na-empty{text-align:center;padding:var(--na-space-10) var(--na-space-5);color:var(--na-muted)}.na-empty h2{font-size:var(--na-text-h3);margin-bottom:var(--na-space-2)}.na-sticky-cta{z-index:15;backdrop-filter:blur(8px);border-top:1px solid var(--na-hairline);padding:var(--na-space-3) var(--na-gutter);padding-bottom:calc(var(--na-space-3) + env(safe-area-inset-bottom));background:#fffffff5;position:sticky;bottom:0}.na-sticky-cta__inner{max-width:var(--na-content);align-items:center;gap:var(--na-space-3);margin-inline:auto;display:flex}.na-sticky-cta__price{font-size:var(--na-text-sm);color:var(--na-muted);line-height:1.3}.na-sticky-cta__price strong{font-size:var(--na-text-h3);color:var(--na-primary);display:block}.na-sticky-cta .na-btn{flex:1}.na-hidden{display:none!important}.na-mono{font-family:var(--na-font-mono)}.na-muted{color:var(--na-muted)}.na-faint{color:var(--na-faint)}.na-divider{background:var(--na-hairline);height:1px;margin-block:var(--na-space-5);border:0}.na-price{font-family:var(--na-font-en);font-variant-numeric:tabular-nums;color:var(--na-primary);font-weight:600}.na-product{flex-direction:column;height:100%;display:flex;overflow:hidden}.na-product__media{aspect-ratio:4/3;background:var(--na-surface);color:var(--na-faint);font-size:var(--na-text-sm);margin:calc(var(--na-space-5) * -1) calc(var(--na-space-5) * -1) var(--na-space-4);place-items:center;display:grid}.na-product__media img{object-fit:cover;width:100%;height:100%}.na-product__body{gap:var(--na-space-2);flex-direction:column;flex:1;display:flex}.na-product__foot{justify-content:space-between;align-items:baseline;gap:var(--na-space-3);margin-top:auto;display:flex}.na-variant-list{gap:var(--na-space-2);display:grid}.na-variant{justify-content:space-between;align-items:center;gap:var(--na-space-3);min-height:var(--na-tap);padding:var(--na-space-3) var(--na-space-4);border:1px solid var(--na-border-input);border-radius:var(--na-radius-sm);background:var(--na-canvas);color:var(--na-body);font:inherit;text-align:left;cursor:pointer;display:flex}.na-variant[aria-pressed=true]{border-color:var(--na-primary);box-shadow:inset 0 0 0 1px var(--na-primary)}.na-variant[disabled]{background:var(--na-surface);color:var(--na-faint);cursor:not-allowed}.na-stepper{align-items:center;gap:var(--na-space-2);display:inline-flex}.na-stepper__btn{width:var(--na-tap);height:var(--na-tap);border:1px solid var(--na-border-input);border-radius:var(--na-radius-full);background:var(--na-canvas);color:var(--na-primary);font-size:var(--na-text-h3);cursor:pointer;line-height:1}.na-stepper__btn[disabled]{color:var(--na-faint);cursor:not-allowed}.na-stepper__value{text-align:center;min-width:2ch;font-family:var(--na-font-en);font-variant-numeric:tabular-nums}.na-line{gap:var(--na-space-2) var(--na-space-3);grid-template-columns:1fr auto;align-items:start;display:grid}.na-line__title{color:var(--na-primary);font-weight:500}.na-line__meta{color:var(--na-muted);font-size:var(--na-text-sm)}.na-summary{justify-content:space-between;gap:var(--na-space-3);display:flex}.na-summary__total{font-size:var(--na-text-h3)}.na-choice{align-items:flex-start;gap:var(--na-space-3);min-height:var(--na-tap);padding:var(--na-space-3) var(--na-space-4);border:1px solid var(--na-border-input);border-radius:var(--na-radius-sm);cursor:pointer;display:flex}.na-choice:has(input:checked){border-color:var(--na-primary);box-shadow:inset 0 0 0 1px var(--na-primary)}.na-choice input{width:20px;height:20px;accent-color:var(--na-primary);margin-top:4px}.na-choice__text{flex-direction:column;gap:2px;display:flex}.na-choice__text strong{color:var(--na-primary);font-weight:500}.na-choice__text span{color:var(--na-muted);font-size:var(--na-text-sm)}.na-progress{border-radius:var(--na-radius-full);background:var(--na-info-border);height:4px;overflow:hidden}.na-progress:after{content:"";background:var(--na-info-fg);width:40%;height:100%;animation:1.2s ease-in-out infinite na-indeterminate;display:block}@keyframes na-indeterminate{0%{transform:translate(-100%)}to{transform:translate(350%)}}@media (prefers-reduced-motion:reduce){.na-progress:after{width:100%;animation:none}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
