@import"https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&display=swap";:root{color-scheme:light;--font-ui: "Noto Sans Thai", "Helvetica Neue", Arial, sans-serif;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--text-xs: .75rem;--text-sm: .8125rem;--text-base: .875rem;--text-md: .9375rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--leading-tight: 1.2;--leading-ui: 1.35;--leading-body: 1.55;--color-canvas: #f7f7f7;--color-surface: #ffffff;--color-surface-subtle: #f1f1f1;--color-surface-raised: #ffffff;--color-scrim: rgba(23, 25, 24, .42);--color-text: #171918;--color-text-muted: #5f6368;--color-text-disabled: #96999d;--color-text-inverse: #ffffff;--color-divider: #e2e2e2;--color-border-strong: #808388;--color-accent: #171918;--color-accent-soft: #f1f1f1;--color-focus: #2f6bff;--color-selected-text: #171918;--color-success: #227453;--color-success-soft: #e4f3eb;--color-warning: #8a5700;--color-warning-soft: #fff1d6;--color-danger: #b42318;--color-danger-soft: #fee9e7;--color-info: #315f9f;--color-info-soft: #e6effa;--color-ink: #131513;--color-ink-raised: #1c1f1d;--color-ink-divider: #2e3230;--color-text-on-ink: #ffffff;--color-text-on-ink-bright: #e8eae9;--color-text-muted-on-ink: #a7aca9;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-7: 2rem;--space-8: 2.5rem;--space-9: 3rem;--control-compact: 2rem;--control-default: 2.25rem;--control-critical: 2.5rem;--control-touch-compact: 2.75rem;--control-touch-default: 3rem;--control-touch-critical: 3.625rem;--radius-sm: .5rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-pill: 999px;--border-hairline: 1px;--shadow-overlay: 0 18px 48px rgba(23, 25, 24, .16);--motion-fast: .14s;--motion-base: .2s;--motion-overlay: .24s;--ease-out: cubic-bezier(.16, 1, .3, 1);--checkout-rail: clamp(22rem, 34vw, 31rem);--web-nav: 13.5rem;--content-max: 90rem}*{box-sizing:border-box}html{font-family:var(--font-ui);color:var(--color-text);background:var(--color-canvas);font-synthesis:none}body{margin:0;min-height:100vh;font-size:var(--text-md);line-height:var(--leading-ui);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,[role=button],input,select,textarea,[tabindex]{outline:none}:focus-visible{box-shadow:0 0 0 2px var(--color-surface),0 0 0 4px var(--color-focus)}.numeric{font-variant-numeric:tabular-nums lining-nums}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn.loading:before{animation:none}.skeleton{animation:none}}:root{--font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;--text-lede: 17px;--text-4xl: 40px;--text-5xl: 56px;--radius-xl: 20px;--shadow-hero: 0 18px 48px rgba(23, 25, 24, .1);--shell-max: 1120px;--shell-gutter: 48px;--header-height: 64px}html{background:var(--color-surface);scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + var(--space-6))}a{color:var(--color-text);text-decoration:none}a:hover{color:var(--color-text-muted)}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}.shell{width:min(var(--shell-max),100% - var(--shell-gutter));margin-inline:auto}.skip-link{position:absolute;left:var(--space-4);top:var(--space-2);z-index:30;padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);background:var(--color-accent);color:var(--color-text-inverse);font-weight:var(--font-weight-semibold);transform:translateY(-200%)}.skip-link:focus-visible{transform:translateY(0);color:var(--color-text-inverse)}.brand{display:flex;align-items:center;gap:10px;font-weight:var(--font-weight-bold);white-space:nowrap}.brand__mark{flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:var(--color-accent);color:var(--color-text-inverse);display:grid;place-items:center}.brand--sm .brand__mark{flex-basis:28px;width:28px;height:28px;border-radius:var(--radius-sm);font-size:var(--text-sm)}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--control-critical);padding-inline:20px;border:var(--border-hairline) solid transparent;border-radius:var(--radius-md);font-weight:var(--font-weight-semibold);white-space:nowrap}.btn--sm{min-height:var(--control-default);padding-inline:var(--space-4);border-radius:var(--radius-sm)}.btn--quiet{min-height:var(--control-default);padding-inline:var(--space-3);border-radius:var(--radius-sm);color:var(--color-text)}.btn--solid,.btn--solid:hover{background:var(--color-accent);color:var(--color-text-inverse)}.btn--outline{border-color:var(--color-border-strong);color:var(--color-text)}.btn--on-ink,.btn--on-ink:hover{background:var(--color-text-on-ink);color:var(--color-accent)}.btn--outline-ink,.btn--outline-ink:hover{border-color:var(--color-ink-divider);color:var(--color-text-on-ink)}.pill{display:inline-flex;align-items:center;gap:var(--space-2);min-height:28px;padding-inline:var(--space-3);border-radius:var(--radius-pill);background:var(--color-surface-subtle);color:var(--color-text-muted);font-size:var(--text-sm);font-weight:var(--font-weight-medium)}.pill--on-ink{background:var(--color-ink-raised);color:var(--color-text-muted-on-ink)}.site-header{position:sticky;top:0;z-index:20;background:#fffffff0;backdrop-filter:blur(8px);border-bottom:var(--border-hairline) solid var(--color-divider)}.site-header__inner{min-height:var(--header-height);display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}.site-nav{display:flex;align-items:center;gap:26px;font-weight:var(--font-weight-semibold);font-size:var(--text-base)}.site-nav a{color:var(--color-text-muted)}.site-nav a:hover{color:var(--color-text)}.site-header__actions{display:flex;align-items:center;gap:var(--space-2)}.section{border-bottom:var(--border-hairline) solid var(--color-divider)}.section>.shell{padding-block:80px}.section--flush{border-bottom:var(--border-hairline) solid var(--color-divider)}.section--flush>.shell{padding-block:88px 0}.section--canvas{background:var(--color-canvas)}.section--ink{background:var(--color-ink);color:var(--color-text-on-ink)}.section--ink>.shell{padding-block:88px}.section--plain{border-bottom:0}.section--plain>.shell{padding-block:88px}h1,h2,h3{margin:0}.section h2{font-size:var(--text-3xl);line-height:1.15;letter-spacing:-.02em}.section-intro{margin:var(--space-3) 0 0;max-width:56ch;color:var(--color-text-muted);line-height:var(--leading-body)}.split{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:56px}.split--top{align-items:start}.split__lead p{margin:14px 0 0;color:var(--color-text-muted);line-height:var(--leading-body)}.hero h1{margin:22px 0 0;font-size:var(--text-5xl);line-height:1.06;letter-spacing:-.035em;max-width:16ch;text-wrap:balance}.hero__lede{margin:20px 0 0;max-width:52ch;color:var(--color-text-muted);font-size:var(--text-lg);line-height:var(--leading-body)}.hero__actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:30px}.hero__meta{display:flex;flex-wrap:wrap;gap:var(--space-6);margin-top:26px;color:var(--color-text-muted);font-size:var(--text-sm)}.hero__screen{margin-top:56px;border:var(--border-hairline) solid var(--color-divider);border-bottom:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;overflow:hidden;background:var(--color-surface);box-shadow:var(--shadow-hero)}.rule-grid{display:grid;grid-template-columns:1fr 1fr;border-top:var(--border-hairline) solid var(--color-divider)}.rule-grid>*{padding:26px 26px 26px 0}.rule-grid>*:nth-child(odd){padding-left:0}.rule-grid>*:nth-child(2n){padding-right:0;padding-left:26px;border-left:var(--border-hairline) solid var(--color-divider)}.rule-grid>*:nth-child(-n+2){border-bottom:var(--border-hairline) solid var(--color-divider)}.rule-grid>*:nth-last-child(-n+2){padding-bottom:0}.rule-grid h3,.feature h3{font-size:var(--text-lg);font-weight:var(--font-weight-semibold)}.rule-grid p,.feature p{margin:var(--space-2) 0 0;color:var(--color-text-muted);line-height:var(--leading-body)}.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--space-9);border-top:var(--border-hairline) solid var(--color-divider);border-bottom:var(--border-hairline) solid var(--color-divider)}.feature{padding:28px var(--space-6) 30px;border-left:var(--border-hairline) solid var(--color-divider)}.feature:first-child{padding-left:0;border-left:0}.feature:last-child{padding-right:0}.feature h3{margin-top:14px}.feature svg{width:22px;height:22px;fill:none;stroke:var(--color-accent);stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}.screens-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap}.screen-card{border:var(--border-hairline) solid var(--color-divider);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface)}.screen-card__head{min-height:44px;padding-inline:18px;border-bottom:var(--border-hairline) solid var(--color-divider);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);font-size:var(--text-base)}.screen-card__note{color:var(--color-text-muted);font-size:var(--text-sm)}.screen-viewport,.screen-viewport__stage{overflow:hidden}.screen-viewport--center .screen-viewport__stage{margin-inline:auto}.screen-viewport iframe{border:0;display:block;transform-origin:top left}@media(max-width:1180px){.screen-viewport{overflow-x:auto;overscroll-behavior-x:contain}.screen-viewport--center .screen-viewport__stage{margin-inline:0}}.method-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:var(--border-hairline) solid var(--color-divider);border-left:var(--border-hairline) solid var(--color-divider)}.method-grid>*{min-height:84px;padding:14px var(--space-4);border-right:var(--border-hairline) solid var(--color-divider);border-bottom:var(--border-hairline) solid var(--color-divider);display:grid;align-content:center;gap:3px}.method-grid small{color:var(--color-text-muted)}.note-pair{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}.note-pair>*{padding-top:20px;border-top:var(--border-hairline) solid var(--color-divider)}.note-pair h3{font-size:var(--text-lg);font-weight:var(--font-weight-semibold)}.note-pair p{margin:var(--space-2) 0 0;color:var(--color-text-muted);line-height:var(--leading-body)}.dev-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}.section--ink h2{margin-top:20px}.section--ink p{margin:14px 0 0;color:var(--color-text-muted-on-ink);line-height:var(--leading-body)}.marker-list{margin:22px 0 0;padding:0;list-style:none;display:grid;gap:var(--space-3);color:var(--color-text-muted-on-ink);line-height:var(--leading-body)}.marker-list li{display:grid;grid-template-columns:18px 1fr;gap:var(--space-3)}.marker-list li:before{content:"·";color:var(--color-text-on-ink)}.section--ink .btn{margin-top:28px}.code-card{border:var(--border-hairline) solid var(--color-ink-divider);border-radius:var(--radius-lg);background:var(--color-ink-raised);overflow:hidden}.code-card__head{min-height:var(--control-critical);padding-inline:var(--space-4);border-bottom:var(--border-hairline) solid var(--color-ink-divider);display:flex;align-items:center;justify-content:space-between;color:var(--color-text-muted-on-ink);font-size:var(--text-sm)}.code-card pre{margin:0;padding:20px;color:var(--color-text-on-ink-bright);font-family:var(--font-mono);font-size:var(--text-sm);line-height:1.7;overflow:auto}.qa-list{border-top:var(--border-hairline) solid var(--color-divider)}.qa-list>div{padding-block:var(--space-6);border-bottom:var(--border-hairline) solid var(--color-divider);display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:var(--space-7)}.qa-list>div:last-child{border-bottom:0}.qa-list p{margin:0;color:var(--color-text-muted);line-height:var(--leading-body)}.cta-card{padding:56px;border-radius:var(--radius-xl);background:var(--color-ink);color:var(--color-text-on-ink);display:flex;align-items:center;justify-content:space-between;gap:var(--space-9);flex-wrap:wrap}.cta-card h2{font-size:36px;line-height:1.1;letter-spacing:-.03em;max-width:18ch}.cta-card p{margin:14px 0 0;max-width:46ch;color:var(--color-text-muted-on-ink);line-height:var(--leading-body)}.cta-card__actions{display:flex;gap:10px;flex-wrap:wrap}.site-footer{border-top:var(--border-hairline) solid var(--color-divider);background:var(--color-canvas)}.site-footer__top{padding-block:44px;display:grid;grid-template-columns:minmax(0,1fr) repeat(3,minmax(0,auto));gap:var(--space-9)}.site-footer__blurb{margin:var(--space-3) 0 0;max-width:34ch;color:var(--color-text-muted);font-size:var(--text-sm);line-height:var(--leading-body)}.footer-col{display:grid;gap:10px;align-content:start;font-size:var(--text-base)}.footer-col__title{color:var(--color-text);font-weight:var(--font-weight-semibold)}.footer-col a{color:var(--color-text-muted)}.footer-col a:hover{color:var(--color-text)}.footer-col a[aria-current=page]{color:var(--color-text);font-weight:var(--font-weight-semibold)}.site-footer__bottom{border-top:var(--border-hairline) solid var(--color-divider)}.site-footer__bottom .shell{padding-block:18px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--color-text-muted);font-size:var(--text-sm)}.doc{padding-block:72px 96px;display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:56px;align-items:start}.doc-toc{position:sticky;top:calc(var(--header-height) + var(--space-7));display:grid;gap:var(--space-2);font-size:var(--text-base)}.doc-toc__title{color:var(--color-text-muted);font-size:var(--text-sm);margin-bottom:var(--space-1)}.doc-toc a{color:var(--color-text-muted)}.doc-toc a:hover{color:var(--color-text)}.doc-body{min-width:0;max-width:70ch}.doc-body h1{margin:20px 0 0;font-size:var(--text-4xl);line-height:1.1;letter-spacing:-.03em}.doc-body__lede{margin:var(--space-4) 0 0;color:var(--color-text-muted);font-size:var(--text-lede);line-height:var(--leading-body)}.doc-meta{margin-top:18px;display:flex;flex-wrap:wrap;gap:var(--space-4);color:var(--color-text-muted);font-size:var(--text-sm)}.doc-section{margin-top:var(--space-7);padding-top:28px;border-top:var(--border-hairline) solid var(--color-divider)}.doc-section:first-of-type{margin-top:44px}.doc-section h2{font-size:var(--text-2xl);letter-spacing:-.02em}.doc-section>p{margin:var(--space-3) 0 0;color:var(--color-text-muted);line-height:var(--leading-body)}.def-list{margin-top:20px;border-top:var(--border-hairline) solid var(--color-divider)}.def-list>div{padding-block:18px;border-bottom:var(--border-hairline) solid var(--color-divider);display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:28px}.def-list--wide>div{grid-template-columns:minmax(0,240px) minmax(0,1fr)}.def-list>div:last-child{border-bottom:0}.def-list p{margin:0;color:var(--color-text-muted);line-height:var(--leading-body)}.bullet-list{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:var(--space-3);color:var(--color-text-muted);line-height:var(--leading-body)}.bullet-list li{display:grid;grid-template-columns:18px 1fr;gap:var(--space-3)}.bullet-list li:before{content:"·";color:var(--color-text)}.bullet-list strong{color:var(--color-text)}.callout{margin-top:var(--space-4);padding:var(--space-4) 18px;border-radius:var(--radius-md);line-height:var(--leading-body)}.callout--warning{background:var(--color-warning-soft);color:var(--color-warning)}.callout--muted{background:var(--color-surface-subtle);color:var(--color-text-muted)}.contact-list{margin-top:var(--space-4);border-top:var(--border-hairline) solid var(--color-divider)}.contact-list>div{min-height:52px;padding-block:var(--space-3);border-bottom:var(--border-hairline) solid var(--color-divider);display:flex;align-items:baseline;justify-content:space-between;gap:20px}.contact-list>div:last-child{border-bottom:0}.contact-list span{color:var(--color-text-muted)}.contact-grid{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;border-top:var(--border-hairline) solid var(--color-divider);border-left:var(--border-hairline) solid var(--color-divider)}.contact-grid>div{min-height:96px;padding:var(--space-4) 18px;border-right:var(--border-hairline) solid var(--color-divider);border-bottom:var(--border-hairline) solid var(--color-divider);display:grid;align-content:center;gap:var(--space-1)}.contact-grid span,.contact-grid small{color:var(--color-text-muted)}@media(max-width:1080px){.site-nav{gap:18px}.split,.dev-split,.doc{grid-template-columns:minmax(0,1fr);gap:var(--space-7)}.doc-toc{position:static;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--space-4);overflow-x:auto;padding-bottom:var(--space-2)}.doc-toc__title{display:none}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feature:nth-child(3){padding-left:0;border-left:0}.feature:nth-child(2){padding-right:0}.feature:nth-child(-n+2){border-bottom:var(--border-hairline) solid var(--color-divider)}}@media(max-width:860px){:root{--shell-gutter: 32px}.site-nav{display:none}.hero h1{font-size:40px}.cta-card{padding:var(--space-7)}.cta-card h2{font-size:28px}.site-footer__top{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-7)}}@media(max-width:680px){:root{--shell-gutter: 32px}.section>.shell,.section--flush>.shell,.section--ink>.shell,.section--plain>.shell{padding-block:56px}.section--flush>.shell{padding-bottom:0}.section h2,.doc-body h1{font-size:var(--text-2xl)}.hero h1{font-size:32px}.hero__lede{font-size:var(--text-lede)}.rule-grid,.note-pair,.contact-grid{grid-template-columns:minmax(0,1fr)}.rule-grid>*,.rule-grid>*:nth-child(2n){padding:var(--space-6) 0;border-left:0;border-bottom:var(--border-hairline) solid var(--color-divider)}.rule-grid>*:last-child{border-bottom:0;padding-bottom:0}.feature-grid{grid-template-columns:minmax(0,1fr)}.feature{padding:var(--space-6) 0;border-left:0;border-bottom:var(--border-hairline) solid var(--color-divider)}.feature:last-child{border-bottom:0}.method-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.qa-list>div,.def-list>div,.def-list--wide>div{grid-template-columns:minmax(0,1fr);gap:var(--space-2)}.site-footer__top{grid-template-columns:minmax(0,1fr)}.site-footer__bottom .shell{flex-direction:column;align-items:flex-start;gap:var(--space-2)}}