@font-face{font-family:IBM Plex Sans Thai;src:url('/fonts/ibm-plex-thai-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:IBM Plex Sans Thai;src:url('/fonts/ibm-plex-thai-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:IBM Plex Sans Thai;src:url('/fonts/ibm-plex-thai-700.ttf') format('truetype');font-weight:700;font-display:swap}
/* Reference layout; customer branding still controls the accent and button contrast. */
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]){--bg:#160d0d;--ink:#f2f2f2;--muted:#aaa5ad;--line:#362a2a;--panel:#251818;--accent:color-mix(in srgb,var(--theme-primary) 40%,#fff);--green:var(--accent);--green-dark:var(--accent);--green-light:#382626;color-scheme:dark;color:var(--ink);font-family:'IBM Plex Sans Thai',Tahoma,sans-serif;font-size:16px;line-height:1.5;background:radial-gradient(1200px 600px at 80% -10%,#33000055,transparent),radial-gradient(1000px 500px at -10% 10%,#251818aa,transparent),linear-gradient(#160d0dcc,#160d0dcc),url('/storefront-background.webp') top/cover no-repeat fixed,#160d0d}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .header{position:sticky;top:0;z-index:20;height:57px;padding:0;background:#160d0dcc;border-color:var(--line);backdrop-filter:blur(12px)}
.storefront-nav{max-width:1152px;width:100%;height:100%;margin:auto;padding:0 24px;display:flex;align-items:center;gap:32px;min-width:0}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .brand{font:700 18px/1.5 'IBM Plex Sans Thai',sans-serif;letter-spacing:.3px;gap:8px;flex-shrink:1}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .brand img{width:26px;height:26px;border-radius:6px}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .brand [data-shop-name]{font-size:18px;max-width:220px;letter-spacing:.3px}
.storefront-nav nav{display:flex;align-items:center;gap:28px;min-width:0}.storefront-nav nav a{display:flex;align-items:center;min-height:44px;white-space:nowrap;text-decoration:none;font-size:14px;font-weight:600;color:var(--muted)}.storefront-nav nav a:hover{color:var(--ink)}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .customer-shell{max-width:1152px;padding:0 24px;margin:auto}
.storefront-hero{border-bottom:1px solid var(--line);padding:78px 0 80px}.hero-content{max-width:768px}.service-tag{display:inline-block;padding:5px 12px;border:1px solid color-mix(in srgb,var(--theme-primary) 40%,transparent);border-radius:99px;background:color-mix(in srgb,var(--theme-primary) 10%,transparent);font-size:12px;font-weight:600;color:var(--accent)}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) h1{font-size:48px;font-weight:700;line-height:1.18;letter-spacing:0;text-wrap:initial;margin-top:20px}.hero-accent{color:var(--accent)}.hero-content>p[data-home-description]{font-size:18px;line-height:1.65;margin-top:22px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .hero-actions a{min-height:46px;font-size:14px;padding:12px 20px;font-weight:600}.hero-note{margin-top:16px;font-size:12px;line-height:1.7}
.how-it-works{padding:60px 0 64px}.how-it-works h2{font-size:24px;font-weight:700}.instruction-grid{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:32px 0 0;padding:0}.instruction-grid li{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px;box-shadow:0 10px 15px -3px #0002}.instruction-number{width:40px;height:40px;display:grid;place-items:center;border:2px solid color-mix(in srgb,var(--theme-primary) 50%,transparent);border-radius:50%;color:var(--accent);font-size:18px;font-weight:700}.instruction-grid h3{margin-top:16px;font-size:16px;font-weight:600;text-wrap:initial}.instruction-grid p{margin-top:6px;font-size:14px;line-height:1.5}
.receive-section{border-top:1px solid var(--line);padding:64px 0 72px;scroll-margin-top:76px}.receive-intro{margin-bottom:28px}.receive-intro h2{font-size:24px}.receive-intro p{margin-top:8px;font-size:14px}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .steps{justify-content:flex-start;margin-bottom:24px;gap:12px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .steps li{background:var(--panel);border-color:var(--line);color:var(--muted);padding:7px 14px 7px 7px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .steps li[aria-current]{color:var(--ink);background:#382626;border-color:color-mix(in srgb,var(--theme-primary) 45%,var(--line))}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .customer-grid{grid-template-columns:minmax(0,720px) minmax(0,1fr);gap:24px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .workspace{background:var(--panel);border-color:var(--line);border-radius:12px;padding:32px;box-shadow:0 10px 24px #0001}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) input:not([type=checkbox]):not([type=file]){background:#1b1111;border-color:#574343;color:var(--ink);border-radius:10px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) input::placeholder{color:#a9a0a6}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) input:focus{background:#1b1111;border-color:var(--accent)}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) :is(.secondary,.option,.google-button){background:var(--panel);border-color:var(--line);color:var(--ink)}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) :is(.secondary,.option,.google-button):hover{background:#332222;border-color:#795555}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .option{border-color:#574343;border-radius:10px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .option>b{color:var(--accent)}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .account-line{background:#1b1111}.summary .eyebrow{color:var(--accent)}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .summary{background:var(--panel);border-color:var(--line);border-radius:12px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .help-panel{text-align:left;padding:20px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .help-panel h3{color:var(--ink)}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .help-bottom{margin-top:8px;line-height:1.8}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .help-bottom br{display:block}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .help-bottom a{display:inline-flex;align-items:center;min-height:44px;margin-left:0;color:var(--accent)}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .notice{background:#3b2020;border-color:#855252;color:#ffd1c7}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .notice.info{background:#352b19;border-color:#756235;color:#f3d48f}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) :is(.option-icon,.section-icon,.result-symbol){background:#382626;color:var(--accent)}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .result-symbol.warn{background:#352b19;color:#f3d48f}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .pill{background:#382626;color:var(--accent)}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) footer.site-footer{background:#160d0d99;padding:30px 24px;text-align:center;font-size:12px;line-height:1.7;border-color:var(--line)}.site-footer p+p{margin-top:2px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .site-footer a{color:var(--accent);font-weight:600;text-decoration:none}
body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) :is(button,a,input):focus-visible{outline:3px solid var(--accent);outline-offset:4px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .skip-link{background:var(--panel);color:var(--ink);z-index:30}
@media(max-width:1023px){.instruction-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .customer-grid{grid-template-columns:minmax(0,1fr)}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .help-panel{padding:0}.hero-content{max-width:760px}}
@media(max-width:639px){body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]){background-attachment:scroll}.storefront-nav{gap:18px;padding:0 20px}.storefront-nav nav{gap:16px}.storefront-nav nav a{font-size:12px}.storefront-nav nav [data-shop-link]{display:none}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .brand [data-shop-name]{max-width:110px;font-size:17px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .customer-shell{padding:0 20px}.storefront-hero{padding:56px 0}.hero-content>p[data-home-description]{font-size:16px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) h1{font-size:36px;line-height:1.25}.hero-actions{gap:10px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .hero-actions a{padding:12px 16px;font-size:13px}.how-it-works{padding:44px 0}.instruction-grid{grid-template-columns:1fr;margin-top:24px}.receive-section{padding:44px 0 48px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .workspace{padding:24px 18px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .steps{gap:6px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .steps li{padding:8px 4px;font-size:11px}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .delivery-options{grid-template-columns:1fr}body:is([data-brand-page=home],[data-brand-page=receive],[data-brand-page=contact]) .option{padding:20px}.hero-actions a{max-width:100%}}

/* The receiving flow shares the storefront theme but has its own focused page. */
body[data-brand-page=receive]{display:flex;flex-direction:column;min-height:100vh}
body[data-brand-page=receive] .customer-shell{width:100%;flex:1}
body[data-brand-page=receive] .receive-section{border:0;padding-top:32px}
body[data-brand-page=receive] .receive-intro h1{font-size:36px;line-height:1.35;margin-top:12px}
.receive-back{display:inline-flex;align-items:center;min-height:44px;font-size:14px;color:var(--muted);text-decoration:none}
.receive-back:hover{color:var(--ink)}
.storefront-nav nav a[aria-current=page]{color:var(--ink)}
@media(max-width:639px){body[data-brand-page=receive] .receive-section{padding-top:20px}body[data-brand-page=receive] .receive-intro h1{font-size:30px}}

#bot-dialog{width:min(440px,calc(100% - 24px));max-height:calc(100dvh - 32px);overflow:auto;background:#17191e;color:#f4f4f5;border:1px solid #373940;border-radius:18px;padding:24px}#bot-dialog::backdrop{background:#050609bb;backdrop-filter:blur(5px)}.bot-heading{display:flex;gap:12px;align-items:center;margin-bottom:12px}.bot-heading svg{color:var(--green);width:28px;height:28px}.bot-heading h2{font-size:22px}#bot-description,#bot-status{font-size:13px;color:#bcbec5}#bot-widget{margin:22px 0;min-height:65px;display:flex;justify-content:center}#bot-widget>div{max-width:100%}#bot-status{min-height:44px}.bot-actions{display:flex;gap:12px;margin-top:12px}.bot-actions button{flex:1}#bot-dialog button:disabled{opacity:.5;cursor:not-allowed}