:root{--green-950:#0a2e1b;--green-900:#0f3d24;--green-800:#14532d;--green-700:#1b7a43;--green-600:#1f9a51;--green-500:#2cb96a;--green-300:#7fd6a2;--green-100:#dcf3e6;--green-50:#f0f9f3;--lime:#8fd14f;--lime-dark:#5fa121;--amber:#e8a33d;--amber-bg:#fdf0d9;--red:#e05656;--red-bg:#fde3e3;--blue:#3b82c4;--blue-bg:#e2eefb;--sun:#f4c20d;--sun-d:#d9a400;--sun-l:#fbd95e;--sun-bg:#fef3d0;--sun-ink:#5e4a00;--hill:#2f9e44;--forest:#15703a;--forest-d:#0c3d22;--line-blue:#3b82c4;--bg:#f3f6f4;--surface:#ffffff;--surface-2:#f0f4f1;--ink:#101f17;--ink-2:#36473d;--muted:#73837a;--line:#e6ece8;--line-2:#eef2ef;--radius:14px;--radius-sm:10px;--radius-lg:20px;--shadow-sm:0 1px 2px rgba(16,40,28,.035);--shadow:0 2px 10px rgba(16,40,28,.05);--shadow-lg:0 16px 44px rgba(16,40,28,.13);--sans:"Plus Jakarta Sans","IBM Plex Sans Thai",system-ui,sans-serif;--thai:"IBM Plex Sans Thai","Plus Jakarta Sans",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--thai);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased;background:radial-gradient(900px 400px at 80% -10%,rgba(143,209,79,.14),transparent),linear-gradient(160deg,#0f3d24,#0a2e1b)}h1,h2,h3,h4,h5{line-height:1.25;font-weight:700;letter-spacing:-.01em}a{color:var(--green-700);text-decoration:none}img{max-width:100%;display:block}.lopage{min-height:100vh;min-height:100dvh;padding:42px 14px 26px;display:flex;justify-content:center;align-items:flex-start}.phone{width:100%;max-width:430px;background:#eef2ef;border-radius:34px;overflow:hidden;box-shadow:0 30px 80px #00000073;border:9px solid #0c1418;display:flex;flex-direction:column;height:min(794px,calc(100dvh - 68px))}.lo-top{background:#06c755;color:#fff;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:space-between;padding:5px 18px 4px}.lo-top svg{width:13px;height:13px;vertical-align:middle}.lo-head{background:var(--green-800);color:#fff;padding:11px 14px;display:flex;align-items:center;gap:10px}.lo-head .lo-logo{width:30px;height:30px}.lo-head b{font-family:var(--sans);font-size:14px;flex:1}.lo-head .oa{font-size:9px;background:#06c755;padding:2px 7px;border-radius:7px;font-weight:700;letter-spacing:.03em}.lo-head .bk{background:none;border:none;color:#fff;font-size:22px;cursor:pointer;line-height:1;padding:0 4px}.lo-body{flex:1;overflow-y:auto;padding:14px;background:#eef2ef}.lo-nav{display:flex;background:#fff;border-top:1px solid #e0e6e2}.lo-nav a{flex:1;text-align:center;padding:8px 0 7px;font-size:9.5px;color:#90a096;cursor:pointer;font-weight:600}.lo-nav a .ni{font-size:18px;display:block;margin-bottom:2px}.lo-nav a .ni svg{width:18px;height:18px}.lo-nav a.on{color:#06c755}.lo-card{background:#fff;border-radius:14px;padding:14px;margin-bottom:11px;box-shadow:0 1px 3px #0000000d}.lo-h{font-family:var(--sans);font-size:16px;color:var(--green-900);font-weight:700;margin-bottom:2px}.lo-sub{font-size:12px;color:var(--muted);margin-bottom:10px}.lo-btn{display:block;width:100%;background:var(--green-700);color:#fff;border:none;border-radius:12px;padding:13px;font-family:var(--thai);font-weight:700;font-size:15px;cursor:pointer;text-align:center;margin-bottom:9px}.lo-btn:disabled{opacity:.5;cursor:default}.lo-btn.alt{background:#06c755}.lo-btn.ghost{background:var(--green-100);color:var(--green-800)}.lo-btn.out{background:#fff;border:1.5px solid var(--line);color:var(--ink-2);font-weight:600}.lo-prod{display:flex;gap:11px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line-2)}.lo-prod:last-child{border-bottom:none}.lo-prod .pic{width:46px;height:46px;border-radius:11px;background:linear-gradient(140deg,var(--green-100),var(--sun-bg));display:grid;place-items:center;font-size:22px;flex-shrink:0;overflow:hidden}.lo-prod .pic img{width:100%;height:100%;object-fit:cover}.lo-prod .pic .ic-svg{width:22px;height:22px}.lo-step{display:flex;gap:5px;margin-bottom:14px}.lo-step .d{flex:1;height:4px;border-radius:3px;background:var(--line)}.lo-step .d.on{background:var(--green-600)}.lo-opt{display:flex;gap:11px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:11px 12px;margin-bottom:9px;cursor:pointer;transition:.13s}.lo-opt.sel{border-color:var(--green-500);background:var(--green-50)}.lo-opt .oic{font-size:23px;display:grid;place-items:center}.lo-opt .oic svg{width:23px;height:23px}.lo-noti{display:flex;gap:11px;background:#fff;border-radius:12px;padding:11px 12px;margin-bottom:9px;cursor:pointer;box-shadow:0 1px 3px #0000000d}.lo-noti .nic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:18px;flex-shrink:0}.lo-noti .nic svg{width:18px;height:18px}.lo-noti .nt{font-size:13px;font-weight:600;color:var(--ink)}.lo-noti .nm{font-size:11px;color:var(--muted);margin-top:2px}.lo-pill{display:inline-block;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:7px}.field{margin-bottom:13px}.field label{display:block;font-size:12px;font-weight:600;color:var(--green-800);margin-bottom:6px}.field input,.field select,.field textarea{width:100%;font-family:var(--thai);font-size:14px;padding:11px 13px;border:1.5px solid var(--line);border-radius:10px;background:#fbfdfb;transition:.14s;color:var(--ink)}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green-500);background:#fff;box-shadow:0 0 0 3px #2cb96a21}.field .hint{font-size:11px;color:var(--muted);margin-top:5px}.qr{width:150px;height:150px;border-radius:12px;background:conic-gradient(from 0deg,#0f3d24 0 25%,transparent 0 50%,#0f3d24 0 75%,transparent 0) 0 0/14px 14px,#fff;border:5px solid #0f3d24;position:relative;margin:0 auto;overflow:hidden}.qr:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:34px;height:34px;background:#fff;border-radius:8px;border:3px solid var(--green-700)}.qr.has-img{background:#fff}.qr.has-img:after{display:none}.qr img{width:100%;height:100%;object-fit:contain}.grid{display:grid;gap:9px}.grid.g2{grid-template-columns:1fr 1fr}.muted{color:var(--muted)}.mono{font-family:var(--mono)}hr.sep{border:none;border-top:1px solid var(--line-2);margin:16px 0}.note{background:var(--green-50);border:1px solid var(--line);border-left:3px solid var(--green-500);border-radius:9px;padding:10px 13px;font-size:12.5px;color:var(--ink-2);margin-top:10px}.empty{text-align:center;padding:40px 20px;color:var(--muted)}
