:root{--ink:#17201d;--muted:#66736d;--line:#dde4e0;--brand:#e95f38;--soft:#fff5f1;--green:#1f6d52}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:#fff;margin:0;font-family:Arial,Noto Sans Thai,sans-serif;line-height:1.55}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.wrap{max-width:1160px;margin:auto;padding:0 20px}.header{border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:20;background:#fffc;align-items:center;height:68px;display:flex;position:sticky;top:0}.header .wrap{align-items:center;gap:28px;width:100%;display:flex}.brand{letter-spacing:.06em;color:var(--brand);font-weight:900}.nav{flex:1;gap:20px;font-size:14px;display:flex}.actions{gap:10px;display:flex}.btn{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:10px;justify-content:center;align-items:center;padding:10px 16px;font-weight:700;display:inline-flex}.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}.btn.dark{background:var(--ink);color:#fff}.hero{text-align:center;padding:76px 0 46px}.hero h1{max-width:860px;margin:0 auto 20px;font-size:clamp(36px,6vw,64px);line-height:1.1}.hero p{color:var(--muted);max-width:720px;margin:0 auto 28px;font-size:19px}.search{border:1px solid var(--line);background:#fff;border-radius:14px;max-width:720px;margin:auto;padding:6px;display:flex;box-shadow:0 10px 30px #17201d0d}.search input{border:0;outline:0;flex:1;min-width:0;padding:12px}.quick{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:20px;display:flex}.section{padding:44px 0}.section.alt{background:#f7f9f8}.section-title{justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px;display:flex}.section-title h2{margin:0;font-size:30px}.section-title p{color:var(--muted);margin:4px 0 0}.grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.card{border:1px solid var(--line);background:#fff;border-radius:16px;overflow:hidden}.card-body{padding:18px}.product-image{aspect-ratio:1.15;color:var(--muted);background:#f0f3f1;place-items:center;display:grid}.card h3{margin:0 0 8px;font-size:18px}.meta{color:var(--muted);font-size:14px}.price{margin:10px 0;font-size:18px;font-weight:800}.tag{background:var(--soft);color:#a64125;border-radius:999px;margin:3px;padding:5px 9px;font-size:12px;display:inline-block}.notice{background:var(--soft);border:1px solid #f2c9bc;border-radius:12px;padding:14px 16px}.empty{text-align:center;border:1px dashed var(--line);color:var(--muted);border-radius:16px;padding:48px 24px}.form{border:1px solid var(--line);border-radius:16px;max-width:620px;margin:30px auto;padding:24px}.field{gap:7px;margin-bottom:16px;display:grid}.field input,.field select,.field textarea{border:1px solid var(--line);border-radius:9px;width:100%;padding:11px}.field small{color:var(--muted)}.plans{grid-template-columns:repeat(4,1fr)}.plan{padding:22px}.plan h3{margin:0}.plan .amount{margin:12px 0;font-size:26px;font-weight:900}.plan ul{color:var(--muted);min-height:260px;padding-left:20px}.tabs{border-bottom:1px solid var(--line);gap:8px;display:flex;overflow:auto}.tabs a{white-space:nowrap;padding:12px}.tabs a:first-child{border-bottom:3px solid var(--brand)}.detail{grid-template-columns:1fr 1.2fr;gap:34px;display:grid}.kv{border-bottom:1px solid var(--line);grid-template-columns:160px 1fr;padding:10px 0;display:grid}.footer{border-top:1px solid var(--line);color:var(--muted);padding:36px 0 90px}.mobile-nav{display:none}.admin-shell{grid-template-columns:220px 1fr;min-height:calc(100vh - 68px);display:grid}.sidebar{border-right:1px solid var(--line);padding:20px}.sidebar a{padding:9px;display:block}.content{padding:28px}.table{border-collapse:collapse;width:100%}.table th,.table td{text-align:left;border-bottom:1px solid var(--line);padding:12px}@media (max-width:850px){.nav{display:none}.grid,.plans,.detail{grid-template-columns:1fr}.hero{padding-top:46px}.header .actions .btn:first-child{display:none}.mobile-nav{border-top:1px solid var(--line);z-index:30;background:#fff;grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.mobile-nav a{text-align:center;padding:10px 3px;font-size:12px}.mobile-nav .make{color:var(--brand);font-weight:900}.admin-shell{grid-template-columns:1fr}.sidebar{display:none}.plans .plan ul{min-height:0}}
.content{min-width:0;overflow-x:auto}.table{table-layout:fixed}.table th,.table td{overflow-wrap:anywhere}.table form{flex-wrap:wrap;gap:6px;display:flex}@media (max-width:850px){.content{padding:18px}.table{font-size:12px}.table th,.table td{padding:7px}.table .btn{padding:7px 9px;font-size:12px}}@media (max-width:600px){.payments-table,.payments-table tbody,.payments-table tr,.payments-table td{width:100%;display:block}.payments-table thead{display:none}.payments-table tr{border:1px solid var(--line);border-radius:12px;margin-bottom:14px;padding:10px}.payments-table td{border:0;grid-template-columns:92px minmax(0,1fr);gap:8px;padding:6px;font-size:14px;display:grid}.payments-table td:before{content:attr(data-label);font-weight:700}}
