:root{--red:#b91c1c;--ink:#1c1917;--muted:#78716c;--line:#e7e5e4;--bg:#fafaf9}*{box-sizing:border-box}body,html{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Noto Sans Thai,Sarabun,sans-serif;font-size:16px}a{color:inherit;text-decoration:none}main{max-width:560px;margin:0 auto;padding:12px 16px 96px}h1{font-size:20px;margin:8px 0 12px}h2{font-size:17px;margin:16px 0 8px}.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px}.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.muted{color:var(--muted);font-size:13px}.price{font-weight:700;color:var(--red)}.btn,button{font:inherit;border:0;border-radius:10px;padding:10px 14px;background:var(--red);color:#fff;font-weight:600;cursor:pointer}.btn.ghost,button.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}button:disabled{opacity:.5;cursor:default}input,select{font:inherit;width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}label{display:block;font-size:13px;color:var(--muted);margin:10px 0 4px}.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:10px;background:#fff}.qty button{background:transparent;color:var(--ink);padding:6px 12px;font-size:18px}.qty span{min-width:28px;text-align:center;font-weight:600}.tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px}.tabs a{white-space:nowrap;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px}.tabs a.active{background:var(--ink);color:#fff;border-color:var(--ink)}.bar{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);padding:10px 16px}.bar>div{max-width:560px;margin:0 auto}.alert{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;border-radius:10px;padding:10px 12px;font-size:14px}.ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;background:#f5f5f4}.admin main{max-width:1120px;padding-bottom:32px}.admin-nav{position:-webkit-sticky;position:sticky;top:0;z-index:5;background:var(--ink);color:#fff}.admin-nav>div{max-width:1120px;margin:0 auto;padding:10px 16px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}.admin-nav a{opacity:.75;font-size:14px}.admin-nav a.active,.admin-nav a:hover{opacity:1}.admin-nav .brand{font-weight:700;opacity:1;margin-right:8px}.admin-nav .spacer{flex:1 1}.tbl{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:14px}.tbl td,.tbl th{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}.tbl th{background:#f5f5f4;font-weight:600;color:var(--muted);font-size:12px}.tbl tr.click{cursor:pointer}.tbl tr.click:hover td{background:#fafaf9}.tbl td.num,.tbl th.num{text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.tbl-wrap{overflow-x:auto}.grid2{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);grid-gap:14px;gap:14px;align-items:start}@media (max-width:860px){.grid2{grid-template-columns:1fr}}.pill{display:inline-flex;gap:6px;align-items:center;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px;cursor:pointer;white-space:nowrap}.pill.active{background:var(--ink);border-color:var(--ink);color:#fff}.pill .n{min-width:20px;padding:0 6px;border-radius:999px;background:#f5f5f4;color:var(--ink);font-size:12px;text-align:center}.pill.hot .n{background:var(--red);color:#fff}.timeline{list-style:none;padding:0;margin:0}.timeline li{padding:6px 0 6px 14px;border-left:2px solid var(--line);position:relative;font-size:14px}.timeline li:before{content:"";position:absolute;left:-5px;top:12px;width:8px;height:8px;border-radius:50%;background:var(--muted)}.slip{width:100%;max-height:520px;object-fit:contain;border:1px solid var(--line);border-radius:10px;background:#f5f5f4}.st-pending_approval,.st-pending_verification{background:#fef3c7;color:#92400e}.st-confirmed,.st-packing{background:#dbeafe;color:#1e40af}.st-delivered,.st-shipped{background:#e0e7ff;color:#3730a3}.st-closed{background:#dcfce7;color:#166534}.st-cancelled{background:#fee2e2;color:#991b1b}.actions{display:flex;gap:8px;flex-wrap:wrap}button.danger{background:#fff;color:var(--red);border:1px solid #fecaca}button.sm{padding:6px 10px;font-size:13px}.alert+.card,.alert+.grid2{margin-top:10px}.print-page{max-width:760px;margin:0 auto;padding:16px;background:#fff}.print-page h2{margin:0 0 4px;font-size:20px}.print-page .sheet{border:1px solid #d6d3d1;border-radius:8px;padding:14px;margin-bottom:16px}.print-page .sheet table{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}.print-page .sheet td,.print-page .sheet th{border-bottom:1px solid #e7e5e4;padding:6px 4px;text-align:left}.print-page .sheet td.num,.print-page .sheet th.num{text-align:right}.print-page .check{width:18px;height:18px;border:1.5px solid #57534e;border-radius:3px;display:inline-block}.print-page .to{font-size:16px;line-height:1.5}.no-print{margin-bottom:12px}@media print{body{background:#fff}.no-print{display:none!important}.print-page{padding:0;max-width:none}.print-page .sheet{page-break-after:always;break-after:page;border:0;padding:0}.print-page .sheet:last-child{page-break-after:auto;break-after:auto}}.tbl td.cover.low{color:#991b1b;font-weight:700;background:#fef2f2}.tbl td.cover.warn{color:#92400e;background:#fffbeb}.dash{--series-1:#2a78d6;--series-1-on:#1c5cab;--range-light:#cde2fb;--grid:#eeedeb;--axis:#a8a29e}.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));grid-gap:10px;gap:10px;margin-bottom:12px}.tile{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}.tile-label{font-size:13px;color:var(--muted)}.tile-value{font-size:26px;font-weight:700;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;margin:2px 0}.tile-sub{font-size:13px;color:#57534e}.tile-target{font-size:12px;color:var(--muted);margin-top:4px}.delta.up{color:#166534}.delta.down{color:#991b1b}.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}.seg button{background:#fff;color:var(--ink);border-radius:0;padding:6px 12px;font-weight:500;font-size:14px}.seg button.on{background:var(--ink);color:#fff}.chart{position:relative;margin-top:8px}.chart .grid{stroke:var(--grid);stroke-width:1}.chart .axis{stroke:var(--axis);stroke-width:1}.chart .tick{fill:var(--muted);font-size:11px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.chart .bar{fill:var(--series-1)}.chart .bar.on{fill:var(--series-1-on)}.chart .tip{position:absolute;top:0;transform:translateX(-50%);background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:13px;pointer-events:none;box-shadow:0 2px 8px rgba(0,0,0,.08);white-space:nowrap}.range-bar{position:relative;height:10px;background:#f5f5f4;border-radius:4px;margin-top:4px}.range-bar span{position:absolute;left:0;top:0;bottom:0;border-radius:4px}.range-bar .p90{background:var(--range-light)}.range-bar .p50{background:var(--series-1)}.dash-controls{align-items:center}.dash-controls select{width:auto;min-width:160px;padding:6px 10px}.badge{white-space:nowrap}.grid2.ful{grid-template-columns:minmax(0,2fr) minmax(280px,1fr)}.grid2.ful code{font-size:12px}@media (max-width:860px){.grid2.ful{grid-template-columns:1fr}}input[type=checkbox],input[type=radio]{width:auto;padding:0}.meter{height:8px;background:#f5f5f4;border-radius:4px;margin:8px 0 4px;overflow:hidden}.meter span{display:block;height:100%;background:var(--ink);border-radius:4px}@media print{.admin-nav,.no-print{display:none!important}.card.invoice{border:0}}textarea{font:inherit;width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;resize:vertical}.seg-nums{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-gap:8px;gap:8px}.seg-nums label{margin:0}.reach{margin-top:12px;padding:10px 12px;background:#f5f5f4;border-radius:10px}.reach .big{font-size:24px}.bubble{margin-top:12px;padding:12px;border-radius:14px;background:#f0fdf4;border:1px solid #bbf7d0;font-size:14px}.bubble-title{font-weight:700;margin-bottom:4px}.shop-head{background:#fff;border-bottom:1px solid var(--line);position:-webkit-sticky;position:sticky;top:0;z-index:5}.shop-head>div{max-width:1040px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.shop-brand{font-weight:800;font-size:20px;color:var(--red);display:flex;flex-direction:column;line-height:1.1}.shop-brand span{font-weight:500;font-size:12px;color:var(--muted)}.shop-head nav{display:flex;gap:16px;align-items:center;font-size:15px}.shop-cart b{display:inline-block;min-width:20px;margin-left:6px;padding:0 6px;border-radius:999px;background:var(--red);color:#fff;font-size:12px;text-align:center}.shop-hero{background:#1c1917;color:#fafaf9}.shop-hero>div{max-width:1040px;margin:0 auto;padding:28px 16px}.shop-hero h1{font-size:clamp(22px,4vw,32px);margin:0 0 8px}.shop-hero p{margin:4px 0;color:#d6d3d1;max-width:640px}.shop-hero .shop-b2b a{color:#fca5a5;text-decoration:underline}.shop-main{max-width:1040px;margin:0 auto;padding:16px 16px 96px}.shop-main.narrow{max-width:560px}.shop-search{font-size:16px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(160px,45%),1fr));grid-gap:10px;gap:10px;margin-top:8px}.shop-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:4px}.shop-card h3{font-size:15px;margin:4px 0 0;line-height:1.35;flex:1 1}.shop-thumb{position:relative;aspect-ratio:5/3;border-radius:8px;background:#fef2f2;display:grid;place-items:center;overflow:hidden}.list-thumb img,.shop-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff}.list-thumb{position:relative;width:72px;height:56px;flex:none;border-radius:8px;background:#fef2f2;display:grid;place-items:center;overflow:hidden;margin-right:10px}.shop-buy{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:6px;flex-wrap:wrap}.shop-buy .qty button{padding:4px 10px}.settings section{scroll-margin-top:60px}.settings h2{font-size:17px}.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));grid-gap:4px 16px;gap:4px 16px;margin-top:6px}.field.wide{grid-column:1/-1}.field .muted{margin-top:2px}label.check{gap:8px;color:var(--ink);font-size:15px;margin-top:14px}.money,label.check{display:flex;align-items:center}.money{gap:6px}.money span{color:var(--muted)}.num-in{width:110px;text-align:right;padding:6px 8px}.decisions{list-style:none;padding:0;margin:10px 0 0}.decisions li{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line);flex-wrap:wrap}.decisions .dot{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;flex:none}.decisions li.done .dot{background:#dcfce7;color:#166534}.decisions li.open .dot{background:#fef3c7;color:#92400e}.tbl.compare td:first-child{color:var(--muted);white-space:nowrap}.manual-frame{display:block;width:100%;height:calc(100dvh - 56px);border:0}.nav-group{position:relative;font-size:14px}.nav-group summary{list-style:none;cursor:pointer;opacity:.75;-webkit-user-select:none;-moz-user-select:none;user-select:none}.nav-group summary::-webkit-details-marker{display:none}.nav-group summary:after{content:" ▾";font-size:11px}.nav-group summary:hover,.nav-group.active summary,.nav-group[open] summary{opacity:1}.nav-group>div{position:absolute;top:calc(100% + 8px);left:-8px;z-index:20;min-width:190px;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:6px;display:grid}.admin-nav .nav-group>div a{opacity:1;padding:8px 10px;border-radius:6px;color:var(--ink)}.admin-nav .nav-group>div a:hover{background:#f5f5f4}.admin-nav .nav-group>div a.active{background:var(--ink);color:#fff}.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:10px 0}.toolbar input,.toolbar select{width:auto;min-width:140px;padding:7px 10px}.toolbar input[type=search]{flex:1 1;min-width:200px}.status{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;white-space:nowrap}.status.on{background:#dcfce7;color:#166534}.status.off{background:#f5f5f4;color:#57534e}.status.warn{background:#fef3c7;color:#92400e}tr.inactive td{color:var(--muted)}.drawer-bg{position:fixed;inset:0;background:rgba(28,25,23,.35);z-index:30}.drawer{position:fixed;top:0;right:0;bottom:0;width:min(520px,100%);background:var(--bg);z-index:31;overflow-y:auto;padding:16px 18px 24px;box-shadow:-8px 0 32px rgba(0,0,0,.15);display:grid;grid-gap:12px;gap:12px;align-content:start}.drawer h2{margin:0;font-size:20px}.form{display:grid;grid-gap:10px;gap:10px}.form label{display:grid;grid-gap:4px;gap:4px;font-size:13px;color:var(--muted)}.form label>span{font-weight:600}.form .two{display:grid;grid-template-columns:1fr 1fr;grid-gap:10px;gap:10px}.form .check{display:flex;gap:8px;align-items:center;color:var(--ink);font-size:14px}.form textarea{font:inherit;width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;min-height:70px}.form-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;position:-webkit-sticky;position:sticky;bottom:0;background:var(--bg);padding-top:8px}.ok-msg{background:#f0fdf4;border:1px solid #bbf7d0;color:#166534;border-radius:10px;padding:10px 12px;font-size:14px}.tabs-line{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:6px 0 4px;flex-wrap:wrap}.tabs-line button{background:none;color:var(--muted);border-radius:0;padding:8px 12px;font-weight:600;border-bottom:2px solid transparent}.tabs-line button.on{color:var(--ink);border-bottom-color:var(--red)}.thumb-sm{width:44px;height:44px;border-radius:8px;object-fit:contain;background:#fff;border:1px solid var(--line)}.mono{font-family:ui-monospace,Consolas,monospace}.diff,.mono{font-size:12.5px}.diff{display:grid;grid-gap:2px;gap:2px}.diff del{color:#991b1b;text-decoration:line-through}.diff ins{color:#166534;text-decoration:none}.hbar{height:10px;border-radius:4px;background:#2a78d6;min-width:2px}.promo-strip{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:4px}.promo-chip{flex:0 0 240px;display:grid;grid-gap:2px;gap:2px;background:#fff;border:1px solid var(--line);border-left:3px solid var(--red);border-radius:10px;padding:8px 10px;font-size:14px}.reward-points{font-size:34px;font-weight:700;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;line-height:1.2}.progress{height:8px;background:#f5f5f4;border-radius:4px;margin:6px 0 4px;overflow:hidden}.progress span{display:block;height:100%;background:var(--red);border-radius:4px}