/* FDA Thailand Guide — ธีม TIBD รุ่นสุขุม (owner 7 ต.ค. 69)
   "งานนี้เกี่ยวกับกฎหมาย ต้องมีความน่าเชื่อถือสูง … รู้สึกไว้ใจ และเป็นมิตร อยากเข้ามาปรึกษา"
   หลัก: พื้นขาว/เทาอ่อน ตัวหนังสือกรมท่า · ส้มใช้น้อย (ปุ่มหลัก เส้นเฉียง ตัวเน้น) · ไอคอนเส้นชุดเดียว ไม่ใช้อีโมจิ
         เว้นที่ว่างมาก · มุมโค้งน้อยลง · บอกที่มาข้อมูลและตัวตนบริษัทให้เห็นชัด
   CI TIBD: กรมท่า #062541 · ส้ม #FF8300 · Prompt · แถบเฉียงส้ม
   ⚠️ ส้มเป็นตัวอักษรบนพื้นขาวต้องเข้ม (#B35400 ตัวเล็ก · #C25E00 หัวเรื่อง) · ส้มสดใช้เป็นพื้น/เส้นเท่านั้น
   ⛔ ห้ามสี/หน้าตาแบบเว็บ อย. (น้ำเงิน-ทอง ตราครุฑ) */
:root{
  --bg:#ffffff; --band:#f3f6f9; --paper:#ffffff; --ink:#0d2236; --soft:#46576a; --faint:#6c7c8c; --line:#e0e6ed;
  --navy:#062541; --navy-tint:#ebf0f6; --on-navy:#c5d2df; --title:#062541;
  --orange:#FF8300; --orange-hot:#FF9A2E; --accent:#B35400; --accent-h:#C25E00; --accent-soft:#fff3e6;
  --ok:#1d6b4f; --ok-bg:#e2f3ea; --no:#a3271f; --no-bg:#fbe8e6; --hold:#7a5510; --hold-bg:#fbf2df; --mute:#eef1f4;
  --shadow:0 12px 32px rgba(6,37,65,.08);
  --font:"Prompt","Noto Sans Thai",system-ui,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#05192b; --band:#08223a; --paper:#0b2740; --ink:#e8eef4; --soft:#aebdcb; --faint:#8798a8; --line:#1d3b57;
  --navy:#031426; --navy-tint:#123251; --on-navy:#c5d2df; --title:#f1f5f9;
  --accent:#FFA54A; --accent-h:#FFA54A; --accent-soft:#2f2111;
  --ok:#86d3a1; --ok-bg:#12291f; --no:#f19a92; --no-bg:#331a17; --hold:#e8c06d; --hold-bg:#2c2313; --mute:#0f2d49;
  --shadow:0 12px 32px rgba(0,0,0,.35); color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0}
.page{overflow-x:clip}  /* เส้นเฉียง/พื้นเต็มจอใน .bleed ยื่นเกินจอ — ตัดที่กล่องเต็มความกว้างนี้ (ใส่ที่ body จะถูกส่งต่อเป็นของ viewport แล้วยังเลื่อนข้างได้) */
body{background:var(--bg);color:var(--ink);font-family:var(--font);font-weight:400;font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3{font-family:var(--font);font-weight:600;line-height:1.3;text-wrap:balance;margin:0;color:var(--title)}
h1{font-size:clamp(1.7rem,4.2vw,2.4rem)} h2{font-size:clamp(1.3rem,2.6vw,1.65rem)}
.muted{color:var(--soft)}
nb{white-space:nowrap}  /* ห่อจาก thaiNoTear() — ตัดบรรทัดได้เฉพาะตรงวรรค */
.ico{width:22px;height:22px;flex:none}
.kick{display:block;font-size:.84rem;font-weight:500;color:var(--accent);margin-bottom:6px}
:lang(en) .kick{letter-spacing:.12em;text-transform:uppercase;font-size:.74rem}

/* แถบบนสุด: เว็บอิสระ */
.strip{background:#03182b;color:#dfe7ef;font-size:.8rem;text-align:center;padding:6px 16px}
.strip a{color:var(--orange-hot)}
/* 🧪 ช่วงทดลองใช้ (13 ต.ค. 69) — ป้ายเล็กข้างชื่อเว็บ · ไม่ใช้สีเตือน */
.brand .beta{font-size:.66rem;font-weight:500;color:var(--on-navy);border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:1px 8px;line-height:1.5;align-self:center}
.foot .pow{display:block;font-size:.72rem;letter-spacing:.04em;color:#93a6b9;margin-bottom:6px}
@media (max-width:760px){.strip .betaline{display:none}}   /* มือถือ: แถบบนเกิน 3 บรรทัด → เหลือป้ายข้างชื่อเว็บพอ */

/* หัวเว็บกรมท่า */
.top{background:#062541;color:#fff;position:sticky;top:0;z-index:5}
.top .in{max-width:1120px;margin:0 auto;padding:12px 16px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;white-space:nowrap}
.brand b{font-weight:600;font-size:1.12rem;letter-spacing:.01em}
.brand b span{color:var(--orange)}
.nav{display:flex;gap:22px;flex-wrap:wrap}
.nav a{text-decoration:none;color:var(--on-navy);font-weight:400;padding:4px 0}
.nav a:hover,.nav a[aria-current]{color:#fff}
.nav a[aria-current]{box-shadow:inset 0 -2px 0 var(--orange)}
.sp{flex:1}
.lang{border:1px solid rgba(255,255,255,.55);color:#fff;border-radius:8px;padding:3px 12px;text-decoration:none;font-weight:500;font-size:.86rem}
.lang:hover{background:rgba(255,255,255,.08)}
/* 🌏 เมนูภาษา 5 ภาษา (21 ต.ค. 69 · ไม่ใช้ select) — กดแล้วรายการลงมาใต้ปุ่ม */
.langm{position:relative}
.langm summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.55);color:#fff;border-radius:8px;padding:3px 10px;font-weight:500;font-size:.86rem;min-height:32px}
.langm summary::-webkit-details-marker{display:none}
.langm summary:hover,.langm[open] summary{background:rgba(255,255,255,.08)}
.langm summary .ico,.langm summary svg{width:16px;height:16px}
.langl{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.25);padding:6px;display:grid;min-width:150px;z-index:20}
.langl a{color:#062541;text-decoration:none;padding:8px 12px;border-radius:6px;font-size:.92rem;white-space:nowrap}
.langl a:hover{background:#eef3f8}.langl a[aria-current]{font-weight:600;box-shadow:inset 3px 0 0 var(--orange)}
@media (max-width:760px){.langl{left:0;right:auto}}   /* มือถือ: ปุ่มภาษาอยู่ซ้าย → รายการเปิดไปทางขวา ไม่ล้นจอ */
/* 🌏 ฟอนต์ภาษาเกาหลี/ญี่ปุ่น/จีน (Prompt ไม่มีตัวอักษร) · เกาหลีตัดบรรทัดตามวรรค */
html[lang="ko"]{--font:Prompt,"Noto Sans KR",system-ui,sans-serif}html[lang="ko"] body{word-break:keep-all}
html[lang="ja"]{--font:Prompt,"Noto Sans JP",system-ui,sans-serif}
html[lang="zh-Hans"]{--font:Prompt,"Noto Sans SC",system-ui,sans-serif}
.cta,.btn{background:var(--orange);color:#062541;border:0;border-radius:10px;padding:10px 18px;font:inherit;font-weight:500;text-decoration:none;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:8px}
.cta:hover,.btn:hover{background:var(--orange-hot)}
.btn .ico{width:18px;height:18px}
@media (max-width:760px){.nav{order:9;width:100%;gap:16px;font-size:.92rem}.cta{display:none}.top .in{gap:10px 14px}}
/* 📝 26 ต.ค. 69 เมนูเพิ่ม "บทความ" — จอกลาง (761–1180px) หัวเว็บแน่นขึ้น ไม่ให้ปุ่มปรึกษาทีมตกไปแถวที่ 2 */
@media (min-width:761px) and (max-width:1180px){.nav{gap:16px;font-size:.94rem}.top .in{gap:14px}.top .cta{padding:9px 14px}}
/* 🔴 QA-001 (27 ต.ค. 69): เข้าสู่ระบบแล้ว ปุ่มปรึกษาทีมตกแถว 2 ที่ 1440px
   ต้นเหตุ: member.js เคยใส่ class "in" ให้ลิงก์บัญชี — ชนกับ .top .in (กล่องหัวเว็บ) ลิงก์จึงได้ padding 12/16 + margin auto ไปด้วย
   ⇒ เปลี่ยนเป็น class "signed" · ชื่อยาวตัดด้วย … (ชื่อเต็มอยู่ใน title) · ไม่ลดขนาดตัวอักษร
   ★ หัวเว็บกว้างสุด 1120px เท่ากันทุกจอ ≥ 1152px — เข้าสู่ระบบแล้ว (.mem จาก member.js) ใช้ระยะห่างแบบจอกลางเดิมทุกจอ desktop
   ★ ทีม (.staff): ลิงก์หลังบ้านเหลือไอคอน (ข้อความยังอยู่ให้โปรแกรมอ่านจอ + title) (เดิมซ่อน "เกม" ด้วย — เลิกแล้ว 30 ต.ค. ดูท้ายไฟล์)
     (ยังเข้าได้จากหน้าเครื่องมือ/ท้ายเว็บ) — วัดแล้วหน้าอังกฤษ + ชื่อยาว 16 ตัว + แจ้งเตือน 2 หลัก ไม่พอแถวเดียวถ้าไม่ทำสองข้อนี้ */
.acct.signed>span:not(.nbadge){max-width:7em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (min-width:761px){.top.mem .in{gap:14px}.top.mem .nav{gap:16px}.top.mem .cta{padding:9px 14px}
  .top.staff #acctAdm>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}

.wrap{max-width:1120px;margin:0 auto;padding:0 16px 96px;display:grid;gap:72px}
/* แถบพื้นเต็มจอโดยไม่ทำให้หน้าเลื่อนข้าง (ไม่ใช้ 100vw) */
.bleed{position:relative;background:var(--band);box-shadow:0 0 0 100vmax var(--band);clip-path:inset(0 -100vmax)}

/* ---------- หน้าแรก: หัว ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:48px;align-items:center;padding:56px 0}
.hero::after{content:"";position:absolute;right:-6%;top:-30%;width:16px;height:160%;background:var(--orange);transform:rotate(24deg);pointer-events:none}
.hero::before{content:"";position:absolute;right:4%;top:-30%;width:60px;height:160%;background:var(--navy-tint);transform:rotate(24deg);pointer-events:none}
.hero > *{position:relative;z-index:1}
.hl{display:grid;gap:16px;justify-items:start}
.hero h1{font-size:clamp(2rem,5vw,3.05rem);line-height:1.22}
.hero h1 span{white-space:nowrap}
.hero h1 .hi{color:var(--accent-h)}
.hero p{color:var(--soft);margin:0;max-width:58ch;font-size:1.04rem}
.search{display:flex;gap:8px;flex-wrap:wrap;width:100%;max-width:640px}
.sbox{flex:1 1 18rem;min-width:0;display:flex;align-items:center;gap:10px;background:var(--paper);border:1.5px solid var(--line);border-radius:10px;padding:0 14px;color:var(--faint)}
.sbox:focus-within{border-color:var(--navy);box-shadow:0 0 0 3px rgba(255,131,0,.25)}
.sbox input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:16px;color:var(--ink);padding:13px 0}
.search > input,.search select{flex:1 1 16rem;min-width:0;font:inherit;font-size:16px;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--paper);color:var(--ink)}
.search select{flex:0 1 12rem}
.search > input:focus,.search select:focus{outline:none;border-color:var(--navy)}
.search button{background:#062541;color:#fff;border:0;border-radius:10px;padding:0 24px;font:inherit;font-weight:500;cursor:pointer;min-height:50px}
@media (prefers-color-scheme:dark){.search button{background:var(--orange);color:#062541}}
.ghost{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-weight:500;text-decoration:none}
.ghost:hover{text-decoration:underline}

.trust{background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:26px;display:grid;gap:16px}
.trust > b{font-weight:600;font-size:1.05rem;color:var(--title)}
.trust ul,.consult ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.trust li,.consult li{display:flex;gap:10px;align-items:flex-start;line-height:1.55}
.trust li .ico{width:20px;height:20px;color:var(--ok);margin-top:2px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-top:1px solid var(--line);padding-top:16px}
.stats strong{display:block;font-size:1.7rem;font-weight:600;line-height:1.2;color:var(--title);font-variant-numeric:tabular-nums}
.stats span{font-size:.84rem;color:var(--soft)}
.trust small{display:flex;align-items:center;gap:6px;color:var(--faint);font-size:.82rem}
.trust small .ico{width:16px;height:16px}
@media (max-width:860px){
  .hero{grid-template-columns:1fr;gap:28px;padding:36px 0 40px}
  .hero::before,.hero::after{right:-30%}
}

/* หัวข้อของแต่ละส่วน */
.sh{display:grid;gap:4px;margin-bottom:22px}
.sh p{margin:4px 0 0;max-width:62ch}

/* การ์ด */
.haves{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:860px){.haves{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.haves{grid-template-columns:1fr}}
.have,.tool,.svc{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:20px;text-decoration:none;color:var(--ink);display:grid;gap:4px;align-content:start;
  position:relative;transition:border-color .15s,box-shadow .15s}
.have:hover,.tool:hover,.svc:hover{border-color:var(--navy);box-shadow:var(--shadow)}
@media (prefers-color-scheme:dark){.have:hover,.tool:hover,.svc:hover{border-color:var(--accent)}}
.ic{width:44px;height:44px;border-radius:10px;background:var(--navy-tint);color:var(--navy);display:grid;place-items:center;margin-bottom:10px;flex:none}
@media (prefers-color-scheme:dark){.ic{color:#dbe6f1}}
.have b,.tool b,.svc b{font-weight:500;font-size:1.04rem;color:var(--title)}
.have small,.tool small,.svc small{color:var(--soft);font-size:.9rem;line-height:1.55}
.have .go{position:absolute;top:22px;right:20px;width:18px;height:18px;color:var(--faint);transition:transform .15s,color .15s}
.have:hover .go{transform:translateX(3px);color:var(--accent)}
.svcs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.svc .who{margin-top:8px;font-size:.78rem;color:var(--faint);letter-spacing:.02em}
.tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:760px){.svcs,.tools{grid-template-columns:1fr}}
.tool.sm{grid-auto-flow:column;justify-content:start;align-items:center;gap:12px;padding:10px 14px}
.tool.sm .ic{width:36px;height:36px;margin:0}

/* ที่มาของข้อมูล */
.how{padding:56px 0}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.steps li{display:grid;gap:6px;align-content:start}
.steps li .ic{background:var(--paper);border:1px solid var(--line)}
.steps b{font-weight:500;font-size:1.05rem;color:var(--title)}
.steps p{margin:0;color:var(--soft);font-size:.94rem}
.hownote{margin:28px 0 0;padding-left:12px;border-left:3px solid var(--orange);color:var(--soft);font-size:.9rem}
@media (max-width:760px){.steps{grid-template-columns:1fr;gap:22px}.how{padding:40px 0}}

/* ประกาศ */
.laws{list-style:none;margin:0;padding:0;display:grid;background:var(--paper);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.law{padding:14px 18px;display:grid;gap:4px;border-bottom:1px solid var(--line)}
.law:last-child{border-bottom:0}
.laws:empty{display:none}
.lh{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.yr{font-variant-numeric:tabular-nums;color:var(--faint);font-size:.86rem}
.lt{font-size:.97rem}
.lo{font-size:.86rem;color:var(--accent)}
.law ul{margin:4px 0 0;padding-left:1.2em;font-size:.9rem;color:var(--soft)}
.chip{display:inline-block;font-size:.74rem;font-weight:500;border-radius:6px;padding:1px 8px;background:var(--mute);color:var(--soft);white-space:nowrap}
.c-food{background:var(--hold-bg);color:var(--hold)} .c-cosmetic{background:#efe7fb;color:#5a3c91} .c-herbal{background:var(--ok-bg);color:var(--ok)}
.c-ok{background:var(--ok-bg);color:var(--ok)} .c-mute{background:var(--mute);color:var(--faint)}
@media (prefers-color-scheme:dark){.c-cosmetic{background:#271d38;color:#c9b3f0}}
.more{display:inline-block;margin-top:12px;font-weight:500;color:var(--accent)}

/* ปรึกษาทีม: กรมท่า + เส้นเฉียงส้ม */
.consult{position:relative;overflow:hidden;background:#062541;color:#fff;border-radius:16px;padding:44px 40px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:36px;align-items:center}
.consult::after{content:"";position:absolute;right:30%;top:-40%;width:12px;height:180%;background:var(--orange);opacity:.85;transform:rotate(24deg);pointer-events:none}
.consult > *{position:relative;z-index:1}
.consult .kick{color:var(--orange-hot)}
.consult h2{color:#fff;margin-bottom:8px}
.consult p{color:var(--on-navy);margin:0 0 16px;max-width:56ch}
.consult li .ico{width:20px;height:20px;color:var(--orange);margin-top:2px}
.cbtn{display:grid;gap:10px;background:#062541;padding:4px 0}
.cbtn .btn{padding:13px 18px;font-size:1.02rem}
.btn.line{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6)}
.btn.line:hover{background:rgba(255,255,255,.08)}
.cbtn small{color:var(--on-navy);font-size:.8rem;text-align:center}
.cbtn small a{color:#fff}
@media (prefers-color-scheme:dark){.consult,.cbtn{background:#0c3053}.consult{box-shadow:inset 0 0 0 1px #1f4266}}
@media (max-width:760px){.consult{grid-template-columns:1fr;padding:30px 22px;gap:22px}.consult::after{right:-4%}}

/* หน้าบริการ */
.crumb{color:var(--soft);font-size:.9rem;margin:28px 0 -48px}
.crumb a{color:var(--accent)}
.svch{display:flex;align-items:center;gap:14px}
.svch .ic{margin:0;width:52px;height:52px}
.svcpage{display:grid;grid-template-columns:minmax(0,1fr) 18rem;gap:36px;align-items:start}
.svcpage section{display:grid;gap:8px}
.svcpage h2{margin:18px 0 0;font-size:1.2rem}
@media (max-width:860px){.svcpage{grid-template-columns:1fr}}
.side{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--orange);border-radius:12px;padding:18px;display:grid;gap:8px;position:sticky;top:84px;box-shadow:var(--shadow)}
.side p{margin:0}
.side a:not(.btn){color:var(--accent);font-weight:500}
.ticks{margin:0;padding-left:1.2em;display:grid;gap:4px}
.ticks li::marker{color:var(--orange)}
.note{background:var(--band);border-left:3px solid var(--orange);border-radius:6px;padding:10px 14px;font-size:.92rem;margin:6px 0 0;color:var(--soft)}
.narrow{max-width:720px;display:grid;gap:12px}
.narrow p{margin:0}
.wrap > :first-child:not(.bleed){margin-top:36px}

/* ฟอร์ม */
.form{display:grid;gap:14px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--orange);border-radius:12px;padding:22px;box-shadow:var(--shadow)}
.form label{display:grid;gap:4px;font-weight:500;font-size:.95rem}
.form input,.form select,.form textarea{font:inherit;font-size:16px;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg);color:var(--ink);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(255,131,0,.25)}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* ⛔ ไม่ใช้ <select> — ปุ่มกดเลือก (.cpick) แทน: ฟอร์มติดต่อ · หมวดค้นประกาศ */
.form .flabel{display:grid;gap:4px;font-weight:500;font-size:.95rem}
.cpick{margin:4px 0 0;gap:6px}
.cpick .pfilter{font:inherit;font-size:.88rem;font-weight:400;cursor:pointer;padding:6px 12px}
.phead .cpick{max-width:820px;margin-top:12px}
@media (max-width:560px){.form .row{grid-template-columns:1fr}}
.form label.c{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:.86rem;color:var(--soft)}
.form label.c input{width:auto;margin-top:4px;accent-color:var(--orange)}
.msg{margin:0;font-size:.92rem}
.msg.bad{color:var(--no)} .msg.good{color:var(--ok)}
.gameframe{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#000;aspect-ratio:9/16;max-height:80vh;max-width:520px}
.gameframe iframe{width:100%;height:100%;border:0;display:block}

/* ท้ายเว็บ: ตัวตนบริษัทครบ (ชื่อ เลขทะเบียน ที่อยู่ ช่องทางติดต่อ) */
.foot{background:#062541;color:var(--on-navy);font-size:.86rem;position:relative}
.foot::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--orange)}
.foot .in{max-width:1120px;margin:0 auto;padding:44px 16px 40px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1.4fr;gap:28px}
.foot img{height:52px;width:auto;display:block;margin-bottom:12px}
.foot p{margin:0 0 8px;line-height:1.6}
.foot b{display:block;color:#fff;font-weight:500;margin-bottom:8px}
.foot nav{display:grid;gap:6px;align-content:start}
.foot a{color:var(--on-navy);text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline}
.foot .small,.foot .fstrip{font-size:.78rem;color:#93a6b9}
@media (max-width:860px){.foot .in{grid-template-columns:1fr 1fr}.fbrand{grid-column:1/-1}}
@media (max-width:520px){.foot .in{grid-template-columns:1fr}}

.float{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:54px;height:54px;border-radius:50%;background:var(--orange);color:#062541;display:grid;place-items:center;text-decoration:none;box-shadow:0 6px 18px rgba(6,37,65,.3)}
.float .ico{width:26px;height:26px}
@media (min-width:761px){.float{display:none}}
:focus-visible{outline:3px solid var(--orange);outline-offset:2px}

/* ---------- รอบ 2 จาก mockup ChatGPT v2 (7 ต.ค. 69): การ์ดแนวนอน · ตารางประกาศ · หน้าปรึกษา/ค้นประกาศมีคอลัมน์ข้าง ---------- */
.small{font-size:.84rem}
/* การ์ดแนวนอน: ไอคอนซ้าย ข้อความขวา (กินที่น้อยลง โดยเฉพาะมือถือ) */
.have,.svc,.tool{grid-template-columns:44px minmax(0,1fr);column-gap:14px;row-gap:2px}
.have{grid-template-columns:44px minmax(0,1fr) 18px}
.have .ic,.svc .ic,.tool .ic{grid-row:1/5;margin:0}
.have > :not(.ic):not(.go):not(.spot),.svc > :not(.ic),.tool > :not(.ic){grid-column:2}
.have .go{position:static;grid-column:3;grid-row:1/3;align-self:center}
.tool.sm{grid-template-columns:36px minmax(0,1fr)}
/* ที่มาข้อมูล: ไอคอนซ้าย + เส้นคั่นคอลัมน์ */
.steps li{grid-template-columns:44px minmax(0,1fr);column-gap:14px}
.steps li .ic{grid-row:1/3;margin:0}
.steps li > b,.steps li > p{grid-column:2}
@media (min-width:761px){.steps li + li{border-left:1px solid var(--line);padding-left:28px}}
/* ประกาศล่าสุดหน้าแรก: แถวเดียวแบบตาราง (จอกว้าง) */
@media (min-width:861px){
  .laws.tbl .law{grid-template-columns:7.5rem 3.5rem minmax(0,1fr) 9rem 7.5rem;align-items:center;column-gap:16px}
  .laws.tbl .lh{display:contents}
  .laws.tbl .lh .chip:first-child{order:1;justify-self:start}
  .laws.tbl .yr{order:2}
  .laws.tbl .lt{order:3}
  .laws.tbl .lh .chip:last-child{order:4;justify-self:start}
  .laws.tbl .lo{order:5;justify-self:end}
}
/* หัวหน้าแบบแถบเทา (ค้นประกาศ · ปรึกษาทีม) */
.phead{padding:48px 0 40px;display:grid;gap:10px;justify-items:start}
.phead::after{content:"";position:absolute;right:-4%;top:-30%;width:14px;height:160%;background:var(--orange);transform:rotate(24deg);pointer-events:none}
.phead::before{content:"";position:absolute;right:5%;top:-30%;width:54px;height:160%;background:var(--navy-tint);transform:rotate(24deg);pointer-events:none}
.phead > *{position:relative;z-index:1}
.phead h1{font-size:clamp(1.8rem,4.4vw,2.6rem)}
.phead p{color:var(--soft);margin:0;max-width:62ch}
.phead .search{max-width:820px;margin-top:8px}
.phead #lc{font-size:.9rem}
@media (max-width:760px){.phead::before,.phead::after{right:-30%}.phead{padding:32px 0 28px}}
.phead + .cols{margin-top:-28px}
.cols{display:grid;grid-template-columns:minmax(0,1fr) 20rem;gap:28px;align-items:start}
.cols.contact{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
@media (max-width:860px){.cols,.cols.contact{grid-template-columns:1fr}}
.aside{display:grid;gap:16px;align-content:start}
.box{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:20px;display:grid;gap:12px}
.box > b{font-weight:600;font-size:1.05rem;color:var(--title)}
.box p{margin:0}
.box.navy{background:#062541;border-color:#062541;color:#fff}
.box.navy > b{color:#fff}
.box.navy p{color:var(--on-navy)}
@media (prefers-color-scheme:dark){.box.navy{background:#0c3053;border-color:#1f4266}}
.ilist,.next,.clist{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ilist li{display:flex;gap:12px;align-items:flex-start;color:var(--soft);font-size:.92rem;line-height:1.55}
.ilist .ic{width:36px;height:36px;margin:0}
.ilist .ic .ico{width:18px;height:18px}
.next{gap:0}
.next li{display:flex;gap:14px;align-items:flex-start;position:relative;padding-bottom:18px;line-height:1.55}
.next li:last-child{padding-bottom:0}
.next li:not(:last-child)::before{content:"";position:absolute;left:15px;top:34px;bottom:4px;width:2px;background:var(--line)}
.next .n{flex:none;width:32px;height:32px;border-radius:50%;background:#062541;color:#fff;display:grid;place-items:center;font-weight:500;font-size:.9rem}
@media (prefers-color-scheme:dark){.next .n{background:var(--orange);color:#062541}}
.next li > span:last-child{padding-top:4px}
.mail{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.mail:hover{text-decoration:underline}
.who{line-height:1.6;color:var(--soft);font-size:.9rem}
.who strong{color:var(--title);font-weight:500;font-size:1rem}
.btn.ghostbtn{background:transparent;color:var(--title);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.ghostbtn:hover{background:var(--band)}
.box .btn,.side .btn{width:100%}
.form h2{font-size:1.2rem;margin-bottom:2px}
.form .btn{justify-self:stretch;padding:13px 18px}
/* หน้าบริการ */
.clist li{display:flex;gap:10px;align-items:flex-start}
.clist .ico{width:20px;height:20px;color:var(--orange);margin-top:3px}
.flow{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;counter-reset:f}
.flow li{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:14px;display:grid;gap:10px;align-content:start;line-height:1.45;font-size:.92rem}
.flow .ic{width:36px;height:36px;margin:0}
.flow .ic .ico{width:18px;height:18px}
.flow small{display:block;color:var(--faint);font-size:.76rem}
@media (max-width:760px){.flow{grid-template-columns:repeat(2,minmax(0,1fr))}}
.side .by{font-size:1.05rem}
.side small.muted{font-size:.8rem}

/* ---------- ภาพประกอบจาก ChatGPT (7 ต.ค. 69) + สัญลักษณ์แบรนด์ ---------- */
.brand .mk{width:30px;height:30px;display:block;flex:none}
/* หัวหน้าแรก: ข้อความ | ภาพประกอบ · กล่อง "ทุกคำตอบ" ลงมาเป็นแถวเต็มกว้าง (ภาพมีเส้นเฉียงของตัวเองแล้ว ไม่ต้องวาดซ้ำ) */
.hero{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px 48px;padding:48px 0 44px}
.hero::before,.hero::after{display:none}
.hart img{display:block;width:100%;height:auto;max-height:440px;object-fit:contain}
.trust{grid-column:1/-1;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-areas:"t s" "l s" "l a";column-gap:36px;align-items:start}
.trust > b{grid-area:t}.trust ul{grid-area:l}.trust .stats{grid-area:s;border-top:0;padding-top:0;border-left:1px solid var(--line);padding-left:28px}.trust > small{grid-area:a;padding-left:28px}
@media (max-width:860px){
  .hero{grid-template-columns:1fr}
  .hart img{max-height:260px;margin:0 auto}
  .trust{grid-template-columns:1fr;grid-template-areas:"t" "l" "s" "a"}
  .trust .stats{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:16px}.trust > small{padding-left:0}
}
/* การ์ดจุดเริ่มต้น: ภาพประกอบวงกลมแทนไอคอน */
.have{grid-template-columns:88px minmax(0,1fr) 18px;column-gap:16px;align-items:center;padding:16px 20px}
.have .spot{grid-column:1;grid-row:1/3;width:88px;height:88px}
.spot img{display:block;width:100%;height:100%}
.have b{align-self:end}.have small{align-self:start}
@media (max-width:520px){.have{grid-template-columns:68px minmax(0,1fr) 18px;padding:12px 16px}.have .spot{width:68px;height:68px}}
/* ที่มาของข้อมูล: ภาพประกอบบนหัวแต่ละขั้น */
.steps li{grid-template-columns:1fr}
.steps li > b,.steps li > p{grid-column:auto}
.hill{display:block;width:100%;height:150px;object-fit:contain;margin-bottom:10px}
/* หัวหน้าที่มีภาพประกอบ (หน้าปรึกษาทีม) */
.phead.witharts{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;column-gap:36px;justify-items:stretch}
.phead.witharts::before,.phead.witharts::after{display:none}
.phead .pt{display:grid;gap:10px;justify-items:start}
.part img{display:block;width:100%;height:auto;max-height:300px;object-fit:contain}
@media (max-width:860px){.phead.witharts{grid-template-columns:1fr}.part img{max-height:200px;margin:0 auto}}
/* โหมดมืด: ภาพลายเส้นกรมท่าจมพื้นเข้ม → วางบนแผ่นสว่าง */
@media (prefers-color-scheme:dark){
  div.art{background:#e6edf4;border-radius:14px;padding:12px}
  img.art{background:#e6edf4;border-radius:12px;padding:8px}
}
/* ภาพหัวหน้าบริการ (s01–s09) */
.svcart{background:var(--band);border-radius:14px;padding:12px 18px;margin-bottom:8px}
.svcart img{display:block;width:100%;height:auto;max-height:300px;object-fit:contain}
@media (max-width:760px){.svcart img{max-height:200px}}
/* หน้ารวมบริการ: การ์ดมีภาพหัว */
.svc.big{grid-template-columns:1fr;padding:0;overflow:hidden}
.svc.big > .sart{grid-column:1;display:block;width:100%;height:170px;object-fit:contain;background:var(--band);padding:14px 18px;box-sizing:border-box}
.svc.big > :not(.sart){grid-column:1;padding:0 20px}
.svc.big b{padding-top:14px}.svc.big .who{padding-bottom:16px}
@media (prefers-color-scheme:dark){.svc.big .sart{background:#e6edf4}}
.narrow .th2{font-size:1.08rem;margin-top:10px}

/* QA 8 ต.ค. 69 */
/* เกมฝัง: เดิมกว้างแค่ ~326px บนคอม ภาพวิธีเล่นโดนตัดขวา → กว้าง 480px ตามสัดส่วนมือถือ */
.gameframe{width:min(100%,480px);max-width:none;max-height:none;aspect-ratio:9/16}
/* มือถือ: เห็นว่าใครดำเนินการตั้งแต่หัวเว็บ (เดิมซ่อน "by TIBD" บนจอแคบ) */
@media (max-width:760px){
  .brand b{font-size:1rem}
  .brand .by{display:flex;padding-left:8px;gap:4px;font-size:.62rem}
  .brand .by img{height:14px}
  .brand .mk{width:26px;height:26px}
}
/* 🖼 รอบ 3 (9 ต.ค. 69 · owner "ดู Nerd ไม่ค่อย friendly") — การ์ดเครื่องมือมีภาพ · เลือกหมวดด้วยภาพ · ค้นไม่เจอ · แบนเนอร์สัมมนา */
.tool.big{grid-template-columns:1fr;padding:0;overflow:hidden;align-content:start}
.tool.big > .sart{grid-column:1;display:block;width:100%;height:190px;object-fit:contain;background:var(--band);padding:14px 18px;box-sizing:border-box}
.tool.big > :not(.sart){grid-column:1;padding:0 20px}
.tool.big b{padding-top:14px}.tool.big small{padding-bottom:18px}
@media (max-width:520px){.tools{grid-template-columns:1fr}.tool.big > .sart{height:160px}}
.cath{font-weight:500;color:var(--title);margin:0 0 8px}
.cats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 18px}
.cat{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--paper);border:1px solid var(--line);border-radius:14px;
  padding:12px 8px;font:inherit;font-size:.9rem;color:var(--ink);cursor:pointer;text-align:center;line-height:1.35}
.cat img{width:64px;height:64px}
.cat:hover{border-color:var(--navy)}
.cat[aria-pressed="true"]{border-color:var(--orange);box-shadow:inset 0 0 0 2px var(--orange)}
@media (max-width:520px){.cats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.laws .nf{display:flex;gap:18px;align-items:center;list-style:none;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:16px 20px}
.laws .nf img{width:120px;height:120px;flex:0 0 auto}
.laws .nf b{font-size:1.08rem;color:var(--title)}.laws .nf p{margin:4px 0 10px;color:var(--soft)}
@media (max-width:520px){.laws .nf{flex-direction:column;text-align:center}}
.evband{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:center;background:var(--paper);
  border:1px solid var(--line);border-left:5px solid var(--orange);border-radius:16px;padding:22px 26px;margin-top:28px}
.evband b{display:block;font-size:1.25rem;font-weight:600;color:var(--title);margin:4px 0 6px;line-height:1.4}
.evband p{color:var(--soft);margin:0 0 14px}
.evband img{display:block;width:100%;height:auto;max-height:230px;object-fit:contain}
@media (max-width:760px){.evband{grid-template-columns:1fr;padding:18px}.evband img{max-height:170px;order:-1}}
@media (prefers-color-scheme:dark){.tool.big .sart{background:#e6edf4}.cat img,.laws .nf img,.evband img{background:#e6edf4;border-radius:12px;padding:4px;box-sizing:border-box}}
/* 📷 ภาพถ่ายสมจริงแทนกราฟิกทั้งเว็บ (9 ต.ค. 69 · owner "รูป graphic แบบนี้มันดูเด็ก ดูไม่น่าเชื่อถือ")
   ภาพถ่ายต้องเต็มกรอบ (cover) มุมมน · ไม่มีแผ่นรองสีอ่อนในโหมดมืด (แผ่นรองมีไว้ให้ลายเส้นกรมท่าไม่จมพื้นเข้ม) */
.hart img{aspect-ratio:4/3;max-height:none;object-fit:cover;border-radius:18px;box-shadow:var(--shadow)}
.spot img{object-fit:cover;border-radius:14px}
.hill{height:auto;aspect-ratio:2/1;object-fit:cover;border-radius:12px}
.part img{aspect-ratio:4/3;max-height:none;object-fit:cover;border-radius:16px}
.svcart{background:none;padding:0}
.svcart img{aspect-ratio:16/9;max-height:none;object-fit:cover;border-radius:16px}
.svc.big > .sart,.tool.big > .sart{height:auto;aspect-ratio:16/10;object-fit:cover;padding:0;background:none}
.cat{padding:8px 8px 12px}
.cat img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.laws .nf img{object-fit:cover;border-radius:12px}
.evband img{width:100%;height:250px;max-height:none;object-fit:cover;border-radius:12px}
@media (max-width:860px){.hart img,.part img{aspect-ratio:16/10;max-height:none}}
@media (max-width:760px){.evband img{height:190px;max-height:none}}
@media (prefers-color-scheme:dark){
  div.art,img.art{background:none;padding:0}
  .svc.big .sart,.tool.big .sart{background:none}
  .cat img,.laws .nf img,.evband img{background:none;padding:0}
}
/* การ์ดเครื่องมือเรียง 2 คอลัมน์ — ภาพ 16:10 สูงเกินจนข้อความเหลือนิดเดียว (owner 9 ต.ค. "ภาพไม่สมดุล") → 2:1 */
.tool.big > .sart{aspect-ratio:2/1}
/* 🗂 ประกาศล่าสุดบนหน้าแรกเป็นการ์ด 3 × 2 (เดิมเป็นตาราง ชื่อประกาศยาวอ่านยาก) */
.lcards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.lcard{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.lcard .lh{display:flex;flex-wrap:wrap;gap:6px}
.lcard .lt{font-weight:500;font-size:1.02rem;line-height:1.5;color:var(--title);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lcard .lm{color:var(--faint);font-size:.84rem;line-height:1.5}
.lcard .lo{margin-top:auto;padding-top:4px}
@media (max-width:860px){.lcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.lcards{grid-template-columns:1fr}}
/* 📝 บทความบริการ (SEO) — อ่านยาวบนมือถือ: ตัวหนังสือใหญ่พอ บรรทัดไม่ยาวเกิน ตารางเลื่อนข้างได้ในกรอบ */
.sarticle{margin-top:36px;padding-top:28px;border-top:1px solid var(--line);max-width:72ch}
.sarticle h2{font-size:1.32rem;margin:30px 0 10px;color:var(--title);line-height:1.45}
.sarticle h3{font-size:1.08rem;margin:28px 0 8px;color:var(--title)}
.sarticle p{line-height:1.85;margin:0 0 14px}
.sarticle .alead{font-size:1.08rem;color:var(--title);font-weight:400}
.sarticle .alist{margin:0 0 16px;padding-left:1.3em;line-height:1.8}
.sarticle .alist li{margin:4px 0}
.atable{overflow-x:auto;margin:6px 0 18px;border:1px solid var(--line);border-radius:10px}
.atable table{border-collapse:collapse;width:100%;min-width:520px;font-size:.93rem}
.atable th,.atable td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;line-height:1.6}
.atable th{background:var(--band);color:var(--title);font-weight:500}
.atable tr:last-child td{border-bottom:0}
.sarticle .aimg{margin:6px 0 18px}
.sarticle .aimg img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px}
.anote{display:flex;gap:10px;background:var(--band);border-left:4px solid var(--orange);border-radius:8px;padding:12px 14px}
.anote .ico{flex:0 0 auto;width:20px;height:20px;color:var(--accent);margin-top:3px}
.afaq details{border:1px solid var(--line);border-radius:10px;padding:0 16px;margin:0 0 10px;background:var(--paper)}
.afaq summary{cursor:pointer;padding:14px 0;font-weight:500;color:var(--title);line-height:1.6}
.afaq details p{margin:0 0 14px}
.arefs{font-size:.86rem;color:var(--soft);line-height:1.7;padding-left:1.3em}
.arefs a{color:var(--accent);white-space:nowrap}
/* 🪤 คอลัมน์ grid มี min-width:auto → ตารางในบทความ (min-width 520px) ดันคอลัมน์กว้าง 755px บนจอ 375px
      ข้อความ FAQ/อ้างอิงเลยล้นขอบขวาโดนตัด (เจอตอนวัดมือถือ 10 ต.ค. 69) — ให้ตารางเลื่อนข้างในกรอบของมันเองแทน */
.svcpage > section,.sarticle{min-width:0}
/* QA 10 ต.ค. 69 (F20): ภาพพัฒนาสูตร คนยกบีกเกอร์สูง → กรอบตัดหัว/บีกเกอร์ · เลื่อนจุดโฟกัสขึ้น */
.svcart img[src*="product-development"],.svc.big > .sart[src*="product-development"]{object-position:center 18%}
#lc a{color:var(--accent)}

/* 🗺 แผนผังกฎหมาย (/th/laws/map · owner 11 ต.ค. 69) — สี พ.ร.บ. ตาม chip เดิม: อาหาร=อำพัน · เครื่องสำอาง=ม่วง · สมุนไพร=เขียว · Milk Code=กรมท่า */
:root{--m-food:#b07d1a; --m-cosmetic:#7a55b8; --m-herbal:#2f8a5f; --m-milk:#2f6698; --m-related:#2c7a80; --m-pharma:#a8405a; --m-meddev:#4a5fc1; --m-hazsub:#b5542a; --m-narcotic:#677a24}
@media (prefers-color-scheme:dark){:root{--m-food:#e8c06d; --m-cosmetic:#c9b3f0; --m-herbal:#86d3a1; --m-milk:#8fbbe6; --m-related:#7fd0d6; --m-pharma:#f0a1b3; --m-meddev:#aab7f5; --m-hazsub:#f4a37d; --m-narcotic:#c6d67f}}
.m-food{--mc:var(--m-food)} .m-cosmetic{--mc:var(--m-cosmetic)} .m-herbal{--mc:var(--m-herbal)} .m-milk{--mc:var(--m-milk)} .m-related{--mc:var(--m-related)} .m-pharma{--mc:var(--m-pharma)} .m-meddev{--mc:var(--m-meddev)} .m-hazsub{--mc:var(--m-hazsub)} .m-narcotic{--mc:var(--m-narcotic)}  /* 🩺 เครื่องมือแพทย์ · ☣️ วัตถุอันตราย · 💊 ยาเสพติด (20 ต.ค. 69 · เดิมลืมใส่สี การ์ดเลยไม่มีแถบสี) */  /* 💊 ยา (17 ต.ค. 69) */
/* 🪤 inline-flex ทำให้ <nb> แต่ละคำเป็นชิ้นแยก มีช่องว่าง 6px คั่นและตัดบรรทัดเป็นก้อน → ใช้ inline-block ให้ข้อความไหลเป็นประโยค (20 ต.ค. 69) */
.maplink{display:inline-block;color:var(--accent);font-weight:500;text-decoration:none;margin-top:6px;line-height:1.5}
.maplink:hover{text-decoration:underline}
.maplink .ico{width:18px;height:18px;vertical-align:-4px;margin-right:6px}
.mtabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:22px 0 18px}
.mtab{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-top:4px solid var(--mc);border-radius:10px;padding:12px 14px;text-align:left;cursor:pointer;font:inherit;display:grid;gap:4px;min-width:0}
.mtab b{font-weight:600;line-height:1.35;font-size:.95rem}
.mtab small{color:var(--soft)}
.mtab[aria-pressed="true"]{background:var(--band);box-shadow:inset 0 0 0 2px var(--mc)}
.mstack{display:flex;gap:2px;height:8px;border-radius:4px;overflow:hidden}
.mstack i{background:var(--mc);opacity:.85}
.mstack i:nth-child(2n){opacity:.55}
.mapgrid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:start}
.mhead h2{color:var(--mc)}
.mhead p{margin:4px 0 10px}
.msec{margin:18px 0 6px}
.msh{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
.msh h3{font-size:1.06rem}
.mcount{color:var(--soft);font-size:.85rem;margin-left:auto;white-space:nowrap}
.mp{margin:2px 0 6px;color:var(--soft);font-size:.9rem}
.msub{margin:12px 0 6px;font-size:.84rem;font-weight:500;color:var(--soft)}
.mtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px;margin-top:8px}
.mtile{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;align-items:center;text-align:left;font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:9px 12px;cursor:pointer;min-width:0}
.mtile:hover{border-color:var(--mc)}
.mtile[aria-pressed="true"]{border-color:var(--mc);box-shadow:inset 0 0 0 1px var(--mc);background:var(--band)}
.mt{font-size:.9rem;line-height:1.4;min-width:0;overflow-wrap:anywhere}
.mn{font-variant-numeric:tabular-nums;color:var(--soft);font-size:.85rem}
.mbar{grid-column:1/-1;height:5px;background:var(--mute);border-radius:3px;overflow:hidden}
.mbar i{display:block;height:100%;background:var(--mc);border-radius:3px}
.mapright{position:sticky;top:84px}
.mlist{background:var(--band);border-radius:12px;padding:16px;max-height:calc(100vh - 110px);overflow:auto}
.mlh{display:grid;gap:2px;margin:0 0 10px}
.mlh small{color:var(--soft)}
.mlh b{font-size:1.05rem}
.mlist .laws{border-radius:10px}
@media (max-width:900px){
  .mtabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mapgrid{grid-template-columns:1fr}
  .mapright{position:static}
  .mlist{max-height:none}
}
/* แถบสัดส่วนส่วนต่าง ๆ ของ พ.ร.บ. (กดแล้วเลื่อนไปส่วนนั้น) */
.msbar{display:flex;gap:3px;margin:6px 0 4px;min-height:58px}
.msbar a{min-width:44px;display:flex;flex-direction:column;justify-content:space-between;gap:2px;padding:6px 8px;border-radius:6px;text-decoration:none;color:#fff;background:var(--mc);overflow:hidden}
.msbar a:nth-child(2n){filter:brightness(.86)}
.msbar a span{font-size:.72rem;line-height:1.25;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.msbar a b{font-size:.9rem;font-variant-numeric:tabular-nums}
@media (prefers-color-scheme:dark){.msbar a{color:#0b1724}}
.msec{scroll-margin-top:90px}
@media (max-width:600px){.msbar{flex-direction:column;min-height:0}.msbar a{flex:none!important;flex-direction:row;align-items:center;padding:6px 10px}.msbar a span{-webkit-line-clamp:1}}
@media (max-width:900px){.mtiles + .mlist{margin:10px 0 4px;border:1px solid var(--line)}}

/* 🤖 ป้ายภาพ AI (ประกาศ สคบ. 18 ก.ค. 2568) — มุมขวาล่างของภาพ · อ่านได้ทั้งโหมดสว่าง/มืด (พื้นเข้มโปร่ง ตัวขาว) */
.aitag{position:absolute;right:8px;bottom:8px;z-index:1;background:rgba(6,37,65,.78);color:#fff;font-size:.7rem;font-weight:500;line-height:1.3;
  padding:3px 8px;border-radius:6px;pointer-events:none;white-space:nowrap;letter-spacing:.01em}
.aitag.sm{right:4px;bottom:4px;font-size:.58rem;padding:1px 5px;border-radius:4px}
.hart,.part,.svcart,.sarticle .aimg,.spot,.evimg,.hillw,.svc.big,.tool.big,.cat,.nfimg{position:relative}
.evimg,.hillw,.nfimg{display:block}
.hillw{margin-bottom:10px}.hillw .hill{margin-bottom:0}
.nfimg{flex:0 0 auto;width:120px;height:120px}.nfimg img{width:100%;height:100%;object-fit:cover;border-radius:12px}
/* การ์ดที่ภาพเป็นลูกตรง (.sart อยู่บนสุดของการ์ด) — ป้ายวางมุมขวาบนของภาพแทนมุมล่างการ์ด */
.svc.big > .aitag,.tool.big > .aitag{top:8px;bottom:auto}
.cat > .aitag{top:12px;right:12px;bottom:auto}
@media (max-width:760px){.evband .evimg{order:-1}}
/* 🪤 .svc.big > :not(.sart) / .tool.big > :not(.sart) ใส่ padding 0 20px ให้ลูกทุกตัว (0,3,0) → ป้ายต้องคืน padding เอง */
.svc.big > .aitag,.tool.big > .aitag{padding:3px 8px}

/* 🧭 เช็กประเภทสินค้า (12 ต.ค. 69) — ฟอร์มเล่าเรื่องสินค้า + ผลแยกหมวด · สีหมวดใช้ชุดเดียวกับแผนผังกฎหมาย */
.clsw{max-width:860px;width:100%;margin:0 auto;display:grid;gap:24px}   /* เต็ม 860 เสมอ (เดิมบางหน้าหดตามเนื้อหา) — การ์ดขั้นต่อไปใต้คอลัมน์กว้างเท่ากัน */
.clsf{display:grid;gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:20px}
.clsf label{font-weight:600;color:var(--title)}
.clsf textarea{width:100%;font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px;resize:vertical;min-height:110px}
.clsf textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
.clsf .btn{justify-self:start}
.crow{display:grid;gap:6px}
.crts,.cexs{display:flex;flex-wrap:wrap;gap:8px}
.crt,.cex{font:inherit;font-size:.9rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:5px 14px;cursor:pointer}
.crt[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.cex{color:var(--soft)} .cex:hover,.crt:hover{border-color:var(--accent)}
.clsr{display:grid;gap:14px;scroll-margin-top:96px}
/* มือถือ: ลูกของ grid มี min-width:auto → ข้อความยาว/ลิงก์ยาวดันกล่องผลกว้างเกินจอ ขอบขวาถูกตัด (เจอ 31 ต.ค. 69 ที่เครื่องมือนำเข้า 375 px) */
.clsw>*,.clsr>*{min-width:0}.clsr li,.isrc li{overflow-wrap:anywhere}  /* หัวเว็บติดบน — เลื่อนมาที่ผลแล้วการ์ดหลักไม่โดนบัง */
.clsr:empty{display:none}
.cmain{--mc:var(--navy);border:1px solid var(--line);border-left:6px solid var(--mc);border-radius:12px;padding:16px 18px;background:var(--paper);display:grid;gap:2px}
.cmain small{color:var(--soft)} .cmain b{font-size:1.35rem;font-weight:600;color:var(--title)}
.c-food,.c-supplement{--mc:var(--m-food)} .c-cosmetic{--mc:var(--m-cosmetic)} .c-herbal{--mc:var(--m-herbal)}
.c-drug{--mc:var(--no)} .c-device{--mc:var(--m-milk)} .c-hazard{--mc:var(--hold)} .c-consumer{--mc:var(--m-related)} .c-none{--mc:var(--faint)}
.crow2{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.crow2 > span{color:var(--soft);font-size:.9rem;min-width:84px}
.cuse small{color:var(--soft);font-size:.85rem}
.cchip{display:inline-block;font-size:.85rem;border-radius:6px;padding:2px 10px;background:var(--mute);color:var(--ink)}
.cchip.not{background:var(--no-bg);color:var(--no);text-decoration:line-through;text-decoration-thickness:1px}
.clsr h3{font-size:1.05rem}
.cwhy{margin:0;padding-left:1.3em;display:grid;gap:12px}
.cwhy li{padding-left:4px}
.cwhy .cm,.cwhy .cb{font-size:.9rem;color:var(--soft)}
.cwhy .cm span,.cwhy .cb span{font-weight:500;color:var(--ink);margin-right:6px}
.cwhy .cn{font-size:.88rem;background:var(--band);border-radius:8px;padding:6px 10px;margin-top:4px}
.clsr .cv{font-size:.82rem;color:var(--hold);margin:0}
.cask,.cnext{background:var(--band);border-radius:12px;padding:14px 18px}
.cask ul,.cnext ul{margin:6px 0 0;padding-left:1.2em}
.ccta{grid-template-columns:1fr auto;align-items:center}
.cerr{color:var(--no)}
.small{font-size:.85rem}
@media (max-width:640px){.ccta{grid-template-columns:1fr}.crow2 > span{min-width:0;width:100%}}

/* 🧮 เช็กน้ำหนักบรรจุ (12 ต.ค. 69) */
.nqrow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.nqf label{display:grid;gap:6px;font-weight:600;color:var(--title)}
.nqf input{font:inherit;font-weight:400;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px;width:100%}
.nqf input:focus{outline:2px solid var(--accent);outline-offset:1px}
.c-ok{--mc:var(--ok)}
.nqck{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.nqck li{display:grid;grid-template-columns:24px 1fr;gap:6px;align-items:start}
.nqck li span{font-weight:700}.nqck li.ok span{color:var(--ok)}.nqck li.no span{color:var(--no)}
.nqdl{margin:6px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.nqdl div{background:var(--band);border-radius:10px;padding:10px 14px}
.nqdl dt{font-size:.85rem;color:var(--soft)} .nqdl dd{margin:0;font-weight:600;font-size:1.1rem;color:var(--title)}
/* 🔢 เช็คเลข อย. */
#fnq{width:100%;font:inherit;font-size:1.05rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px}
#fnq:focus{outline:2px solid var(--accent);outline-offset:1px}
.fngrp{display:grid;gap:10px} .fngrp > h3{margin:0;display:flex;flex-wrap:wrap;gap:8px;align-items:baseline} .fngrp > h3 small{font-weight:400;color:var(--soft);font-size:.85rem}
.fnrow{border:1px solid var(--line);border-left:6px solid var(--mc,var(--navy));border-radius:12px;padding:14px 16px;background:var(--paper);display:grid;gap:6px}
.fnrow.ok{--mc:var(--ok)} .fnrow.no{--mc:var(--no)}
.fnrow b{font-size:1.08rem;color:var(--title);overflow-wrap:anywhere} .fnrow .en{color:var(--soft);font-size:.9rem;overflow-wrap:anywhere}
.fnrow dl{margin:0;display:grid;gap:4px} .fnrow dl div{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:.9rem} .fnrow dt{color:var(--soft);min-width:9em} .fnrow dd{margin:0;overflow-wrap:anywhere}
.fnst{display:inline-block;font-size:.85rem;font-weight:600;border-radius:6px;padding:2px 10px} .fnst.ok{background:var(--ok-bg);color:var(--ok)} .fnst.no{background:var(--no-bg);color:var(--no)}
.fnnum{font-variant-numeric:tabular-nums;font-weight:600;letter-spacing:.02em}
.fnnote{background:var(--band);border-radius:12px;padding:14px 18px;display:grid;gap:6px} .fnnote p{margin:0}
.fnread{max-width:860px;margin:8px auto 0;display:grid;gap:10px} .fnread h2{margin-top:18px} .fnread h3{margin:12px 0 0;font-size:1.05rem} .fnread p{margin:0}
.fndl{margin:4px 0 0;display:grid;gap:8px} .fndl div{display:grid;grid-template-columns:minmax(7em,auto) 1fr;gap:12px;background:var(--band);border-radius:10px;padding:10px 14px}
.fndl dt{font-weight:600;color:var(--title)} .fndl dd{margin:0}
.fnfaq{border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:var(--paper)} .fnfaq summary{cursor:pointer;font-weight:600;color:var(--title)} .fnfaq p{margin:8px 0 0}
@media (max-width:560px){.fndl div{grid-template-columns:1fr;gap:2px} .fnrow dt{min-width:0}}
@media (max-width:640px){.nqrow{grid-template-columns:1fr}}

/* 👤 สมาชิก (12 ต.ค. 69) — ลิงก์หัวเว็บ · ปุ่ม LINE/Google · หน้าบัญชี · กระดานอันดับเกม */
.acct{display:inline-flex;align-items:center;gap:6px;color:#fff;text-decoration:none;font-size:.9rem;font-weight:500;padding:4px 2px}
.acct .ico{width:18px;height:18px}
.acct:hover span,.acct[aria-current] span{text-decoration:underline;text-underline-offset:4px}
.mbtns{display:flex;flex-wrap:wrap;gap:10px}
.mbtn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:10px 18px;border-radius:10px;font:inherit;font-weight:500;text-decoration:none;flex:1 1 220px;min-width:0}
.mline{background:#06C755;color:#fff}
.mline:hover{background:#05b34c}
.mgoogle{background:#fff;color:#1f1f1f;box-shadow:inset 0 0 0 1px #c8ced6}
.mgoogle:hover{background:#f6f8fa}
.acctpg{min-width:0}   /* ตารางสิทธิ์ 3 คอลัมน์ดันช่องกริดเกินจอมือถือ (390px) */
.acctpg h2{font-size:1.1rem;margin:18px 0 4px;color:var(--title)}
.acctpg label.c{display:flex;gap:10px;align-items:flex-start;font-size:.92rem;color:var(--soft)}
.acctpg label.c input{margin-top:4px;accent-color:var(--orange)}
.acctdl{display:grid;gap:10px;margin:0;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:18px}
.acctdl div{display:grid;grid-template-columns:150px 1fr;gap:12px}
.acctdl dt{color:var(--faint)}.acctdl dd{margin:0;font-weight:500;overflow-wrap:anywhere}
.acctact{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.linkbtn{background:none;border:0;padding:6px 2px;font:inherit;color:var(--no);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.acctact a.linkbtn{color:var(--soft)}
.rights{width:100%;border-collapse:collapse;font-size:.94rem;table-layout:fixed}
.rights th:first-child{width:36%}
.rights td{overflow-wrap:anywhere}
.rights th,.rights td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.rights th{font-weight:500;color:var(--faint);font-size:.85rem}
.rights td:first-child{color:var(--ink)}
.rights .mine{background:var(--accent-soft)}
.gboard{margin-top:28px}
.boards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.boards h3{font-size:1rem;margin:0 0 8px;color:var(--title)}
.board{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--paper)}
.board li{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;padding:9px 14px;border-top:1px solid var(--line)}
.board li:first-child{border-top:0}
.board .rk{font-weight:600;color:var(--faint);text-align:center}
.board li:nth-child(-n+3) .rk{color:var(--accent)}
.board li.me{background:var(--accent-soft)}
.board li.none{display:block;color:var(--faint);font-size:.9rem}
.board small{color:var(--faint)}
.boardjoin{margin-top:14px;display:grid;gap:10px}
.boardjoin[hidden]{display:none}
@media (max-width:640px){.boards{grid-template-columns:1fr}.acctdl div{grid-template-columns:1fr;gap:2px}.rights{font-size:.88rem}}

/* 🏎 การ์ดเกมซิ่งสกัด (หน้าเกม) */
.racecard{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:28px}
.racecard .rc-cover img{width:100%;height:auto;display:block;border-radius:10px}
.racecard h2{margin:0 0 6px}
@media (max-width:720px){.racecard{grid-template-columns:1fr}}
/* 🎮 หน้าเกม (owner 13 ต.ค. 69 "วางตำแหน่งเกมไม่สมดุล"): หัวหน้า + การ์ดเกม 2 ใบกรอบเดียวกัน ระยะห่างเท่ากัน
   เกมยิง = จอเกมซ้าย · ชื่อ/วิธีเล่น/ปุ่ม/กระดานอันดับขวา · จอแคบ: ชื่อ → จอเกม → ที่เหลือ */
.gamepage{display:grid;gap:24px}
.gp-head{display:grid;gap:8px}
.gp-head p{margin:0;max-width:64ch}
.gamepage .racecard{margin:0;grid-template-columns:minmax(0,460px) minmax(0,1fr);column-gap:28px}   /* คอลัมน์ภาพเท่าการ์ดเกมยิง → ข้อความ 2 การ์ดเริ่มแนวเดียวกัน */
.boards h4{font-family:var(--font);font-weight:600;font-size:.95rem;margin:0 0 8px;color:var(--title)}
@media (max-width:860px){.gamepage .racecard{grid-template-columns:1fr}}
/* มือถือ: ไม่มีกรอบการ์ด · คั่นเกมด้วยเส้นบน */
@media (max-width:520px){.gamepage .racecard{border:0;border-radius:0;padding:0}}
/* 🎮 การ์ดเกมยิงคำต้องห้าม = รูปแบบเดียวกับการ์ดซิ่งสกัด/INCI (owner 25 ต.ค. 69) · กระดานรายเดือนแถวล่าง (.rboard เต็มแถว) */
.racecard .gboard{margin-top:0}
.racecard .gboard h3{font-size:1.05rem}
.racecard .boardjoin{margin-top:0}
@media (max-width:520px){.gamepage .racecard.shootcard{border-top:1px solid var(--line);padding-top:24px}}
/* 🏁 ตารางโหมดจับเวลาในการ์ดซิ่งสกัด: แถวเต็มกว้างใต้ภาพ+ข้อความ · ปุ่มสนาม 9 ปุ่ม (ตัวเลข = จำนวนคนในตาราง) */
.racecard .rboard{grid-column:1/-1;border-top:1px solid var(--line);padding-top:16px;display:grid;gap:12px}
.rb-head{display:grid;gap:4px}
.rb-head h3{font-size:1.05rem}
.rb-head p{margin:0}
.rb-tracks{display:flex;flex-wrap:wrap;gap:8px}
.rb-chip{font:inherit;font-size:.88rem;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:999px;padding:5px 12px;cursor:pointer}
.rb-chip:hover{border-color:var(--accent)}
.rb-chip[aria-pressed="true"]{border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange);background:var(--accent-soft);color:var(--title)}
.rb-chip[data-n]::after{content:attr(data-n);margin-left:6px;font-size:.78rem;color:var(--faint)}
/* 🔎 การ์ดเกมตรวจฉลาก INCI = รูปแบบเดียวกับการ์ดซิ่งสกัด (.racecard) · กระดานรายเดือน 2 โหมดแถวล่าง */
.inccard .boards{margin-top:2px}
@media (max-width:520px){.gamepage .racecard.inccard{border-top:1px solid var(--line);padding-top:24px}}

/* 🏅 คะแนน · 🐞 เรื่องที่แจ้ง · หน้าทีม (13 ต.ค. 69) */
.ptsbox{display:flex;align-items:baseline;gap:8px}
.ptsnum{font-size:2.2rem;font-weight:600;color:var(--accent);line-height:1}
.ptsdet summary{cursor:pointer;color:var(--soft);font-size:.92rem}
.ptshow,.ptslist,.replist{list-style:none;margin:8px 0 0;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--paper);overflow:hidden}
.ptshow li,.ptslist li{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:9px 14px;border-top:1px solid var(--line)}
.ptshow li{grid-template-columns:1fr auto}
.ptshow li:first-child,.ptslist li:first-child,.replist li:first-child{border-top:0}
.ptslist small{color:var(--faint)}.ptslist b,.ptshow b{color:var(--ok)}
.ptslist .none,.replist .none{display:block;color:var(--faint);font-size:.9rem}
.replist li{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:start;padding:10px 14px;border-top:1px solid var(--line)}
.replist .rk{color:var(--faint);font-size:.85rem}.replist .rd{min-width:0;overflow-wrap:anywhere}.replist .rd small{display:block;color:var(--soft);margin-top:2px}
.rs{font-size:.78rem;border-radius:999px;padding:2px 10px;white-space:nowrap;background:var(--mute);color:var(--soft)}
.rs.s-verified,.rs.s-fixed,.rs.s-planned{background:var(--ok-bg);color:var(--ok)}
.rs.s-new{background:var(--hold-bg);color:var(--hold)}
.rs.s-duplicate,.rs.s-invalid{background:var(--mute);color:var(--faint)}
/* 📊 โควตาวันนี้ (หน้าบัญชี · หน้าค้นสาร · สาระสำคัญ) — 15 ต.ค. 69 */
.quota{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:12px}
.quota li{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr) auto;align-items:center;gap:12px}
.quota .ql{font-weight:500;min-width:0}
.qbar{display:block;height:8px;border-radius:99px;background:var(--band);border:1px solid var(--line);overflow:hidden}
.qbar i{display:block;height:100%;background:#2b7a78;border-radius:99px}
.quota .qn{font-size:.9rem;color:var(--soft);white-space:nowrap}
.quota li.low .qbar i{background:var(--orange)}
.quota li.low .qn em{font-style:normal;color:var(--accent);font-weight:500}
@media (max-width:560px){.quota li{grid-template-columns:minmax(0,1fr) auto}.quota .qbar{grid-column:1/-1;grid-row:2}}
.fdt-quota{margin:6px 0 0;font-size:.85rem;color:#46576a}
.fdt-quota.low{color:#B35400;font-weight:500}
.kleft{list-style:none;margin-top:4px;font-size:.85rem;color:var(--faint)}
.kai{list-style:none;margin-top:6px;font-size:.82rem;color:var(--faint)}
.kleft.low{color:var(--accent);font-weight:500}
@media (prefers-color-scheme:dark){.fdt-quota{color:#aebdcb}.fdt-quota.low{color:#FFA54A}}
/* 🎓 ระดับสิทธิ์จากค่าอบรม (15 ต.ค. 69) */
.tierbadge{margin:0 0 12px;padding:10px 14px;border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:10px;background:var(--paper)}
table.tiers td:first-child{white-space:nowrap}
table.tiers td small{display:block;color:var(--soft);font-size:.82rem;font-weight:400;margin-top:2px}
table.tiers td.num{white-space:nowrap}
/* 📜 ประวัติคำถาม RA Advisor (16 ต.ค. 69) */
.hsearch{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}.hsearch input{flex:1 1 220px;font:inherit;border:1px solid var(--line);border-radius:10px;padding:8px 12px;min-height:44px;background:var(--bg);color:var(--ink)}
.histlist{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.hist{border-top:1px solid var(--line)}.hist:first-child{border-top:0}
.hist summary{cursor:pointer;padding:12px 14px;display:grid;gap:2px;list-style:none}.hist summary::-webkit-details-marker{display:none}
.hist .hq{font-weight:500;overflow-wrap:anywhere}.hist summary small{color:var(--faint)}
.hist[open] summary,.hist details[open] summary{background:var(--band)}
.hist .ha{padding:10px 14px;white-space:normal;overflow-wrap:anywhere;color:var(--ink)}
.hist .small,.hist .linkbtn{margin:0 14px 12px}
/* 🔔 สารที่ติดตาม + แจ้งเตือน (16 ต.ค. 69) */
.fwh{font-size:1rem;margin:16px 0 4px;color:var(--title)}
.fwchips{list-style:none;margin:6px 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.fwchips li{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:8px;padding:2px 4px 2px 10px;background:var(--paper);font-size:.9rem}
.fwchips button{font:inherit;border:0;background:transparent;color:var(--faint);cursor:pointer;min-width:32px;min-height:32px;font-size:1.1rem}
.notes{list-style:none;margin:6px 0;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.notes li{display:grid;gap:2px;padding:10px 14px;border-top:1px solid var(--line)}.notes li:first-child{border-top:0}
.notes li.new{border-left:3px solid var(--orange)}.notes .nk{font-size:.8rem;color:var(--accent);font-weight:500}
.notes .nt{overflow-wrap:anywhere}.notes small{color:var(--faint)}
.nbadge{display:inline-block;min-width:22px;padding:0 6px;border-radius:11px;background:var(--orange);color:#062541;font-size:.78rem;font-weight:600;text-align:center;vertical-align:middle}
.acct .nbadge{margin-left:4px}

/* F12 (19 ต.ค. 69): หัวกลุ่มผลค้น "ตรงทุกคำ / ใกล้เคียง" + กล่องชวนถาม Advisor เมื่อพิมพ์เป็นคำถาม */
.laws .lgh{list-style:none;padding:10px 18px 6px;font-size:.85rem;font-weight:700;color:var(--soft);background:var(--band);border-bottom:1px solid var(--line);grid-column:1/-1}
.laws .lq-ask{list-style:none;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:0 0 10px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
.laws .lq-ask p{margin:0;flex:1 1 16rem}
/* F11 (19 ต.ค. 69): มือถือ — การ์ด "อยากทำอะไร" เดิมเริ่มที่ ~1,460 px (ต้องเลื่อนผ่านภาพ hero + กล่องความน่าเชื่อถือ)
   จอแคบซ่อนภาพ hero (ภาพประกอบ AI ไม่มีข้อมูล) + บีบกล่องความน่าเชื่อถือ — ข้อความครบเหมือนเดิม ไม่ตัดเนื้อหา */
@media (max-width:600px){
  .hero{gap:20px;padding:24px 0 28px}
  .hero .hart{display:none}
  .trust{padding:16px 18px;gap:10px}
  .trust ul{gap:6px}
  .trust li{font-size:.9rem;line-height:1.45}
  .trust .stats{padding-top:10px}
}
/* 🏭 ชวนประเมินก่อนเสนอราคา ในหน้าบริการโรงงาน/มาตรฐาน */
.precta{margin:20px 0;padding:18px 20px;border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:12px;background:var(--band);display:grid;gap:8px;justify-items:start}
.precta b{font-size:1.08rem;color:var(--title)}
.precta p{margin:0;color:var(--soft)}
.precta small{font-size:.85rem}

/* 🌏 คู่มือเฉพาะประเทศ (23 ต.ค. 69) — การ์ดชวนอ่านบนหน้าแรก/บริการ ของภาษา ko ja zh · กล่องติดต่อในหน้าคู่มือ */
.gsec{padding-top:0}
.gcall{display:flex;align-items:center;gap:16px;background:var(--band);border:1px solid var(--line);border-left:5px solid var(--orange);border-radius:14px;padding:18px 20px;margin:18px 0;color:inherit;text-decoration:none}
.gcall:hover{border-color:var(--orange)}
.gcall .ic{flex:0 0 auto;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:var(--paper);color:var(--accent)}
.gcall .ic svg{width:24px;height:24px}
.gcall > span:nth-child(2){display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.gcall small{color:var(--accent);font-weight:500;letter-spacing:.04em}
.gcall b{color:var(--title);font-size:1.08rem;line-height:1.5}
.gcall > span:nth-child(2) > span{color:var(--soft);line-height:1.6}
.gcall > svg{flex:0 0 auto;width:20px;height:20px;color:var(--accent)}
.guide h1{font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.35;color:var(--title);margin:6px 0 4px}
.gcta{background:var(--band);border-radius:14px;padding:18px 20px;margin:22px 0;max-width:72ch}
.gcta b{display:block;color:var(--title);font-size:1.08rem;margin-bottom:6px}
.gcta p{margin:0 0 12px;line-height:1.7}
.gbtns{display:flex;flex-wrap:wrap;gap:10px}
.guide .sarticle{margin-top:8px}
/* 🚢 เช็กความพร้อมนำเข้า (24 ต.ค. 69) — ชิปแตะเลือกทำจาก radio/checkbox จริง (ไม่มี JS ก็ส่งฟอร์มได้) */
.impf{gap:20px}
.impf fieldset{border:0;margin:0;padding:0;min-width:0}
.impf legend{font-weight:600;color:var(--title);padding:0;margin-bottom:8px}
.impf .iq.miss{outline:2px dashed var(--no);outline-offset:8px;border-radius:8px}
.impf .iq.miss legend{color:var(--no)}
.ichip{position:relative;cursor:pointer}
.ichip input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.ichip span{display:inline-block;font-size:.92rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:6px 14px}
.ichip:hover span{border-color:var(--accent)}
.ichip input:checked+span{background:var(--navy);border-color:var(--navy);color:#fff}
.ichip input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.ibtns{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.c-meddev{--mc:var(--m-milk)}
.isum{margin:8px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.cchip.warn{background:var(--no-bg);color:var(--no)} .cchip.ok{background:var(--ok-bg,#e3f3ea);color:var(--ok,#1f7a4d)} .cchip.need{background:var(--no-bg);color:var(--no)}
a.cchip{text-decoration:none}
.isec{border:1px solid var(--line);border-radius:12px;padding:14px 18px;background:var(--paper);scroll-margin-top:96px}
.isec h2,.isec h3{margin:0 0 8px}
.isec ul{margin:0;padding-left:1.2em;display:grid;gap:9px}
.isec p:last-child{margin-bottom:0}
.igap{border-left:6px solid var(--no)} .iok{border-left:6px solid var(--ok,#1f7a4d)}
.irefs a{font-size:.78rem;text-decoration:none;margin-left:2px;vertical-align:1px}
.ichk{display:inline-block;font-size:.78rem;color:var(--hold);border:1px solid currentColor;border-radius:6px;padding:0 6px;margin-left:4px}
.isrc ol{margin:0;padding-left:1.6em;display:grid;gap:4px;font-size:.88rem}
.isrc li:target{background:var(--band);border-radius:6px}
@media print{header,footer,.impf,.cask,.phead,.ibtns,.noprint{display:none!important}.isec{break-inside:avoid}}
.impf .iq{scroll-margin-top:96px}
@media (max-width:700px){.clsr,.isec,.impf .iq{scroll-margin-top:150px}}
/* 🧪 เช็กสูตรสินค้านำเข้า (24 ต.ค. 69) — ตารางสถานะทุกตัว · จอแคบเป็นการ์ด */
.ffile{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ffile label.btn{cursor:pointer;font-weight:500;color:var(--title)}
.fchip{display:inline-block;font-size:.82rem;border-radius:6px;padding:2px 9px;background:var(--mute);color:var(--ink);white-space:normal}
.fchip.lv-stop{background:var(--no-bg);color:var(--no)} .fchip.lv-check,.fchip.lv-warn{background:var(--hold-bg);color:var(--hold)}
.fchip.lv-limit{background:var(--band);color:var(--title)} .fchip.lv-ok{background:var(--ok-bg);color:var(--ok)} .fchip.lv-name{background:var(--mute);color:var(--soft)}
.ftw{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.ftab{width:100%;border-collapse:collapse;font-size:.9rem}
.ftab th{text-align:left;font-weight:600;color:var(--title);background:var(--band);padding:8px 12px}
.ftab td{padding:9px 12px;border-top:1px solid var(--line);vertical-align:top}
.ftab td small{display:block;color:var(--soft);margin-top:4px}
.ftab td:nth-child(3){color:var(--soft);font-size:.85rem;max-width:380px}
.ftab td:nth-child(4){font-size:.8rem;max-width:220px}
.ftab tr.lv-stop td:first-child{box-shadow:inset 4px 0 0 var(--no)}
@media (max-width:700px){
  .ftw{border:0;background:none;overflow:visible}
  .ftab thead{display:none} .ftab,.ftab tbody,.ftab tr,.ftab td{display:block;width:auto;max-width:none}
  .ftab tr{border:1px solid var(--line);border-radius:10px;background:var(--paper);margin-bottom:10px;padding:6px 0}
  .ftab td{border:0;padding:4px 14px} .ftab td:empty{display:none}
  .ftab td:nth-child(n+3)::before{content:attr(data-h);display:block;font-size:.75rem;color:var(--faint)}
}
/* 🏷 ฉลากต่างประเทศ → ฉลากไทย (24 ต.ค. 69) — ร่างสติกเกอร์แก้ไขได้ · ช่องที่ต้องกรอกเองเป็นเส้นประ */
.tl-sticker{border:2px solid var(--title);border-radius:12px;padding:14px 18px;background:var(--paper);display:grid;gap:8px}
.tl-sticker h3{margin:0}
.tl-fills{color:var(--hold);margin:0}
.tl-line{display:grid;grid-template-columns:190px 1fr;gap:10px;align-items:start}
.tl-line label{font-weight:600;color:var(--title);padding-top:7px;font-size:.92rem}
.tl-line textarea{width:100%;font:inherit;font-size:.95rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 10px;resize:vertical}
.tl-line.fill textarea{border-style:dashed;border-color:var(--hold);background:var(--hold-bg)}
@media (max-width:700px){.tl-line{grid-template-columns:1fr;gap:2px}.tl-line label{padding-top:0}}
@media print{body.tl-printing .page main > *:not(.clsw),body.tl-printing .clsw > *:not(#tr),body.tl-printing #tr > *:not(.tl-sticker){display:none!important}
  body.tl-printing .tl-sticker{border:1px solid #000}body.tl-printing .tl-line textarea{border:0;background:none;resize:none}}
/* 📑 เช็กเอกสารนำเข้า (24 ต.ค. 69) */
#df input[type=text]{width:100%;font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.dlist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.dlist:empty{display:none}
.dlist li{display:flex;gap:10px;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:.9rem;background:var(--bg)}
.dlist li span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dlist .lnk{background:none;border:0;color:var(--soft);cursor:pointer;font:inherit}
.dcard h3 small{font-weight:400}
.dmeta{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0 0 10px;font-size:.88rem}
.dmeta dt{color:var(--soft)} .dmeta dd{margin:0;min-width:0;overflow-wrap:anywhere}
a.fchip{text-decoration:none}
/* 🛒 หน้าซื้อบริการ (shop-ui.js · เปิดเมื่อ SALES_OPEN=1) */
.shop .price{font-size:1.05rem;margin:6px 0 14px}
.form .paych{border:1.5px solid var(--line);border-radius:10px;padding:10px 12px 12px;display:flex;flex-wrap:wrap;gap:8px;margin:0;min-width:0}
.form .paych legend{font-weight:500;font-size:.95rem;padding:0 6px}
.form .paych label.ichip{display:inline-block}

/* 🛒 ราคา/โปร + 📥 ส่งเอกสารหลังซื้อ (shop-ui.js · order-ui.js) */
.shop .was{color:var(--faint);font-weight:400}
.shop .offb{display:inline-block;font-size:.8rem;font-weight:600;color:#fff;background:var(--accent);border-radius:999px;padding:1px 8px;vertical-align:1px}
.shop .pay{font-size:1.1rem;color:var(--title)}
.paych.cats{display:grid;gap:8px}
.catc span{display:flex;flex-wrap:wrap;gap:6px;align-items:baseline;border-radius:12px;padding:10px 14px}
.catc input:checked+span .was,.catc input:checked+span .muted,.catc input:checked+span .pay{color:#fff}
.intake{margin:22px 0;display:grid;gap:10px}
.intake h2{margin:0}.intake h3{margin:8px 0 0;font-size:1rem}
.intake .box.warn{border-color:var(--accent)}
.intake .box span{display:block}
.ilist,.ifiles{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.irow{display:flex;justify-content:space-between;gap:12px;align-items:center;background:var(--paper);border:1px dashed var(--line);border-radius:12px;padding:10px 14px}
.irow small{display:block;color:var(--faint);font-size:.86rem}
.irow.has{border-style:solid}
.irow .ir{display:flex;gap:10px;align-items:center;white-space:nowrap}
.irow .ok{color:var(--ok,#1a7f4b);font-weight:600}
.irow.over,.idrop.over{border-color:var(--accent);background:var(--bg)}
.idrop{display:grid;gap:4px;place-items:center;text-align:center;cursor:pointer;border:2px dashed var(--line);border-radius:14px;padding:26px 16px;background:var(--paper)}
.idrop small{color:var(--faint)}
.intake .lnk{cursor:pointer;color:var(--accent);background:none;border:0;padding:0;font:inherit;text-decoration:underline}
.ifiles li{overflow-wrap:anywhere}
.imiss{border-left:3px solid var(--accent);padding:6px 12px}
.imiss ul{margin:4px 0 0;padding-left:18px}
.ist{min-height:1.2em;margin:0;color:var(--faint)}
@media (max-width:640px){.irow{flex-direction:column;align-items:flex-start}}

/* 📝 บทความความรู้ /th|en/articles (owner 26 ต.ค. 69 · posts.js) — ใช้ .sarticle .atable .afaq .arefs .svcpage .side เดิม */
.phead2{padding:34px 0 6px;max-width:72ch}
.phead2 h1{margin:0 0 8px;font-size:clamp(1.6rem,3.2vw,2.2rem);color:var(--title);line-height:1.3}
.phead2 p{margin:0;color:var(--soft);line-height:1.75}
.pfilters{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0}
.pfilter{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);text-decoration:none;font-size:.92rem}
.pfilter small{color:var(--faint);font-size:.78rem}
.pfilter:hover{border-color:var(--accent)}
.pfilter.on{background:var(--title);border-color:var(--title);color:var(--bg)}
.pfilter.on small{color:inherit;opacity:.75}
.pcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pcard{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:18px;text-decoration:none;color:var(--ink);display:grid;gap:6px;align-content:start;min-width:0}
.pcard:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.pcard b{font-weight:500;font-size:1.02rem;color:var(--title);line-height:1.5}
.pcard small{color:var(--soft);font-size:.88rem;line-height:1.6}
.pcard .pmeta{color:var(--faint);font-size:.8rem;margin-top:4px}
.pchip{justify-self:start;font-size:.74rem;font-weight:500;border-radius:6px;padding:2px 8px;background:var(--navy-tint);color:var(--title)}
.pchip.p-consumer{background:var(--accent-soft);color:var(--accent)}
/* 🖼 ไอคอนภาพหมวดสินค้า/กลุ่มผู้อ่านในชิป (icons.js pic · 27 ต.ค. 69) — สูงตามตัวอักษร ขอบลบ ไม่ดันความสูงชิปเดิม */
.pic{width:1.4em;height:1.4em;object-fit:contain;vertical-align:middle;flex:none;margin:-.3em .4em -.25em 0}
.pchip{display:inline-flex;align-items:center;gap:5px}
.pchip .pic,.pfilter .pic{margin:-.3em 0}
.pchip .pico{width:1.25em;height:1.25em;flex:none}
.pfilter .pico{width:1.15em;height:1.15em;flex:none}
.pcons{background:var(--band);border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:14px;padding:22px}
.pcons header{margin-bottom:14px}.pcons h2,.pbiz h2,.ptool h2{margin:0 0 6px;font-size:1.25rem;color:var(--title)}
.pcons p{margin:0}
.pbiz h2{margin-bottom:14px}
.phome .pcards{margin-top:4px}
.ptool{margin:40px 0 0;padding-top:24px;border-top:1px solid var(--line)}
.ptool h2{margin-bottom:14px}
.crumb.pcrumb{margin:28px 0 -56px}   /* main เป็น grid gap 72px — ดึงเนื้อหาขึ้นมาชิดเส้นทาง */
.postpage{margin-top:0}
.sarticle.post{margin-top:0;padding-top:0;border-top:0;max-width:none}
.post h1{margin:8px 0 6px;font-size:clamp(1.5rem,3vw,2rem);line-height:1.35;color:var(--title)}
.post .pmeta{color:var(--faint);font-size:.88rem;margin:0 0 18px}
.post .prev{color:#2f8a5f;font-weight:500;white-space:nowrap}
@media (prefers-color-scheme:dark){.post .prev{color:#86d3a1}}
.post .prev .ico{width:16px;height:16px;vertical-align:-3px}
.post ul,.post ol:not(.arefs){margin:0 0 16px;padding-left:1.3em;line-height:1.8}
.post li{margin:4px 0}
.post .toc{background:var(--band);border-radius:12px;padding:14px 18px;margin:0 0 8px}
.post .toc b{display:block;color:var(--title);margin-bottom:4px}
.post .toc ol{margin:0;padding-left:1.3em;line-height:1.9;font-size:.94rem}
.post .toc a,.post a{color:var(--accent)}
.post h2{scroll-margin-top:90px}
.post .ptools{display:grid;gap:4px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--orange);border-radius:12px;padding:16px;margin:10px 0 22px}
.post .ptools b{color:var(--title)}
.post .ptools .tools,.side .tools.one{margin-top:8px}
.post .ptools .tool b,.side .tool b{font-size:.96rem}
.side .tools.one{grid-template-columns:1fr;gap:8px}
.side .tools.one .tool{padding:12px 14px}
.post .pcards{grid-template-columns:repeat(2,minmax(0,1fr))}
/* 🖼 ภาพบทความ (27 ต.ค. 69): hero 2.5:1 ใต้ H1 · ภาพประกอบ 16:9 · ภาพย่อการ์ด 16:9 — กล่องจองสัดส่วนไว้ก่อน ไม่ให้หน้ากระโดด */
.phero,.pfig{position:relative;margin:16px 0 22px;border-radius:14px;overflow:hidden;background:var(--band)}
.phero{aspect-ratio:2.5/1}.pfig{aspect-ratio:16/9;border-radius:12px}
.phero img,.pfig img{display:block;width:100%;height:100%;object-fit:cover}
.pcard.img{padding-top:0;overflow:hidden}
.pthumb{position:relative;display:block;margin:0 -18px 8px;aspect-ratio:16/9;overflow:hidden;background:var(--band)}
.pthumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.pcard.img:hover .pthumb img{transform:scale(1.03)}
@media (max-width:860px){.pcards{grid-template-columns:repeat(2,minmax(0,1fr))}.postpage{grid-template-columns:minmax(0,1fr)}.postpage .side{position:static}}
@media (max-width:560px){.pcards,.post .pcards,.post .ptools .tools{grid-template-columns:1fr}.pcons{padding:16px}}

/* 📊 แผนภาพในบทความ (diagrams.js · 27 ต.ค. 69) — ตัวหนังสือจริงของหน้าเว็บ ไม่ใช่ภาพ · มือถือเรียงแนวตั้ง ไม่ย่อจนอ่านไม่ออก
   แผนภาพที่จำลองของพิมพ์ (ฉลาก GDA · กล่องคำเตือน · แผนผังฉลาก) ใช้พื้นขาวตัวกรมท่าเสมอแม้โหมดมืด เพราะคือหน้าตาบนบรรจุภัณฑ์จริง */
.dg{margin:22px 0 26px;padding:18px 18px 14px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
.dg figcaption{margin:0 0 12px}
.dg figcaption b{display:block;color:var(--title);font-size:1.02rem;line-height:1.45}
.dg figcaption small{display:block;color:var(--soft);font-size:.88rem;margin-top:2px}
.dg .dgsrc{margin:12px 0 0;color:var(--faint);font-size:.8rem;line-height:1.5}
.dg .dgnote{margin:10px 0 0;color:var(--soft);font-size:.88rem;line-height:1.6}
.dg ol,.dg ul,.post .dg ol,.post .dg ul{list-style:none;margin:0;padding:0}
.dg li,.post .dg li{margin:0}
/* ขั้นตอน */
.dgsteps{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;counter-reset:s}
.dgsteps li{position:relative;display:flex;flex-direction:column;gap:6px;background:var(--band);border-radius:10px;padding:12px 12px 12px}
.dgsteps li>i{font-style:normal;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;font-weight:600;font-size:.9rem;flex:none}
@media (prefers-color-scheme:dark){.dgsteps li>i{background:var(--orange);color:#1b1206}}
.dgsteps b{display:block;font-weight:600;font-size:.93rem;line-height:1.5;color:var(--ink)}
.dgsteps span,.dgcheck span,.dgtime span{display:block;color:var(--soft);font-size:.86rem;line-height:1.55;margin-top:2px}
@media (max-width:620px){.dgsteps{grid-template-columns:1fr}.dgsteps li{flex-direction:row;align-items:flex-start;gap:12px}}
/* เช็กลิสต์ */
.dgcheck{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 18px}
.dgcheck li{display:flex;gap:10px;align-items:flex-start;padding:6px 0;border-bottom:1px dashed var(--line)}
.dgcheck li>i{font-style:normal;flex:none;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;background:var(--ok-bg);color:var(--ok);font-weight:700;font-size:.85rem;margin-top:3px}
.dgcheck b{font-weight:500;font-size:.94rem;line-height:1.6;color:var(--ink)}
/* ผังแยกเลข */
.dgsample{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:3px;margin:4px 0 14px;font:600 clamp(.9rem,3.9vw,1.7rem)/1.2 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;white-space:nowrap}
.dgsample span{padding:6px 8px;border-radius:8px}
@media (max-width:620px){.dgsample{letter-spacing:0;gap:2px}.dgsample span{padding:5px 4px}}
.dgsample em{font-style:normal;color:var(--faint)}
.dg .g0{background:#e3ecf6;color:#0d2a4a}.dg .g1{background:#ffe9d2;color:#6b3300}.dg .g2{background:#e0f2e8;color:#14513a}.dg .g3{background:#efe6f7;color:#46256b}.dg .g4{background:#fbe8e6;color:#7a1f18}
.dgnum{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.dgnum li{display:flex;flex-direction:column;gap:6px;border-radius:10px;padding:10px 12px}
.dgnum code{font:600 1.05rem/1.2 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.08em}
.dgnum b{display:block;font-weight:500;font-size:.9rem;line-height:1.5}
.dgnum span{display:block;font-size:.8rem;opacity:.85}
@media (max-width:620px){.dgnum{grid-template-columns:1fr}.dgnum li{flex-direction:row;align-items:center;gap:12px}.dgnum code{min-width:3.6em}}
/* เส้นเวลา */
.dgtime,.post .dg .dgtime{position:relative;display:grid;gap:12px;padding-left:18px}
.dgtime::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--line)}
.dgtime li{position:relative}
.dgtime li::before{content:"";position:absolute;left:-18px;top:7px;width:12px;height:12px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 3px var(--paper)}
.dgtime time{display:block;color:var(--accent);font-weight:600;font-size:.88rem}
.dgtime b{display:block;font-weight:600;font-size:.94rem;line-height:1.5;color:var(--ink)}
/* ตารางเทียบ */
.dgtable{display:grid;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:.9rem}
.dgtr{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);border-top:1px solid var(--line)}
.dgtr:first-child{border-top:0}
.dgtr span{padding:9px 12px;line-height:1.55;border-left:1px solid var(--line)}
.dgtr span:first-child{border-left:0;font-weight:500;color:var(--title)}
.dgth span{background:var(--navy-tint);font-weight:600;color:var(--title)}
@media (max-width:620px){.dgth{display:none}.dgtr{grid-auto-flow:row;padding:6px 0}.dgtr span{border-left:0;padding:3px 12px}
  .dgtr span:not(:first-child)::before{content:attr(data-h);display:block;color:var(--faint);font-size:.78rem}}
/* โครงฉลาก GDA — หน้าตาบนบรรจุภัณฑ์ */
.dggda{background:#fff;color:#0d2236;border:1.5px solid #0d2236;border-radius:10px;padding:12px;max-width:560px;margin:0 auto}
.dggda p{margin:0;font-size:.86rem;line-height:1.5}
.dgg-top{font-weight:600;margin-bottom:8px!important}
.dgbars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 8px}
.dgbar{display:flex;flex-direction:column;align-items:center;gap:2px;border:1.5px solid #0d2236;border-radius:40px;padding:12px 4px 14px;background:#fff;text-align:center}
.dgbar b{font-weight:600;font-size:.86rem;line-height:1.3}
.dgbar .v{font-size:1.1rem;font-weight:600}
.dgbar small{font-size:.74rem;color:#46576a}
.dgbar .pc{margin-top:4px;font-size:.82rem;border-top:1.5px solid #0d2236;padding-top:4px;width:80%}
.dgg-ln{color:#46576a}
.dgtag{display:inline-block;margin-top:8px!important;padding:2px 10px;border-radius:20px;background:#fff3e6;color:#8a3f00;font-size:.76rem!important}
@media (max-width:480px){.dgbars{gap:5px}.dgbar{padding:12px 2px 12px}.dgbar b{font-size:.76rem}.dgbar small{font-size:.64rem}.dgbar .pc{font-size:.74rem;width:86%}}
/* กล่องคำเตือนบังคับ — หน้าตาบนฉลาก */
.dgwarn{background:#fff;color:#0d2236;border:2px solid #0d2236;border-radius:6px;padding:10px 14px;max-width:560px;margin:0 auto}
.dgwarn p{margin:0 0 6px;font-size:.92rem;line-height:1.55}
.dgwarn p:last-child{margin-bottom:0}
.dgwarn .dgw-h{font-weight:700;font-size:1rem;border:1.5px solid #0d2236;display:inline-block;padding:0 8px;margin-bottom:8px}
.dgwarn .bold span{font-weight:700;border:1.5px solid #0d2236;padding:0 6px;display:inline-block}
.dgwarn small{display:block;color:#46576a;font-size:.8rem}
/* แผนผังฉลาก: กล่องสินค้า + หมายเลข */
.dglabel{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:18px;align-items:start}
.dgpack{display:flex;flex-direction:column;gap:7px;background:#fff;border:1.5px solid #0d2236;border-radius:14px 14px 8px 8px;padding:16px 14px 18px;position:relative}
.dgpack::before{content:"";position:absolute;left:30%;right:30%;top:-12px;height:12px;border:1.5px solid #0d2236;border-bottom:0;border-radius:6px 6px 0 0;background:#fff}
.dgpack .ln{display:flex;align-items:center;gap:8px;height:16px}
.dgpack .ln::after{content:"";flex:1;height:7px;border-radius:4px;background:#d5dde6}
.dgpack .l1::after{flex:.7}.dgpack .l2::after{flex:.85}.dgpack .l3::after{flex:.55}
.dgpack .ln i{font-style:normal;display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#FF8300;color:#1b1206;font-size:.68rem;font-weight:700;flex:none}
.dglegend{counter-reset:n;display:grid;gap:4px}
.dglegend li{counter-increment:n;display:grid;grid-template-columns:20px minmax(0,1fr);gap:8px;font-size:.92rem;line-height:1.55}
.dglegend li::before{content:counter(n);flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--orange);color:#1b1206;font-size:.72rem;font-weight:700;margin-top:3px}
@media (max-width:620px){.dglabel{grid-template-columns:minmax(0,1fr)}.dgpack{max-width:240px;margin:12px auto 0}}
/* ฉลากตัวอย่างมีหมุดเลข (mock) · การ์ดไอคอน (icons) — หน้าบริการเตรียมเอกสาร 30 ต.ค. 69 · ฉลากเป็นพื้นขาวเสมอเหมือนบรรจุภัณฑ์จริง */
.dgmock{display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);gap:22px;align-items:start}
.dgm-pack{background:#fff;color:#0d2236;border:1.5px solid #0d2236;border-radius:12px;padding:16px 16px 12px 40px;display:flex;flex-direction:column;gap:8px}
.dgm-pack p{margin:0;position:relative;font-size:.84rem;line-height:1.55}
.dgm-pack p.dgm-big{font-size:1.05rem;font-weight:600;line-height:1.4}
.dgm-pack p.dgm-box{border:1.5px solid #0d2236;border-radius:6px;padding:4px 8px}
.dgm-pack p>i{position:absolute;left:-30px;top:1px;font-style:normal;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#FF8300;color:#1b1206;font-size:.72rem;font-weight:700}
.dgm-pack p.dgm-box>i{top:5px;left:-31px}
.dgm-pack .dgtag{align-self:flex-start;margin-top:4px!important}
.dgmock .dglegend b{display:block;font-weight:500;color:var(--ink)}
.dgmock .dglegend span{display:block;color:var(--soft);font-size:.84rem;line-height:1.5}
.dgicons{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.dgicons li{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--band);position:relative;min-width:0}
.dgicons .ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--paper);border:1px solid var(--line);font-size:1.5rem;line-height:1;font-weight:700;color:var(--ink)}
.dgicons .ic.txt{font-size:.82rem;letter-spacing:-.01em}
.dgicons small{position:absolute;top:8px;right:10px;color:var(--faint);font-size:.72rem}
.dgicons b{display:block;font-weight:500;font-size:.92rem;line-height:1.45;color:var(--ink)}
.dgicons span:not(.ic){display:block;color:var(--soft);font-size:.8rem;line-height:1.5;margin-top:2px}
.dgex{margin:14px auto 0;max-width:520px;background:#fff;color:#0d2236;border:1.5px solid #0d2236;border-radius:8px;padding:10px 14px}
.dgex b{display:block;font-size:.9rem;margin-bottom:2px}
.dgex p{margin:0;font-size:.88rem;line-height:1.6}
.dglanes,.dgdo{--dg-ok:#17795a;--dg-no:#b3361f;--dg-on:#fff}
@media (prefers-color-scheme:dark){.dglanes,.dgdo{--dg-ok:#4fc59a;--dg-no:#ff7a63;--dg-on:#062541}}
.dglanes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dglanes li{min-width:0;display:flex;flex-direction:column;gap:6px;padding:16px 14px 14px;border:1px solid var(--line);border-top:4px solid var(--dg-ok);border-radius:12px;background:var(--band)}
.dglanes li.must{border-top-color:var(--orange)}
.dglanes .ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--paper);border:1px solid var(--line);font-size:1.5rem;line-height:1}
.dglanes b{font-weight:500;font-size:.98rem;line-height:1.45;color:var(--ink)}
.dglanes strong{display:inline-block;align-self:flex-start;padding:3px 12px;border-radius:20px;font-weight:600;font-size:.88rem;line-height:1.5;background:var(--paper);border:1.5px solid var(--dg-ok);color:var(--dg-ok)}
.dglanes li.must strong{background:#FF8300;border-color:#FF8300;color:#1b1206}
.dglanes span:not(.ic){color:var(--soft);font-size:.84rem;line-height:1.55}
.dgdo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.dgdo > div{min-width:0;border:1px solid var(--line);border-top:4px solid var(--dg-no);border-radius:12px;background:var(--band);padding:14px 16px}
.dgdo > .dgd-yes{border-top-color:var(--dg-ok)}
.dgd-h{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-weight:600;color:var(--ink)}
.dgd-h i{font-style:normal;display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--dg-no);color:var(--dg-on);font-size:.8rem}
.dgd-yes .dgd-h i{background:var(--dg-ok)}
.dgdo ul{margin:0;padding-left:1.2em;display:grid;gap:4px}
.dgdo li{font-size:.92rem;line-height:1.55;color:var(--ink)}
@media (max-width:620px){.dglanes,.dgdo{grid-template-columns:minmax(0,1fr)}.dglanes li{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:12px;row-gap:4px}.dglanes .ic{grid-row:span 3}.dglanes strong{justify-self:start}}
@media (max-width:620px){.dgmock{grid-template-columns:minmax(0,1fr)}.dgicons{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.dgicons .ic{width:38px;height:38px;font-size:1.3rem}}

/* ===== 🧭 UX ชุดแรก (27 ต.ค. 69) ===== */
/* ป้ายผลตรวจ 4 แบบ — รูปทรง + สี + ข้อความ (ไม่พึ่งสีอย่างเดียว) · ไอคอน Lucide (ISC · assets/LICENSE-lucide.txt) */
.fchip.lv-ok::before,.lc-box.ok>b::before,.fnst.ok::before,#nr .cmain.c-ok>b::before,.isec.iok>p::before,.fchip.lv-warn::before,.fchip.lv-limit::before,.fchip.lv-miss::before,.lc-box.warn>b::before,.isum .cchip.warn::before,#nr .cmain.c-hazard>b::before,.clsr .cchip.maybe::before,.fchip.lv-stop::before,.lc-box.bad>b::before,.lc-fx li.stop .lv::before,.lc-fx li.must .lv::before,.fnst.no::before,#nr .cmain.c-drug>b::before,.fchip.lv-check::before,.fchip.lv-name::before,.lc-fx li.check .lv::before,.lc-fx li.warn .lv::before{content:"";display:inline-block;width:1.05em;height:1.05em;margin-right:5px;vertical-align:-.17em;background:currentColor;-webkit-mask:var(--sti) center/contain no-repeat;mask:var(--sti) center/contain no-repeat;flex:none}
.fchip.lv-ok,.lc-box.ok>b,.fnst.ok,#nr .cmain.c-ok>b,.isec.iok>p{--sti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m16 9-5.5 5.5L8 12'/%3E%3C/svg%3E")}
.fchip.lv-warn,.fchip.lv-limit,.fchip.lv-miss,.lc-box.warn>b,.isum .cchip.warn,#nr .cmain.c-hazard>b,.clsr .cchip.maybe,.lc-fx li.warn .lv{--sti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4M12 17h.01'/%3E%3C/svg%3E")}
.fchip.lv-stop,.lc-box.bad>b,.lc-fx li.stop .lv,.lc-fx li.must .lv,.fnst.no,#nr .cmain.c-drug>b{--sti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6M9 9l6 6'/%3E%3C/svg%3E")}
.fchip.lv-check,.fchip.lv-name,.lc-fx li.check .lv{--sti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E")}
.fchip.lv-check,.fchip.lv-name,.lc-fx li.check .lv{background:var(--mute);color:var(--soft)}
.fchip.lv-miss{background:var(--hold-bg);color:var(--hold)}
.clsr .cchip.maybe{background:var(--hold-bg);color:var(--hold)}
.stleg{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;margin:0}
/* ป้ายที่มาของผล */
.tfoot{display:grid;gap:14px;margin-top:8px;width:100%;max-width:860px;margin-inline:auto}   /* กว้างเท่าคอลัมน์ผล (.clsw/.lcw 860px) — การ์ดขั้นต่อไปขอบตรงกับการ์ดสรุปและตาราง */
.srcn{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.srcn li{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;color:var(--soft);font-size:.9rem}
.fchip.lv-limit{background:var(--hold-bg);color:var(--hold)}
.hmt{color:var(--soft)}

/* ===== 🎨 UX แบบ ChatGPT (27 ต.ค. 69 · outputs/fdt-ux-design · CLAUDE-HANDOFF-TH.md) — A1 เส้นทาง · B ความน่าเชื่อถือ · C ผลตรวจ ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ja,.tr2,.rsum,.rbar,.rtab,.nxs,.stb,.srcb{--x-ink:#0D2236;--x-soft:#46576A;--x-band:#F3F6F9;--x-line:#E0E6ED;--x-surface:#fff;--x-link:#B35400;--x-shadow:0 16px 48px rgba(6,37,65,.07)}
@media (prefers-color-scheme:dark){.ja,.tr2,.rsum,.rbar,.rtab,.nxs{--x-ink:#EDF3F8;--x-soft:#BAC9D7;--x-band:#0A263F;--x-line:#31516A;--x-surface:#0C2E4A;--x-link:#FFB668;--x-shadow:0 16px 48px rgba(0,0,0,.12)}}
.ja-eb{font-size:13px;font-weight:500;letter-spacing:.3px;color:var(--x-link);display:flex;align-items:center;gap:10px;margin-bottom:16px}
.ja-eb i{display:block;width:28px;height:2px;background:var(--orange)}
.ja-h{font-size:46px;font-weight:600;line-height:1.35;letter-spacing:-1.5px;color:var(--x-ink);margin:0}
/* A1 แผนที่เส้นทาง */
.ja{color:var(--x-ink);scroll-margin-top:96px}
.ja-p{color:var(--x-soft);font-size:17px;margin:16px 0 0;max-width:710px}
.ja-hint{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--x-soft);margin:24px 0 0}
.ja-hint>span[aria-hidden]{display:inline-block;width:28px;flex:none;border-top:2px dashed var(--accent)}
.ja-chap{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:42px}
.ja-chap>span{font-size:14px;font-weight:500;display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--x-line);padding-top:10px}
.ja-chap b{font-weight:500}.ja-chap small{font-size:12px;font-weight:400;color:var(--x-soft);text-align:right}
.ja-route{list-style:none;margin:4px 0 28px;padding:0;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));position:relative}
.ja-route::before{content:"";position:absolute;left:6%;right:6%;top:102px;border-top:2px solid var(--x-line)}
.ja-route::after{content:"";position:absolute;left:6%;width:var(--jp,0%);top:102px;border-top:2px solid var(--orange)}
.ja-route li{position:relative;z-index:1}
.ja-ms{border:0;background:transparent;color:var(--x-ink);width:100%;padding:12px 4px 20px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;border-radius:20px;font:inherit;cursor:pointer}
.ja-ms:hover{background:var(--x-band)}
.ja-ms:focus-visible,.ja a:focus-visible,.ja summary:focus-visible{outline:3px solid var(--orange);outline-offset:5px;border-radius:5px}
.ja-num{color:var(--x-soft);font-size:12px;font-weight:500}
.ja-orb{width:104px;height:104px;border-radius:50%;background:var(--x-surface);display:grid;place-items:center;position:relative}
.ja-orb::after{content:"";position:absolute;left:calc(50% - 4px);bottom:-5px;width:8px;height:8px;border-radius:50%;background:var(--x-line);border:2px solid var(--x-surface)}
.ja-ic{width:80px;height:80px;object-fit:contain;display:block}
.ja-ms strong{font-size:14px;font-weight:500;margin-top:4px;white-space:nowrap}
.ja-cap{font-size:12px;color:var(--x-soft)}
.ja-route .on .ja-orb{background:#FFF2E5;outline:2px solid var(--orange);outline-offset:5px}
.ja-route .on .ja-orb::after{background:var(--orange)}
.ja-route .on strong,.ja-route .on .ja-num{color:var(--x-link)}
.ja-det{border:1px solid var(--x-line);border-radius:24px;overflow:hidden;box-shadow:var(--x-shadow);background:var(--x-surface)}
.ja-pane{display:grid;grid-template-columns:200px minmax(0,1fr) 320px;min-height:282px}
.ja-pane[hidden]{display:none}
.ja-art{background:var(--x-band);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px}
.ja-big{width:110px;height:110px;object-fit:contain}
.ja-of{font-size:12px;color:var(--x-soft)}
.ja-here{display:inline-flex;align-items:center;gap:6px;color:#8B4000;background:#FFEBD8;border:1px solid #EAC39E;font-size:12px;padding:3px 10px;border-radius:20px;font-weight:500;visibility:hidden}
.ja-here::before{content:"";width:5px;height:5px;border-radius:50%;background:#B35400}
.ja[data-picked] .ja-here{visibility:visible}
.ja-copy{padding:30px 32px}
.ja-mi{font-size:12px;letter-spacing:.3px;color:var(--x-soft);font-weight:500}
.ja-copy h3{font-size:30px;font-weight:500;line-height:1.5;margin:7px 0;color:var(--x-ink)}
.ja-copy p{color:var(--x-soft);font-size:15px;max-width:390px;margin:0}
.ja-act{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;margin-top:24px}
.ja-btn{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:46px;border-radius:12px;padding:10px 20px;font-size:14px;font-weight:500;line-height:1.6;background:var(--orange);color:#062541;text-decoration:none}
.ja-btn:hover{background:#FFA13C;text-decoration:none;box-shadow:0 4px 12px rgba(255,131,0,.18)}
.ja-btn .ico{width:18px;height:18px}
.ja-free{font-size:12px;color:var(--x-soft)}
.ja-more{border-left:1px solid var(--x-line);padding:32px}
.ja-sec{display:flex;flex-direction:column;gap:2px;margin-top:10px}
.ja-sec a{font-size:13px;font-weight:500;color:var(--x-link);display:block;padding:10px 0;line-height:1.6;text-decoration:none}
.ja-sec a:hover,.ja-bot>a:hover,.nxa>a:hover{text-decoration:underline;text-underline-offset:4px}
.ja-bot>a,.nxa>a{text-decoration:none}
.ja-sec a span{font-weight:400;margin-left:4px}
.ja-note{font-size:12px;color:var(--x-soft);line-height:1.8;margin:20px 0 0}
.ja-mob{display:none}
.ja-mbr{display:none}
.ja-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-top:30px;font-size:13px;color:var(--x-soft)}
.ja-bot>span{display:flex;align-items:center;gap:10px}.ja-bot .ico{width:18px;height:18px}
.ja-bot>a{color:var(--x-link);font-weight:500;display:flex;gap:12px;align-items:center;min-height:44px}
@media (prefers-color-scheme:dark){.ja-orb{background:#F3F6F9}.ja-orb::after{border-color:#0C2E4A}.ja-big{background:#F3F6F9;border-radius:22px}.ja-route .on .ja-orb{background:#FFEBD8}}
@media (max-width:1250px) and (min-width:701px){.ja-pane{grid-template-columns:160px minmax(0,1fr) 270px}.ja-copy{padding:24px}.ja-more{padding:26px}.ja-ms strong{font-size:12px;white-space:normal}.ja-orb{width:88px;height:88px}.ja-ic{width:68px;height:68px}.ja-route::before,.ja-route::after{top:94px}.ja-chap small{display:none}}
@media (max-width:700px){
  .ja-h{font-size:32px;letter-spacing:-.8px;line-height:1.4}.ja-mbr{display:inline}
  .ja-eb{font-size:12px;gap:8px;margin-bottom:12px}.ja-eb i{width:20px}
  .ja-p{font-size:14px;line-height:1.9;margin-top:14px}
  .ja-hint{font-size:12px;line-height:1.8;margin-top:18px;gap:8px}.ja-hint>span[aria-hidden]{width:20px}
  .ja-desk{display:none}
  .ja-mob{display:block;padding:0;margin:30px 0 0;list-style:none;position:relative}
  .ja-mob::before{content:"";position:absolute;top:24px;bottom:80px;left:17px;width:1px;background:var(--x-line)}
  .ja-mstep{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;position:relative;padding-bottom:22px}
  .ja-mnum{background:var(--x-surface);border:1px solid var(--x-line);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:12px;color:var(--x-soft);margin-top:16px;z-index:1}
  .ja-mbody{border-bottom:1px solid var(--x-line);padding:12px 0 22px}
  .ja-mhead{display:flex;align-items:center;gap:12px}
  .ja-mic{width:54px;height:54px;object-fit:contain;flex-shrink:0}
  .ja-mhead h3{font-size:20px;font-weight:500;line-height:1.6;margin:0;color:var(--x-ink)}
  .ja-mbody>p{font-size:13px;color:var(--x-soft);line-height:1.95;margin:9px 0 0}
  .ja-mbody>.ja-btn{margin-top:15px;font-size:13px;width:100%;justify-content:space-between;padding:11px 15px}
  .ja-mstep details{font-size:12px;color:var(--x-soft);margin-top:8px}
  .ja-mstep summary{min-height:44px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;list-style:none}
  .ja-mstep summary::-webkit-details-marker{display:none}
  .ja-mstep summary::after{content:"＋"}.ja-mstep details[open]>summary::after{content:"−"}
  .ja-mstep .ja-sec a{font-size:12px}
  .ja-bot{flex-direction:column;align-items:start;gap:12px;margin-top:12px;font-size:12px;padding:18px;border:1px solid var(--x-line);border-radius:14px}
  .ja-bot>a{font-size:12px;gap:8px}
}
@media (max-width:700px) and (prefers-color-scheme:dark){.ja-mic{background:#F3F6F9;border-radius:13px}}
@media (prefers-reduced-motion:no-preference){.ja-ms,.ja-btn{transition:background .16s ease,box-shadow .16s ease}.ja-ms:hover .ja-ic{transform:translateY(-3px);transition:transform .16s ease}}
/* B ส่วนความน่าเชื่อถือ */
.tr2{color:var(--x-ink)}
.tr-head{display:flex;justify-content:space-between;align-items:flex-end;gap:36px}
.tr-head>p{font-size:15px;line-height:1.9;color:var(--x-soft);margin:0 0 8px;max-width:320px}
.tr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:50px;border:1px solid var(--x-line);border-radius:24px;overflow:hidden;background:var(--x-surface)}
.tr-card{position:relative;padding:26px 26px 32px}
.tr-card+.tr-card{border-left:1px solid var(--x-line)}
.tr-no{font-size:12px;color:var(--x-soft);font-weight:500}
.tr-card h3{font-size:19px;font-weight:500;line-height:1.65;max-width:290px;margin:0;color:var(--x-ink)}
.tr-card>p{font-size:13px;line-height:1.9;color:var(--x-soft);margin:10px 0 0}
.tr-dia{height:210px;position:relative;margin:12px -2px 26px;border-radius:16px;background:var(--x-band);display:flex;align-items:center;justify-content:center;gap:14px;padding:12px 12px 40px}
.tr-cap{position:absolute;bottom:14px;left:18px;right:18px;display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--x-soft)}
.tr-cap b{font-weight:500}.tr-cap span{text-align:right}
.tr-doc{width:66px;height:86px;background:var(--x-surface);border:1px solid var(--x-line);border-radius:9px;padding:12px;color:var(--x-ink);box-shadow:var(--x-shadow)}
.tr-doc .ico{width:25px;height:25px}
.tr-doc i{display:block;width:100%;height:3px;background:var(--x-line);margin-top:7px}
.tr-arr{color:var(--x-link)}.tr-arr .ico{width:20px;height:20px}
.tr-row{width:144px;padding:15px 12px;background:var(--x-surface);border:1px solid var(--x-line);border-radius:10px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;box-shadow:var(--x-shadow)}
.tr-row .dot{width:7px;height:7px;border-radius:50%;background:#1D6B4F}
.tr-row b{height:4px;width:37px;background:var(--x-line)}
.tr-row em{display:block;flex-basis:100%;margin-top:9px;color:var(--x-link);font-size:12px;font-style:normal}
.tr-rules{flex-direction:column;gap:12px}
.tr-rt{display:flex;align-items:center;gap:8px;color:var(--x-soft);font-size:12px}.tr-rt .sti{width:18px;height:18px}
.tr-res{background:var(--x-surface);border:1px solid var(--x-line);padding:16px;border-radius:12px;display:flex;gap:6px;flex-wrap:wrap;justify-content:center;max-width:290px;box-shadow:var(--x-shadow)}
.tr-res .ln{flex-basis:100%;height:4px;width:80%;background:var(--x-line);margin-bottom:8px}
.tr-cal{background:var(--x-surface);border:1px solid var(--x-line);border-radius:12px;padding:15px;width:100px;height:112px;color:var(--x-ink);box-shadow:var(--x-shadow)}
.tr-cal>.ico{width:28px;height:28px}
.tr-dots{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:12px}
.tr-dots i{width:5px;height:5px;border-radius:2px;background:var(--x-line)}.tr-dots i:nth-child(10){background:var(--orange)}
.tr-radar{position:relative;width:110px;height:110px;border:1px solid var(--x-line);border-radius:50%;display:grid;place-items:center}
.tr-radar::before,.tr-radar::after{content:"";border:1px solid var(--x-line);border-radius:50%;width:70px;height:70px;position:absolute}
.tr-radar::after{width:32px;height:32px}
.tr-radar>i{width:9px;height:9px;border-radius:50%;background:var(--orange);position:absolute;top:26px;right:21px;z-index:1}
.tr-radar>span{width:54px;height:1px;background:#B35400;position:absolute;left:50%;top:50%;transform:rotate(-40deg);transform-origin:left}
.tr-radar>b{position:absolute;right:-14px;top:0;background:#FFEBD8;color:#8B4000;border:1px solid #EAC39E;border-radius:20px;font-size:12px;padding:2px 11px;font-weight:500;z-index:2}
.tr-note{display:flex;gap:10px;align-items:center;color:var(--x-soft);font-size:12px;margin:28px 0 0;background:var(--x-band);padding:16px 20px;border-radius:12px}
.tr-note .ico{width:18px;height:18px;flex:none}
@media (max-width:980px) and (min-width:701px){.tr-dia{transform:none}.tr-cap{font-size:12px;flex-direction:column;gap:0}.tr-cap span{text-align:left}}
@media (max-width:700px){
  .tr-head{display:block}.tr-head>p{font-size:13px;margin-top:16px;max-width:none}
  .tr-grid{display:block;margin-top:26px;border:0;border-radius:0;overflow:visible;background:none}
  .tr-card{border:1px solid var(--x-line);border-radius:20px;padding:22px;margin-bottom:18px;background:var(--x-surface)}
  .tr-card+.tr-card{border-left:1px solid var(--x-line)}
  .tr-dia{height:200px;margin:12px 0 20px;padding:10px 10px 44px;gap:12px}
  .tr-doc{width:58px;padding:10px}.tr-row{width:132px}
  .tr-cap{left:14px;right:14px}
  .tr-card h3{max-width:none}.tr-card>p{font-size:12px}
  .tr-note{font-size:12px;padding:16px;align-items:start;line-height:1.9}.tr-note .ico{margin-top:3px}
}
/* C องค์ประกอบผลตรวจ — ป้ายสถานะ 4 แบบ (รูปทรง+ข้อความ+สี) · ป้ายที่มา · การ์ดสรุป · ตารางผล · ขั้นต่อไป */
.stb{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:20px;font-size:12px;font-weight:500;line-height:1.6;white-space:nowrap}
.stb .sti{width:15px;height:15px;flex:none}
.st-ok{color:#1D6B4F;background:#EAF3EE;border:1px solid #BDD9CA}
.st-warn{color:#8B4000;background:#FFF0DF;border:1px solid #E4BF97;border-radius:7px}
.st-no{color:#A3271F;background:#FCEEEB;border:1px solid #E8BCB7;border-radius:6px}
.st-unk{color:#46576A;background:#EAF0F5;border:1px dashed #8295A5;border-radius:4px}
.tr-res .stb{font-size:11px;padding:4px 7px;gap:4px}.tr-res .stb .sti{width:13px;height:13px}
.fchip.lv-ok{color:#1D6B4F;background:#EAF3EE;border:1px solid #BDD9CA;border-radius:20px}
.fchip.lv-warn,.fchip.lv-limit,.fchip.lv-miss{color:#8B4000;background:#FFF0DF;border:1px solid #E4BF97;border-radius:7px}
.fchip.lv-stop{color:#A3271F;background:#FCEEEB;border:1px solid #E8BCB7;border-radius:6px}
.fchip.lv-check,.fchip.lv-name{color:#46576A;background:#EAF0F5;border:1px dashed #8295A5;border-radius:4px}
.fchip.lv-stop,.lc-box.bad>b,.lc-fx li.stop .lv,.lc-fx li.must .lv,.fnst.no,#nr .cmain.c-drug>b{--sti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.6 16.7A2 2 0 0 1 2 15.3V8.7a2 2 0 0 1 .6-1.4l4.7-4.7A2 2 0 0 1 8.7 2h6.6a2 2 0 0 1 1.4.6l4.7 4.7a2 2 0 0 1 .6 1.4v6.6a2 2 0 0 1-.6 1.4l-4.7 4.7a2 2 0 0 1-1.4.6H8.7a2 2 0 0 1-1.4-.6z'/%3E%3Cpath d='m15 9-6 6M9 9l6 6'/%3E%3C/svg%3E")}
.fchip.lv-check,.fchip.lv-name,.lc-fx li.check .lv{--sti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 2 10 10-10 10L2 12Z'/%3E%3Cpath d='M9.5 9a2.5 2.5 0 1 1 3.5 2.3c-1 .4-1 1-1 2M12 16.5v.1'/%3E%3C/svg%3E")}
.srcb{display:inline-flex;align-items:center;gap:6px;color:var(--x-ink);background:var(--x-band);border:1px solid var(--x-line);border-radius:6px;padding:4px 8px;font-size:12px;white-space:nowrap;font-weight:500}
.srcb .sti{width:14px;height:14px}
.src-ai{color:#8B4000;background:#FFF0DF;border-color:#E4BF97}
@media (prefers-color-scheme:dark){.srcb{--x-ink:#EDF3F8;--x-band:#0A263F;--x-line:#31516A}.src-ai{color:#8B4000;background:#FFF0DF;border-color:#E4BF97}}
.rsum{margin:8px 0 0;border:1px solid #E3BB94;border-left:4px solid var(--orange);border-radius:20px;padding:24px;background:var(--x-band);display:grid;grid-template-columns:50px minmax(0,1fr) auto;gap:18px;align-items:center;color:var(--x-ink)}
.rsum.rs-ok{border-color:#BDD9CA;border-left-color:#1D6B4F}
.rs-ic{width:48px;height:48px;border-radius:12px;color:#8B4000;background:#FFEBD8;display:grid;place-items:center}
.rs-ic svg{width:25px;height:25px}
.rs-no .rs-ic{color:#A3271F;background:#FCEEEB}.rs-ok .rs-ic{color:#1D6B4F;background:#EAF3EE}.rs-unk .rs-ic{color:#46576A;background:#EAF0F5}
.rs-mi{font-size:12px;color:var(--x-soft);font-weight:500}
.rs-h{font-size:22px;font-weight:500;line-height:1.5;margin:4px 0;color:var(--x-ink)}
.rs-tx p{font-size:12px;color:var(--x-soft);margin:0}
.rs-cnt{display:flex;gap:16px;padding-left:25px;border-left:1px solid var(--x-line)}
.rs-c{font-size:12px;display:flex;flex-direction:column;text-align:center;color:var(--x-soft);min-width:44px}
.rs-c b{color:var(--x-ink);font-size:24px;font-weight:500;line-height:1.3}
.rbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;margin:32px 0 14px;gap:12px 20px;color:var(--x-ink)}
.rbar h2{font-size:18px;font-weight:500;margin:0}.rbar h2 small{font-size:12px;font-weight:400;margin-left:10px;color:var(--x-soft)}
.rsrc{display:flex;gap:8px;flex-wrap:wrap}
.rtab{border:1px solid var(--x-line);border-radius:16px;overflow:hidden;color:var(--x-ink)}
.rhead,.ring{display:grid;grid-template-columns:31% 47% 22%;align-items:start}
.rhead{background:var(--x-band);font-size:12px;color:var(--x-soft);padding:13px 22px}
.ring{padding:22px;border-top:1px solid var(--x-line);position:relative;background:var(--x-surface)}
.ring::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--x-line)}
.ring.g-no::before{background:#A3271F}.ring.g-warn::before{background:#B35400}.ring.g-ok::before{background:#1D6B4F}
.ri-name{display:flex;align-items:start;gap:12px;padding-right:12px}
.ri-no{font-size:12px;color:var(--x-soft);margin-top:3px}
.ring h3{font-size:14px;font-weight:500;line-height:1.6;margin:0;color:var(--x-ink)}
.ri-name .stb{margin-top:8px}
.ri-why{padding-right:24px}
.ri-why p{font-size:12px;color:var(--x-soft);margin:4px 0 0}
.ri-why small{display:block;color:var(--x-soft);font-size:12px;margin-top:4px}
.ri-src{display:flex;align-items:start;gap:6px;flex-direction:column;min-width:0}
.ri-src a{font-size:12px;color:var(--x-link);display:flex;align-items:center;gap:6px}
.ri-src a .sti{width:13px;height:13px}
.ri-src small{font-size:12px;color:var(--x-soft);overflow-wrap:anywhere}
@media (max-width:700px){
  .rsum{padding:19px 17px;grid-template-columns:35px minmax(0,1fr);gap:12px;border-radius:17px}
  .rs-ic{width:34px;height:34px;border-radius:10px}.rs-ic svg{width:20px;height:20px}
  .rs-h{font-size:19px;line-height:1.6}
  .rs-cnt{grid-column:1/-1;border-left:0;border-top:1px solid var(--x-line);padding:14px 0 0;margin-top:3px;justify-content:space-around;gap:10px}
  .rbar{flex-direction:column;align-items:start}
  .rtab{border:0;border-radius:0;overflow:visible}.rhead{display:none}
  .ring{display:block;border:1px solid var(--x-line);border-radius:15px;margin-bottom:14px;padding:20px;overflow:hidden}
  .ri-name{padding:0;gap:9px}.ring h3{font-size:15px}
  .ri-why{padding:15px 0 0 25px}.ri-why h3{font-size:13px;line-height:1.8}
  .ri-src{padding:16px 0 0 25px;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}.ri-src small{flex-basis:100%}
}
/* ขั้นต่อไป (การ์ดพื้นกรมท่า + ไอคอนขั้น) */
.nxs{display:grid;grid-template-columns:130px minmax(0,1fr);gap:22px;background:#062541;color:#fff;border-radius:22px;padding:30px;align-items:center}
.nxi{width:110px;height:110px;object-fit:contain;background:#F3F6F9;border-radius:24px}
.nxk{display:block;font-size:12px;font-weight:500;letter-spacing:.3px;color:#DEE7F0}
.nxh{display:block;font-size:24px;font-weight:500;line-height:1.5;margin-top:4px;color:#fff}
.nxp{font-size:13px;color:#DEE7F0;margin:7px 0 0}
.nxa{display:flex;gap:6px 22px;align-items:center;margin:20px 0 0;flex-wrap:wrap}
.nxa>a:not(.nxb){font-size:13px;color:#FFB668;display:inline-block;padding:10px 0}
.nxb{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:46px;border-radius:12px;padding:10px 20px;font-size:14px;font-weight:500;background:var(--orange);color:#062541;text-decoration:none}
.nxb:hover{background:#FFA13C;text-decoration:none}.nxb .ico{width:18px;height:18px}
@media (prefers-color-scheme:dark){.nxs{background:#123853}}
@media (max-width:700px){.nxs{display:block;border-radius:18px;padding:24px 22px}.nxi{width:70px;height:70px;border-radius:16px;margin-bottom:18px}.nxh{font-size:23px;line-height:1.6}.nxp{font-size:12px;line-height:1.9}.nxa{flex-direction:column;align-items:stretch;gap:8px}.nxb{justify-content:space-between}}

/* ===== 📲 ลงหน้าจอโฮม (install.js · 30 ต.ค. 69) — ภาพจำลองหน้าจอเป็นสีกลางคงที่ อ่านได้ทั้งโหมดสว่าง/มืด ===== */
.ins{max-width:980px;margin:0 auto}
.ins [hidden]{display:none!important}
.ins-head{display:flex;gap:18px;align-items:center;margin:8px 0 22px}
.ins-head img{border-radius:18px;flex:none;box-shadow:0 4px 14px rgba(6,37,65,.25)}
.ins-head h1{margin:0 0 6px;font-size:1.7rem;line-height:1.35}
.ins-head p{margin:0;color:var(--soft);line-height:1.75}
.ins-done{padding:12px 16px;border-radius:12px;background:var(--ok-bg);color:var(--ok);font-weight:500}
.ins-now,.ins-inapp{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;padding:16px;border:1px solid var(--orange);border-radius:14px;background:var(--band);margin:0 0 20px}
.ins-now small{color:var(--soft)}
.ins-inapp p{margin:0;flex:1 1 100%;font-weight:500}
.ins-inapp ol{flex:1 1 100%;margin:0;padding-left:20px;color:var(--soft);line-height:1.8}
.ins-desk{padding:12px 16px;border:1px dashed var(--line);border-radius:12px;color:var(--soft)}
.ins-tabs{display:grid;grid-template-columns:auto auto 1fr;gap:0 8px;align-items:center}
.ins-tabs>input{position:absolute;opacity:0;pointer-events:none}
.ins-tabs>label{padding:10px 18px;min-height:44px;display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;cursor:pointer;font-weight:500;color:var(--ink);background:var(--paper)}
.ins-tabs>input:checked+label{background:var(--orange);border-color:var(--orange);color:#1b1206}
.ins-tabs>input:focus-visible+label{outline:3px solid var(--ink);outline-offset:3px}
.ins-pane{grid-column:1/-1;display:none;margin-top:18px}
#insIos:checked~.ins-ios,#insAnd:checked~.ins-and{display:block}
.ins-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ins-steps>li{display:flex;flex-direction:column;gap:12px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--band)}
.ins-tx{display:flex;gap:10px;align-items:flex-start;min-height:72px}
.ins-tx p{margin:0;line-height:1.6;color:var(--ink)}
.ins-tx small{display:block;color:var(--soft);font-size:.82rem;line-height:1.5;margin-top:3px}
.ins-n{flex:none;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--orange);color:#1b1206;font-weight:700}
.ins-k{display:inline-grid;place-items:center;width:24px;height:24px;vertical-align:-6px;border-radius:6px;background:var(--paper);border:1px solid var(--line);color:#1a73e8;margin:0 2px}
.ins-k svg{width:16px;height:16px}
.ins-note{margin:14px 0 0;color:var(--soft);font-size:.9rem}
/* โทรศัพท์จำลอง */
.ins-phone{margin-top:auto;align-self:center;width:100%;max-width:190px;aspect-ratio:9/16;border:6px solid #1c2733;border-radius:26px;background:#1c2733;overflow:hidden}
.ins-scr{position:relative;height:100%;border-radius:19px;background:#f4f6f8;color:#16212c;overflow:hidden;font-size:11px;line-height:1.35;display:flex;flex-direction:column}
.ins-pg{flex:1;padding:14px 12px;display:flex;flex-direction:column;gap:7px}
.ins-pg b{height:46px;border-radius:8px;background:#062541}
.ins-pg i{height:7px;border-radius:4px;background:#d3dbe3}.ins-pg i.s{width:60%}
.ins-bar{display:flex;align-items:center;justify-content:space-around;gap:4px;padding:8px 6px;background:#fff;border-top:1px solid #dfe5ea;color:#1a73e8}
.ins-bar.and{justify-content:space-between;border-top:0;border-bottom:1px solid #dfe5ea;color:#3c4043}
.ins-bar .url{flex:1;padding:5px 9px;border-radius:999px;background:#eef1f4;color:#3c4043;font-size:10px}
.ins-bar .ins-k,.ins-sheet .ins-k,.ins-menu .ins-k{border:0;background:none;width:20px;height:20px;margin:0}
.ins-sheet{margin-top:auto;background:#fff;border-radius:14px 14px 0 0;padding:8px 8px 10px;box-shadow:0 -6px 18px rgba(0,0,0,.12)}
.ins-sheet p{display:flex;align-items:center;gap:6px;margin:0;padding:6px 6px;border-bottom:1px solid #eef1f4}
.ins-sheet .ins-sh{gap:8px;font-size:10px}.ins-sheet .ins-sh img,.ins-dlg img{width:26px;height:26px;border-radius:6px}
.ins-dlg{margin:12px 8px;background:#fff;border-radius:12px;padding:8px 10px;box-shadow:0 4px 16px rgba(0,0,0,.14)}
.ins-dlg.and{position:absolute;left:8px;right:8px;bottom:12px;margin:0}
.ins-dlg p{margin:0}
.ins-dh{display:flex;justify-content:space-between;align-items:center;gap:4px;font-size:9.5px;padding-bottom:8px;border-bottom:1px solid #eef1f4;color:#1a73e8}
.ins-dh b{color:#16212c;font-weight:600;text-align:center;font-size:8px;flex:1;min-width:0}
.ins-row{display:flex;align-items:center;gap:8px;padding-top:8px}
.ins-row small{display:block;color:#5f6b76}
.ins-btns{display:flex;justify-content:flex-end;gap:12px;padding-top:10px;color:#1a73e8;font-weight:600}
.ins-menu{position:absolute;right:6px;top:34px;width:88%;background:#fff;border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.18);padding:4px 0}
.ins-menu p{margin:0;padding:7px 10px;display:flex;align-items:center;gap:6px}
.ins-phone.home .ins-scr{background:linear-gradient(160deg,#3a6ea5,#1b3a5c)}
.ins-home{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 8px;padding:18px 10px}
.ins-home>span:not(.ins-hot){aspect-ratio:1;border-radius:9px;background:rgba(255,255,255,.28)}
.ins-home .ins-hot{display:block;border-radius:10px;align-self:start}
.ins-me{display:flex;flex-direction:column;align-items:center;gap:3px;color:#fff;font-size:8.5px;white-space:nowrap}
.ins-me img{width:100%;height:auto;border-radius:9px}
.ins-hot{position:relative;display:inline-flex;align-items:center;border-radius:8px;box-shadow:0 0 0 3px #FF8300;animation:insPulse 1.6s ease-in-out infinite}
.ins-sheet .ins-hot,.ins-menu .ins-hot{display:block;border-radius:6px}
.ins-sheet .ins-hot p,.ins-menu .ins-hot p{background:#fff3e6;font-weight:600}
.ins-dh .ins-hot,.ins-btns .ins-hot{padding:1px 6px}
@keyframes insPulse{50%{box-shadow:0 0 0 5px rgba(255,131,0,.45)}}
@media (prefers-reduced-motion:reduce){.ins-hot{animation:none}}
@media (max-width:900px){.ins-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.ins-head{align-items:flex-start}.ins-head img{width:56px;height:56px}.ins-head h1{font-size:1.35rem}
  .ins-steps{grid-template-columns:minmax(0,1fr)}.ins-tx{min-height:0}.ins-phone{max-width:210px}}
/* การ์ดชวนในหน้าแรก (มือถือ) */
.ins-card{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--band)}
.ins-card[hidden]{display:none}
.ins-card img{border-radius:10px;flex:none}
.ins-card p{flex:1;margin:0;font-size:.9rem;line-height:1.5;color:var(--ink)}
.ins-card .btn{flex:none;padding:8px 14px;min-height:40px}
.ins-x{flex:none;width:36px;height:36px;border:0;background:none;color:var(--soft);font-size:1.4rem;cursor:pointer}

/* 🧩 แบบประเมิน + รายการอัปโหลด (แบบ ChatGPT รอบ 2 · outputs/fdt-ux-design-2 · 27 ต.ค. 69) — สีตามสเปก · ตัวอักษรเล็กสุด 12px · แตะได้ ≥ 44px
   ใช้ที่ /assess /review (assets/assess.css มีส่วนการ์ดคำถาม) และส่วนส่งเอกสารในหน้าคำสั่งซื้อ (.intake) */
.asw,.intake{--x-ink:#0D2236;--x-soft:#46576A;--x-band:#F3F6F9;--x-line:#E0E6ED;--x-surface:#fff;--x-link:#B35400;--x-sel:#FFF3E8;--x-shadow:0 14px 40px rgba(6,37,65,.06);--x-next:#062541}
@media (prefers-color-scheme:dark){.asw,.intake{--x-ink:#EDF3F8;--x-soft:#BAC9D7;--x-band:#0A263F;--x-line:#31516A;--x-surface:#0C2E4A;--x-link:#FFB668;--x-sel:#193C56;--x-shadow:0 14px 40px rgba(0,0,0,.1);--x-next:#123853}}
.symbol{width:20px;height:20px;vertical-align:middle;flex-shrink:0}
.upload-head{display:flex;justify-content:space-between;align-items:end;gap:28px}
.upload-counter{padding:14px 20px;border:1px solid var(--x-line);border-radius:16px;background:var(--x-band);min-width:220px;color:var(--x-ink)}
.upload-counter b{font-size:24px;font-weight:500;line-height:1.5}
.upload-counter span{font-size:12px;color:var(--x-soft)}
.upload-counter .progress-track,.intake .progress-track{height:6px;background:var(--x-line);border-radius:20px;overflow:hidden;margin-top:9px}
.upload-counter .progress-track i{display:block;background:var(--orange);height:100%;border-radius:20px}
.upload-hint{display:flex;gap:12px;align-items:center;padding:16px 20px;border:1px dashed var(--x-line);border-radius:14px;margin:25px 0 22px;color:var(--x-soft);font-size:13px;line-height:1.8;cursor:pointer}
.upload-hint strong{font-weight:500;color:var(--x-ink)}
.upload-hint.over,.upload-slot.over{border-color:var(--orange);background:var(--x-sel)}
.upload-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.upload-slot{border:1px solid var(--x-line);border-radius:18px;padding:20px;background:var(--x-surface);color:var(--x-ink);position:relative;display:flex;flex-direction:column;min-height:258px;min-width:0}
.upload-slot.retry{border-color:#CF995D}.upload-slot.checked{border-color:#A1C6B3}
.slot-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 16px}
.slot-head .icon{width:56px;height:56px;object-fit:contain;flex-shrink:0}
.schip{display:inline-flex;align-items:center;gap:5px;font-size:12px;line-height:1.8;font-weight:500;padding:4px 8px;border-radius:7px;white-space:nowrap}
.schip .symbol{width:14px;height:14px}
.schip.empty{color:var(--x-soft);background:var(--x-band);border:1px dashed var(--x-soft)}
.schip.uploaded{background:#EAF0F5;color:#46576A;border:1px solid #C3D0DA}
.schip.checked{background:#EAF3EE;color:#1D6B4F;border:1px solid #BDD9CA;border-radius:20px}
.schip.retry{background:#FFF0DF;color:#8B4000;border:1px solid #E4BF97}
.upload-slot h2{font-size:17px;font-weight:500;line-height:1.6;margin:14px 0 0;color:var(--x-ink)}
.upload-slot>p{font-size:12px;color:var(--x-soft);line-height:1.9;margin:5px 0 0}
.slot-file{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-top:14px;padding:8px 10px;background:var(--x-band);border-radius:10px;font-size:12px;line-height:1.7;color:var(--x-soft)}
.slot-file .sf-t{flex:1 1 120px;min-width:0;overflow-wrap:anywhere}
.slot-file .fn{color:var(--x-ink)}
.slot-file .sf-a{display:flex;gap:4px;margin-left:auto}
.slot-file .lnk{font-size:12px;min-height:44px}
.thumb{height:36px;width:48px;display:grid;place-items:center;background:#F3F6F9;border:1px solid var(--x-line);border-radius:6px;flex-shrink:0}
.thumb img{width:32px;height:32px;object-fit:contain}
.slot-action{padding-top:14px;margin-top:auto}
.slot-btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;padding:8px 14px;font-size:13px;color:var(--x-ink);background:var(--x-surface);border:1px solid var(--x-line);border-radius:10px;cursor:pointer;text-align:center}
.slot-btn:hover{background:var(--x-band)}
.slot-btn:focus-visible,.upload-hint:focus-visible{outline:3px solid var(--x-ink);outline-offset:4px}
.upload-footnote{margin:20px 0;color:var(--x-soft);font-size:12px;line-height:1.9}
.ugroups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:26px 0 0}
.ug{display:flex;align-items:center;gap:10px;min-height:56px;padding:10px 14px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-surface);color:var(--x-ink);font:inherit;text-align:left;cursor:pointer}
.ug:hover{background:var(--x-band)}
.ug.on{border-color:var(--orange);background:var(--x-sel);box-shadow:inset 0 0 0 1px var(--orange)}
.ug:focus-visible{outline:3px solid var(--x-ink);outline-offset:3px}
.ug-n{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--x-band);border:1px solid var(--x-line);font-size:13px;font-weight:500;flex-shrink:0}
.ug.on .ug-n{background:var(--orange);border-color:var(--orange);color:#fff}
.ug.full .ug-n{background:#EAF3EE;border-color:#BDD9CA;color:#1D6B4F}
.ug-t{font-size:14px;line-height:1.5;font-weight:500;min-width:0}
.ug-t small{display:block;font-size:12px;font-weight:400;color:var(--x-soft)}
.ug-where{display:flex;align-items:center;gap:8px;margin:16px 0 0;font-size:13px;color:var(--x-soft)}
.ug-where .symbol{width:18px;height:18px;flex-shrink:0}
.ug-where+.upload-hint{margin-top:14px}
@media (max-width:900px){.ugroups{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.ug{padding:8px 10px;gap:8px}.ug-t{font-size:13px}}
@media (max-width:1250px) and (min-width:701px){.upload-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.upload-head{display:block}.upload-counter{min-width:0;margin-top:20px;padding:14px 18px}.upload-counter b{font-size:23px}
  .upload-hint{align-items:start;padding:15px;margin:20px 0;font-size:12px;line-height:1.9}
  .upload-grid{grid-template-columns:1fr;gap:16px}.upload-slot{padding:20px;min-height:245px}.upload-slot h2{font-size:18px}.slot-btn{min-height:46px}}
@media (prefers-color-scheme:dark){.slot-head .icon{background:#F3F6F9;border-radius:12px}}
/* หน้าคำสั่งซื้อกว้าง 720px (section.narrow) → 2 คอลัมน์ (สัดส่วนเดียวกับ 3 คอลัมน์ที่ 1160px ในแบบ) · กล่องลากวางชิดซ้ายตามแบบ */
.intake .upload-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.intake .upload-hint.idrop{display:flex;place-items:normal;text-align:left;margin:4px 0}
.intake .upload-head h2{margin:0}
@media (max-width:700px){.intake .upload-grid{grid-template-columns:1fr}}

/* 🎨 การ์ดบริการหน้าแรกแบบ B "ภาพประกอบ" (owner 28 ต.ค. 69 เลือกจากแบบ ChatGPT · spec fdathailand-design/service-cards/outputs/DESIGN-SPEC.md)
   ภาพหุ่นนิ่งโปร่งใสบนแสงสีประจำบริการ (--sa) ไล่จางลงสีการ์ด · ข้อความเป็น HTML ทั้งหมด
   🪤 .svc มีกฎแนวนอน (ไอคอนซ้าย 44px) และ > :not(.ic) grid-column:2 → ใน .bsvc ต้องคืนเป็นคอลัมน์เดียว */
.svcs.bsvc{gap:18px}
.bsvc .svc{display:flex;flex-direction:column;padding:0;gap:0;border-radius:22px;overflow:hidden;position:relative;min-height:280px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.bsvc .svc > *{grid-column:auto}
.bsvc .bart{position:relative;height:136px;flex:none;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 65%,color-mix(in srgb,var(--sa) 16%,transparent),transparent 72%)}
.bsvc .bart::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 62%,var(--paper));pointer-events:none}
.bsvc .bart img{position:relative;z-index:1;width:250px;height:150px;max-width:90%;object-fit:contain;transition:transform .25s ease}
.bsvc .svc b{padding:6px 24px 0;font-size:1.22rem;line-height:1.55}
.bsvc .svc small{padding:4px 24px 0;font-size:.88rem;line-height:1.85}
.bsvc .kw{white-space:nowrap}
.bsvc .who{align-self:flex-start;margin:auto 24px 20px;padding:4px 11px;border-radius:99px;font-size:.76rem;font-weight:500;line-height:1.65;background:#FFF1E4;color:#773700}
.bsvc .who.visbio{background:#E0F5F0;color:#185A53}
.bsvc .who.zubb{background:#F6E6F4;color:#743467}
.bsvc small + .who{margin-top:auto}
.bsvc .svc small{margin-bottom:16px}
.bsvc .svc:hover{transform:translateY(-4px);border-color:var(--orange);box-shadow:0 16px 36px rgba(255,131,0,.11),0 0 0 1px rgba(255,131,0,.14)}
.bsvc .svc:hover .bart img{transform:translateY(-2px) scale(1.025)}
@media (prefers-color-scheme:dark){
  .bsvc .who{background:#19344D;color:#FFD2A3}
  .bsvc .who.visbio{background:#0D3C40;color:#9FE8DB}
  .bsvc .who.zubb{background:#3A2A4A;color:#F1BDE8}
  .bsvc .svc:hover{border-color:var(--orange)}
}
@media (max-width:1100px) and (min-width:761px){.svcs.bsvc{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.bsvc .bart{height:146px}.bsvc .svc b{font-size:1.15rem;padding:6px 20px 0}.bsvc .svc small{padding:4px 20px 0;font-size:.85rem}.bsvc .who{margin-left:20px;margin-right:20px}}
@media (prefers-reduced-motion:reduce){.bsvc .svc,.bsvc .bart img{transition:none}.bsvc .svc:hover,.bsvc .svc:hover .bart img{transform:none}}

/* 🎮 30 ต.ค. 69 owner "Tab ด้านบนของเว็บหายไป": เดิมซ่อนแท็บ "เกม" ที่จอ 761–1100px และทุกจอ desktop ของบัญชีทีม (QA-001) เพื่อให้หัวเว็บแถวเดียว
   ⇒ เลิกซ่อน — แท็บครบทุกจอ: ≥1152px หัวเว็บแถวเดียว (ระยะ/ตัวอักษรเมนูแน่นขึ้นนิดหน่อย) · 761–1151px เมนูขึ้นแถวที่ 2 ทั้งแถวแบบมือถือ (เป็นระเบียบ ไม่ตกทีละชิ้น)
   วัดแล้ว th/en × ผู้ชม/สมาชิกชื่อยาว+แจ้งเตือน 2 หลัก/ทีม ที่ 770–1440px: ≥1152 = 1 แถว · ต่ำกว่า = 2 แถว (ไม่มี 3 แถว) */
@media (min-width:761px){.nav{font-size:.92rem}.top .in,.top.mem .in{gap:12px}.nav,.top.mem .nav{gap:14px}.top .cta,.top.mem .cta{padding:9px 12px}}
@media (min-width:761px) and (max-width:1151px){.top .nav,.top.mem .nav{order:9;width:100%;gap:18px}}
@media (min-width:761px) and (max-width:860px){.top.staff .in{gap:10px}.top.staff .beta{display:none}}

/* Services UX pilot · 30 Oct 2026. Table containment/accessibility applies to all service pages. */
.svcpage .atable{display:block;min-width:0;max-width:100%;width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.svcpage .atable:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.svcpage .atable th{overflow-wrap:normal}
.svcpage .atable table{max-width:none}
/* The following layout is intentionally limited to /th/services/documents until owner review. */
.svcux{gap:28px}
.svcux > section{display:block}
.svcux .svch{margin:24px 0}
.svcux .svc-audience{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:16px;padding:18px 22px;margin:24px 0}
.svcux .svc-audience h2{font-size:1.12rem;margin:0 0 10px}
.svcux .svc-audience ul{margin:0;padding-left:1.3em;display:grid;gap:5px}
.svcux .svc-workcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0 24px}
.svcux .svc-workcards a{min-width:0;display:grid;grid-template-columns:42px minmax(0,1fr) 18px;align-items:center;gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:18px 14px;text-decoration:none;color:var(--title)}
.svcux .svc-workcards b{font-size:.95rem;font-weight:500;line-height:1.6}
.svcux .svc-workcards .ic{width:42px;height:42px;margin:0}
.svcux .svc-work-arrow .ico{width:18px;height:18px;color:var(--accent)}
.svcux .svc-workcards a:hover{border-color:var(--accent);background:var(--band)}
.svcux a:focus-visible,.svcux summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-radius:6px}
.svcux .flow{gap:12px;margin:18px 0 24px}
.svcux .flow li{padding:20px 16px;border-radius:14px;font-size:1rem;line-height:1.7;border-top:3px solid var(--orange)}
.svcux .flow .ic{width:44px;height:44px}
.svcux .flow .ic .ico{width:24px;height:24px}
.svcux .flow small{font-size:1.1rem;font-weight:500;color:var(--accent);margin-bottom:8px}
.svcux .sarticle{max-width:none;margin-top:28px;padding-top:20px}
.svcux .svc-topic{padding:0 0 22px;margin:0 0 10px;border-bottom:1px solid var(--line)}
.svcux .svc-topic h2{font-size:1.23rem;margin-top:18px}
.svcux .svc-fold{background:var(--paper);border:1px solid var(--line);border-radius:12px;margin:12px 0 0;padding:0 16px}
.svcux .svc-fold > summary{padding:12px 0;cursor:pointer;color:var(--accent);font-weight:500}
.svcux .svc-fold[open] > summary{border-bottom:1px solid var(--line);margin-bottom:16px}
.svcux .svc-less,.svcux .svc-fold[open] .svc-more{display:none}
.svcux .svc-fold[open] .svc-less{display:inline}
.svcux .svc-fold-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.svcux .svc-inline-tool{color:var(--accent);text-decoration:underline;text-underline-offset:3px;font-weight:500}
.svcux .svc-toc{display:grid;gap:4px}
.svcux .svc-toc b{color:var(--title);font-size:.98rem;margin-bottom:6px}
.svcux .svc-toc a{color:var(--soft);font-weight:400;font-size:.84rem;line-height:1.6;padding:5px 8px;border-radius:6px;border-left:2px solid transparent;text-decoration:none}
.svcux .svc-toc a:hover,.svcux .svc-toc a:focus-visible{background:var(--band);border-left-color:var(--orange)}
.svcux .svc-toc-desktop{max-height:38vh;overflow-y:auto;padding:0 4px 14px 0;margin-bottom:12px;border-bottom:1px solid var(--line)}
.svcux .svc-toc-mobile{display:none}
.svcux [id]{scroll-margin-top:120px}
@media(max-width:860px){
 .svcux > .side{position:static}
 .svcux .svc-toc-desktop{display:none}
 .svcux .svc-toc-mobile{display:block;border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:0 16px;margin:0 0 24px}
 .svcux .svc-toc-mobile > summary{cursor:pointer;padding:14px 0;color:var(--title);font-weight:500}
 .svcux .svc-toc-mobile .svc-toc{padding-bottom:16px;gap:6px}
 .svcux .svc-toc-mobile .svc-toc a{font-size:.94rem;padding:8px 6px}
}
@media(max-width:600px){
 .svcux .svc-workcards{grid-template-columns:1fr}
 .svcux .svc-audience{padding:16px}
 .svcux .flow li{padding:16px 12px;font-size:.94rem}
 .svcux .svc-fold{padding:0 12px}
 .svcux [id]{scroll-margin-top:156px}
}
@media(prefers-reduced-motion:reduce){.svcux{scroll-behavior:auto}}
@media(max-width:600px){
 .svcpage .atable::before{content:"Swipe horizontally to read the table";display:block;position:sticky;left:0;width:100%;padding:8px 10px;font-size:.8rem;color:var(--soft);background:var(--band);border-bottom:1px solid var(--line)}
 html[lang^="th"] .svcpage .atable::before{content:"เลื่อนตารางซ้าย–ขวาเพื่ออ่านให้ครบ"}
}

/* 🚢 เช็กความพร้อมนำเข้า: การ์ดตัวเลือกมีไอคอน (owner 31 ต.ค. 69 · ภาษาเดียวกับ /review แต่กะทัดรัดกว่า เพราะมี 8 ข้อในหน้าเดียว) */
.impf{gap:28px}
.impf legend{display:flex;align-items:center;gap:10px;font-size:1.05rem;margin-bottom:12px}
.iq-n:empty{display:none}.iq-t{display:block;min-width:0}
.iq-n{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:.85rem;font-weight:600;background:var(--band);color:var(--title);border:1px solid var(--line)}
.iq.ok .iq-n{background:var(--orange);border-color:var(--orange);color:#062541}
.icards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.icards.long{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.icard{position:relative;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:132px;padding:18px 12px 14px;text-align:center;
  border:1px solid var(--line);border-radius:16px;background:var(--paper);color:var(--ink);box-shadow:0 10px 28px rgba(6,37,65,.05);min-width:0}
.icard.txt{flex-direction:row;justify-content:flex-start;text-align:left;min-height:64px;padding:14px 40px 14px 16px}
.icard:hover{background:var(--band)}
.icard.on{border:2px solid var(--orange);background:var(--accent-soft);padding:17px 11px 13px}
.icard.txt.on{padding:13px 39px 13px 15px}
.icard:has(input:focus-visible){outline:3px solid var(--ink);outline-offset:3px}
.icard input{position:absolute;opacity:0;width:20px;height:20px;right:12px;top:12px;margin:0}
.icard-mark{position:absolute;right:12px;top:12px;width:20px;height:20px;border:1.5px solid var(--faint);border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:600;color:#062541}
.icard.multi .icard-mark{border-radius:5px}
.icard.on .icard-mark{background:var(--orange);border-color:var(--orange)}
.icard.on .icard-mark::after{content:"✓"}
.icard .icon{width:56px;height:56px;object-fit:contain;flex:none}
.icard-t{font-size:.92rem;font-weight:500;line-height:1.55;overflow-wrap:anywhere}
.iprog{flex:1 1 100%;display:flex;align-items:center;gap:12px;font-size:.9rem;color:var(--soft)}
.iprog b{color:var(--title)}
.iprog i{flex:1;height:6px;border-radius:6px;background:var(--line);overflow:hidden}.iprog i b{display:block;height:100%;background:var(--orange);transition:width .16s ease}
.impf .ibtns{position:sticky;bottom:0;z-index:3;flex-wrap:wrap;gap:8px 10px;padding:10px 0 12px;background:var(--paper);border-top:1px solid var(--line);box-shadow:0 -10px 24px rgba(6,37,65,.06)}
.ish{display:flex;align-items:center;gap:12px}.ish-ic{width:40px;height:40px;object-fit:contain;flex:none}
@media (prefers-color-scheme:dark){.icard .icon,.ish-ic{background:#F3F6F9;border-radius:10px;padding:3px}.icard{box-shadow:none}.iq.ok .iq-n{color:#062541}.icard.on,.crt.fcard[aria-pressed="true"]{background:#193C56}}
@media (max-width:640px){.icards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.icards.long{grid-template-columns:1fr}.icard{min-height:120px}.icard-t{font-size:.86rem}
  .icards.wide{grid-template-columns:1fr}.icards.wide .icard{flex-direction:row;justify-content:flex-start;text-align:left;min-height:80px;padding:12px 40px 12px 14px;gap:14px}.icards.wide .icard.on{padding:11px 39px 11px 13px}.icards.wide .icon{width:48px;height:48px}
  .impf .ibtns{padding-right:64px;flex-wrap:wrap}.impf .ibtns .btn{flex:1;min-width:0;padding-left:12px;padding-right:12px}}
@media (prefers-reduced-motion:reduce){.iprog i b{transition:none}}

/* เช็กเลข อย.: ช่องเลือกหมวดเป็นการ์ดไอคอน (owner 31 ต.ค. 69) */
.fcrow{display:grid;gap:8px}
.fcards{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.crt.fcard{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:112px;padding:14px 10px 12px;border-radius:14px;background:var(--paper);color:var(--ink);text-align:center}
.crt.fcard[aria-pressed="true"]{background:var(--accent-soft);border:2px solid var(--orange);color:var(--ink);padding:13px 9px 11px}
.crt.fcard[aria-pressed="true"] .icard-mark{background:var(--orange);border-color:var(--orange)}.crt.fcard[aria-pressed="true"] .icard-mark::after{content:"✓"}
.crt.fcard .icon{width:48px;height:48px;object-fit:contain}
@media (prefers-color-scheme:dark){.crt.fcard .icon{background:#F3F6F9;border-radius:10px;padding:3px}}
@media (max-width:640px){.fcards{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* 🧭 ใช้งานตามบทบาท (31 ต.ค. 69 ระยะ A) */
.rcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.rcard{display:grid;grid-template-columns:56px minmax(0,1fr) 20px;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:var(--paper);color:var(--ink);text-decoration:none}
.rcard:hover{background:var(--band);border-color:var(--orange)}
.rcard .icon{width:56px;height:56px;object-fit:contain}
.rc-t{display:grid;gap:2px;min-width:0}.rc-t b{font-weight:600;color:var(--title)}.rc-t span{font-size:.9rem;color:var(--soft);line-height:1.6}
.rcard>svg{width:18px;height:18px;color:var(--accent)}
.rgoal{display:flex;align-items:center;gap:12px;margin-top:14px;padding:10px 14px;border-radius:14px;background:var(--paper);border:1px solid var(--line);max-width:640px}
.rgoal .icon{width:48px;height:48px;object-fit:contain;flex:none}.rgoal b{color:var(--title);font-weight:500}
.rrail{list-style:none;margin:0;padding:0;display:grid;counter-reset:rs}
.rstep{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;padding-bottom:24px}
.rstep::before{counter-increment:rs;content:counter(rs);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:600;background:var(--paper);border:2px solid var(--orange);color:var(--title);position:relative;z-index:1}
.rstep::after{content:"";position:absolute;left:17px;top:36px;bottom:0;width:2px;background:var(--line)}.rstep:last-child::after{display:none}
.rs-b{display:grid;gap:6px;justify-items:start;min-width:0}.rs-b h3{margin:4px 0 0;font-size:1.05rem;color:var(--title)}.rs-b p{margin:0;color:var(--soft)}
.rex-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px;align-items:start}
.rex-art{margin:0;display:grid;gap:8px}.rex-art figcaption{font-size:.85rem;color:var(--soft)}
.lbl{background:#FDFBF6;color:#1B2A36;border:1px solid #D9D2C3;border-radius:12px;padding:22px 20px;font-size:.88rem;line-height:1.7;box-shadow:0 12px 30px rgba(6,37,65,.08);display:grid;gap:6px}
.lbl p{margin:0}.lbl-brand{font-weight:700;letter-spacing:.18em;font-size:.8rem;color:#5B6B5A}.lbl-name{font-size:1.15rem;font-weight:600}.lbl-en{color:#5B6B5A}
.lbl-claim{font-weight:600;color:#8A3B12}.lbl-ingr{font-size:.8rem}.lbl-fda{font-size:.8rem;color:#465565}
.rex-res{display:grid;gap:10px;min-width:0}.rex-res h3{margin:0;color:var(--title)}.rex-res ol{margin:0;padding-left:20px;display:grid;gap:8px}
@media (max-width:760px){.rex-g{grid-template-columns:1fr}}
/* 📐 สเปกฉลากก่อนออกแบบ (/tools/label-spec) */
.lsp-nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:4px 0 12px;max-width:460px}
.lsp-num{display:grid;gap:4px;font-size:.92rem;min-width:0}
.lsp-num input{font:inherit;width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:inherit}
.icards.lsp-units{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.icards.lsp-units .icard{min-height:56px}
.lsp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.lsp{width:100%;border-collapse:collapse;font-size:.92rem;min-width:640px}
.lsp th,.lsp td{text-align:left;vertical-align:top;padding:10px 8px;border-bottom:1px solid var(--line)}
.lsp th{font-weight:500;font-size:.82rem;color:var(--soft)}
.lsp td:first-child{width:30%}.lsp td.lsp-mm{width:15%}.lsp td:nth-child(3){width:31%}.lsp td.lsp-mm b{font-size:1.05rem;color:var(--ink)}
.lsp .cchip{margin-right:4px}
@media (max-width:700px){.lsp{min-width:0}.lsp thead{display:none}.lsp tr{display:block;padding:12px 0;border-bottom:1px solid var(--line)}
  .lsp td{display:block;border:0;padding:3px 0;width:auto!important}.lsp td:first-child{font-weight:500;padding-bottom:6px}.lsp td.lsp-0{display:none}
  .lsp td[data-h]::before{content:attr(data-h);display:block;font-size:.76rem;color:var(--soft);font-weight:400}}
@media print{.lsp{min-width:0;font-size:9pt}.lsp-wrap{overflow:visible}#lspf{display:none!important}.isec details{display:block}.isec details>*{display:block}}
/* 📏 ตรวจอาร์ตเวิร์ก PDF (/tools/artwork-check) */
.awk .aw-name{max-width:460px;margin:4px 0 12px}
.aw-pages{display:grid;gap:14px;padding:12px}.aw-pages:empty{display:none}
.aw-cv{display:block;border:1px solid var(--line);border-radius:8px;background:#fff}
.aw-list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.aw-f{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.aw-f:last-child{border-bottom:0}
.aw-n{width:26px;height:26px;border-radius:50%;color:#fff;font-weight:600;font-size:.82rem;display:grid;place-items:center;margin-top:2px}
.aw-h{margin:0 0 4px;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}.aw-m{margin:0 0 4px;font-size:.92rem}
.aw-f ul{margin:4px 0 0;padding-left:1.1em;color:var(--soft)}
.lc-msg.bad{color:var(--no)}
/* 📦 เช็กลิสต์ต่อการนำเข้า (/tools/import-shipment) */
.shs h3{display:flex;align-items:center;gap:10px}
.shl{list-style:none;margin:8px 0 0;padding:0!important;display:grid;gap:0!important}
.shi{border-top:1px solid var(--line);padding:12px 0}.shi:first-child{border-top:0}
.shi label{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;cursor:pointer;align-items:start}
.shi input{width:20px;height:20px;margin:3px 0 0;accent-color:var(--ok)}
.shi-m{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}
.shi.done>label>span{opacity:.6}.shi.done b{text-decoration:line-through}
#shf textarea{width:100%;box-sizing:border-box;font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:inherit;margin-bottom:10px}
@media print{#shf{display:none!important}.shi input{accent-color:#000}}

/* 📱 หัวเว็บบนมือถือ (owner 8 พ.ย. 69): ค้างบนจอ 3 แถว ~130px = 1/6 ของจอ → เลื่อนลงเหลือแถวโลโก้ · เลื่อนขึ้นเมื่อไรเมนูกลับมา */
@media (max-width:760px){.top.mini .nav,.top.mini .langm,.top.mini .acct{display:none}.top.mini .in{padding-block:8px}}

/* 🧩 รีดีไซน์แบบแอป (owner 8 พ.ย. 69 "ทำทั้ง 6 ข้อ") — ไอคอนแทนภาพคน · หน้ารวมเครื่องมือเป็นตารางไอคอน · แถบขั้นตอนเป็นไอคอน */
.phead.toolhead{padding:34px 0 22px;gap:12px}
.toolhead .th-top{display:flex;gap:16px;align-items:center}
.toolhead .th-ic{width:76px;height:76px;flex:0 0 76px;object-fit:contain;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:6px;box-sizing:border-box}
.toolhead h1{margin:2px 0 0}
.toolhead .pt{display:grid;gap:10px;max-width:820px}
@media (max-width:760px){.phead .part{display:none}.phead.witharts{grid-template-columns:1fr}.phead.toolhead{padding:22px 0 14px}.toolhead .th-ic{width:60px;height:60px;flex-basis:60px;border-radius:16px}.toolhead h1{font-size:1.5rem}}
.tgrp{display:grid;gap:12px;margin-top:8px}
.tgrp h2{margin:0;font-size:1.05rem;color:var(--soft);font-weight:600;letter-spacing:.01em}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tile{display:grid;grid-template-rows:auto auto 1fr;gap:6px;justify-items:start;padding:16px;border-radius:16px;background:var(--paper);border:1px solid var(--line);text-decoration:none;color:var(--ink);min-height:100%;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.tile:hover{transform:translateY(-2px);border-color:var(--orange);box-shadow:var(--shadow)}
.tile .ti{width:60px;height:60px;object-fit:contain}
.tile b{color:var(--title);font-size:1rem;line-height:1.4}
.tile small{color:var(--soft);font-size:.86rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:1000px){.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tile{padding:14px 12px}.tile .ti{width:52px;height:52px}.tile b{font-size:.95rem}.tile small{font-size:.8rem}}
.steps4{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:760px}
.steps4 li{position:relative;display:grid;justify-items:center;text-align:center;gap:6px;padding:12px 8px;border-radius:14px;background:var(--paper);border:1px solid var(--line)}
.steps4 .si{width:44px;height:44px}
.steps4 .sn{position:absolute;top:6px;left:8px;font-size:.72rem;font-weight:600;color:var(--orange)}
.steps4 .st{font-size:.82rem;line-height:1.35;color:var(--ink)}
@media (max-width:420px){.steps4{gap:6px}.steps4 li{padding:10px 4px}.steps4 .si{width:36px;height:36px}.steps4 .st{font-size:.74rem}}
.ph-more{max-width:820px;border-radius:12px;background:var(--band)}
.ph-more summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px;padding:0 14px;font-weight:500;color:var(--title)}
.ph-more>div{padding:0 14px 12px;color:var(--soft)}
.nf404{display:grid;justify-items:center;text-align:center;gap:12px;padding:48px 0}
.nf404 img{width:180px;height:180px}
.nf404 .acts{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.htools{display:grid;gap:12px}
.htools .sh{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.htools .sh h2{margin:0}
/* หน้าแรกบนมือถือ: เส้นทาง 8 ขั้นเหลือหัวข้อ + ปุ่ม (คำอธิบายยาวอยู่ในหน้าเครื่องมือแต่ละตัวแล้ว) */
@media (max-width:760px){.ja-mstep .ja-mbody>p,.ja-mstep details{display:none}.ja-mstep{padding-bottom:6px}.ja-p{display:none}}
/* 📱 หน้าแรกบนมือถือ (owner 8 พ.ย. 69 ย่อหน้าแรก): บทความเหลือ 3 ใบแบบแถวเล็ก · บริการเป็นตาราง 2 คอลัมน์ไม่มีคำอธิบาย */
@media (max-width:760px){
  .phome .pcards>.pcard:nth-child(n+4){display:none!important}
  .phome .pcard.img{display:grid;grid-template-columns:96px minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;row-gap:4px;align-items:start}
  .phome .pcard.img .pthumb{grid-row:1/3;width:96px;height:72px;border-radius:10px;overflow:hidden}
  .phome .pcard.img .pthumb img{width:100%;height:100%;object-fit:cover}
  .phome .pcard.img .pchip,.phome .pcard.img small{display:none}
  .bsvc{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
  .bsvc .svc small,.bsvc .svc .who{display:none}
  .bsvc .svc .bart img{max-height:96px;object-fit:contain}
  .bsvc .svc b{font-size:.92rem}
}
/* 📱 ท้ายเว็บบนมือถือ: รายการลิงก์เครื่องมือ/บริการยาว ~30 ลิงก์ (1.7 จอ) ซ้ำกับเมนูด้านบน → ซ่อน เหลือข้อมูลบริษัท ติดต่อ และลิงก์นโยบาย */
@media (max-width:760px){.foot .in>nav{display:none}}
.toolhead .pt>*{max-width:100%;min-width:0}.steps4{width:100%;box-sizing:border-box}.steps4 li{min-width:0}.steps4 .st{overflow-wrap:anywhere}

/* 📖 อ่านฉลากเป็น (ความรอบรู้ด้านสุขภาพและความงาม · 8 พ.ย. 69) */
.rl-link{display:flex;gap:12px;align-items:center;max-width:560px;padding:10px 14px;border-radius:14px;background:var(--paper);border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.rl-link:hover{border-color:var(--orange)}.rl-link span:nth-child(2){display:grid;gap:2px;flex:1}.rl-link b{color:var(--title);font-size:.95rem}.rl-link small{color:var(--soft);font-size:.82rem}
.rlw{display:grid;gap:16px}
.rl-r{position:absolute;opacity:0;pointer-events:none}
.rl-tabs{display:flex;gap:8px;flex-wrap:wrap}
.rl-tab{display:inline-flex;gap:8px;align-items:center;min-height:46px;padding:6px 16px 6px 8px;border-radius:99px;border:1.5px solid var(--line);background:var(--paper);cursor:pointer;font-weight:500;color:var(--ink)}
.rl-r:checked+.rl-tab{border-color:var(--orange);background:var(--accent-soft)}
.rl-r:focus-visible+.rl-tab{outline:2px solid var(--orange);outline-offset:2px}
.rl-pane{display:none}
.rlw:has(#rl-food:checked) .rl-pane[data-d=food],.rlw:has(#rl-supplement:checked) .rl-pane[data-d=supplement],.rlw:has(#rl-cosmetic:checked) .rl-pane[data-d=cosmetic],.rlw:has(#rl-herbal:checked) .rl-pane[data-d=herbal]{display:grid;gap:12px}
.rl-pane h2{margin:4px 0 0;font-size:1.1rem}
.rl-tips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rl-tip{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:14px;background:var(--paper);border:1px solid var(--line)}
.rl-tip .rl-ic{width:52px;height:52px;flex:0 0 52px}
.rl-tip b{color:var(--title)}.rl-tip p{margin:4px 0 0;color:var(--soft);font-size:.92rem;line-height:1.6}
.rl-all ul{margin:0;padding-left:1.2em;display:grid;gap:4px;color:var(--ink)}
.rl-flags{padding:18px;border-radius:16px;background:var(--hold-bg,#FFF4E5);border:1px solid var(--line)}
.rl-flags h2{display:flex;gap:10px;align-items:center;margin:0 0 8px;font-size:1.1rem;color:var(--title)}
.rl-flags ul{margin:0;padding-left:1.2em;display:grid;gap:6px;color:var(--ink)}
.rl-biz{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px;border-radius:16px;background:var(--band)}
.rl-biz>div{display:flex;gap:12px;align-items:center}.rl-biz p{margin:2px 0 0;color:var(--soft)}
@media (max-width:760px){.rl-tips{grid-template-columns:1fr}.rl-tab{padding-right:12px;font-size:.92rem}}
.phead>.pt{min-width:0;max-width:100%}.phead>.pt>*{max-width:100%;min-width:0}.rlw>*,.rl-pane>*,.rl-tip>div{min-width:0}

/* 🔬 เกณฑ์การคัดเลือกหลักฐาน */
.ev-based{max-width:820px;padding:10px 14px;border-radius:12px;background:var(--band);color:var(--ink)!important;font-size:.92rem}
.evw{display:grid;gap:14px;max-width:900px}
.ev-card{display:flex;gap:16px;align-items:flex-start;padding:18px;border-radius:16px;background:var(--paper);border:1px solid var(--line);min-width:0}
.ev-card>div{min-width:0;flex:1}
.ev-ic{width:48px;height:48px;flex:0 0 48px}
.ev-card h2{margin:0 0 6px;font-size:1.1rem}.ev-card h3{margin:14px 0 6px;font-size:1rem}
.ev-card ul{margin:0;padding-left:1.2em;display:grid;gap:6px;color:var(--ink)}
.ev-g{display:grid;gap:10px;margin-top:8px}
.ev-gi{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:12px;background:var(--band)}
.ev-gi p{margin:2px 0 0;color:var(--soft);font-size:.92rem}
.ev-badge{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:10px;font-size:1.2rem;color:#fff;background:var(--navy,#062541)}
.g-A .ev-badge{background:#1F7A4D}.g-B .ev-badge{background:#B76E00}.g-C .ev-badge{background:#6B7785}
.ev-limit{background:var(--hold-bg,#FFF4E5)}
@media (max-width:760px){.ev-card{padding:14px;gap:12px}.ev-ic{width:40px;height:40px;flex-basis:40px}}

/* 🧪 โปรไฟล์สาร + 🏷 ถอดรหัสคำโฆษณา (literacy.js) */
.ev-see{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.litw{display:grid;gap:14px;max-width:960px;min-width:0}.litw>*{min-width:0}
.lit-nav{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px}
.lit-tab{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 8px;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--ink);text-decoration:none;font-weight:600;font-size:.95rem}
.lit-tab.on{border-color:var(--navy,#062541);background:var(--band)}.lit-ti{width:28px;height:28px}
.lit-search{display:flex;gap:8px;max-width:640px;margin-top:12px}.lit-search input{flex:1;min-width:0;padding:11px 14px;border-radius:12px;border:1px solid var(--line);font:inherit;font-size:1rem}
.lit-legend{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;font-size:.92rem;color:var(--soft)}.lit-legend span{display:inline-flex;gap:6px;align-items:center}
.lit-g{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border-radius:9px;font-size:1.05rem;color:#fff;background:#6B7785}
.lit-g.lg{width:46px;height:46px;flex-basis:46px;font-size:1.35rem;border-radius:12px}
.lit-g.g-A{background:#1F7A4D}.lit-g.g-B{background:#B76E00}.lit-g.g-C{background:#6B7785}.lit-g.g-none{background:var(--band);color:var(--soft)}
.lit-topic h2,.lit-h{display:flex;align-items:center;gap:10px;margin:8px 0 10px;font-size:1.15rem;flex-wrap:wrap}.lit-topic h2 small,.lit-h small{font-weight:400;color:var(--soft);font-size:.85rem}
.lit-hic{width:40px;height:40px;flex:0 0 40px}.lit-h .lit-hic{width:32px;height:32px;flex-basis:32px}
.lit-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.lit-card{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:var(--paper);color:var(--ink);text-decoration:none;min-width:0}
.lit-card:hover{border-color:var(--navy,#062541)}.lit-card>span{display:grid;gap:3px;min-width:0}.lit-card b{line-height:1.35}.lit-card small{color:var(--soft)}
.lit-cc em{font-style:normal;color:var(--soft);font-size:.9rem;line-height:1.45}
.lit-chip{display:inline-block;width:max-content;max-width:100%;padding:2px 9px;border-radius:999px;font-size:.8rem;font-weight:600;background:var(--band);color:var(--ink)}
.lit-chip.r-pos{background:#E3F3EA;color:#16603B}.lit-chip.r-null{background:#EDEFF2;color:#3E4955}.lit-chip.r-mix{background:#FFF1DC;color:#8A5300}.lit-chip.r-harm{background:#FDE4E1;color:#A3271B}
.lit-chip.f-ind{background:#FFF1DC;color:#8A5300}.lit-chip.f-don{background:#E6EEF8;color:#1D4A7A}.lit-chip.f-unk,.lit-chip.c-mute{background:#EDEFF2;color:#4A5561}
.lit-head .lit-en{margin:2px 0 0;color:var(--soft)}.lit-plain{font-size:1.1rem}
.lit-facts{display:flex;flex-wrap:wrap;gap:8px 22px;margin:10px 0 0}.lit-facts div{min-width:0}.lit-facts dt{font-size:.8rem;color:var(--soft)}.lit-facts dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.lit-crumb{font-size:.88rem;color:var(--soft);margin:6px 0 2px}.lit-crumb a{color:var(--soft)}
.lit-use,.lit-box{padding:16px 18px;border-radius:16px;background:var(--paper);border:1px solid var(--line);min-width:0}
.lit-box{display:flex;gap:14px;align-items:flex-start}.lit-box>div{min-width:0;flex:1}.lit-box h2,.lit-box h3,.lit-use h3{margin:0 0 6px;font-size:1.05rem}
.lit-box ul,.lit-box ol{margin:0;padding-left:1.2em;display:grid;gap:6px}
.lit-use.g-A{border-left:5px solid #1F7A4D}.lit-use.g-B{border-left:5px solid #B76E00}.lit-use.g-C{border-left:5px solid #6B7785}
.lit-none{display:flex;gap:14px;align-items:flex-start;background:var(--band)}
.lu-head{display:flex;gap:12px;align-items:flex-start}.lu-head>div{min-width:0}
.lu-meta{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin:0;color:var(--soft);font-size:.9rem}
.lit-harm{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:#FDE4E1;color:#7D1C12}
.lu-down{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:var(--band);font-size:.93rem}.lu-down b{margin-right:6px}
.lit-wi{width:24px;height:24px;flex:0 0 24px}.lit-harm .lit-wi{width:28px;height:28px;flex-basis:28px}
.lu-st summary{cursor:pointer;display:flex;gap:8px;align-items:center;font-weight:600;margin:6px 0}
.lit-studies{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.lit-study{padding:10px 12px;border-radius:12px;background:var(--band);min-width:0}
.ls-top{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}.ls-pmid{font-variant-numeric:tabular-nums}
.lit-study dl{display:grid;grid-template-columns:max-content 1fr;gap:3px 12px;margin:8px 0 0;font-size:.9rem}.lit-study dt{color:var(--soft)}.lit-study dd{margin:0;min-width:0;overflow-wrap:anywhere}
.ls-fund{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.lit-warn{background:var(--hold-bg,#FFF4E5)}.lit-rule{border-color:#1D4A7A;background:#F2F6FB}.lit-mini{padding:10px 18px}
.lit-ask{font-size:1.02rem}.lit-rel a{font-weight:600}
.lit-foot{font-size:.9rem;color:var(--soft)}.lit-foot p{margin:4px 0}
.lit-empty{padding:16px;border-radius:14px;background:var(--band)}
@media (max-width:760px){.lit-use,.lit-box{padding:14px}.lit-box{gap:10px}.lit-hic{width:34px;height:34px;flex-basis:34px}.lit-cards{grid-template-columns:1fr}.lit-study dl{grid-template-columns:1fr}.lit-study dt{margin-top:4px}}
.lit-harm>span,.lu-down>span{min-width:0}
.lit-legal{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:16px;background:var(--no-bg);border:2px solid var(--no);min-width:0}.lit-legal>div{min-width:0;flex:1}.lit-legal h3{margin:0 0 6px;font-size:1.1rem;color:var(--no)}.lit-legal p{margin:0}
.lit-coi{border-color:#1D4A7A;background:#F2F6FB}
@media (prefers-color-scheme:dark){.lit-coi,.lit-rule{background:#0c3053;border-color:#1f4266}}
.lit-law .btn{white-space:normal;max-width:100%}
.lit-card>span{grid-template-columns:minmax(0,1fr)}.lit-card .lit-chip{white-space:normal}.lit-card small,.lit-card b{overflow-wrap:anywhere}

/* 🎬 วิดีโอแนะนำบนหน้าแรก */
.vsec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:40px;align-items:center}
.vsec h2{margin:.3em 0 .4em}
.vsec p{color:var(--muted,#9fb6cc)}
.vbox{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.35);background:#04182b;aspect-ratio:16/9}
.vbox video{display:block;width:100%;height:100%;object-fit:cover}
.vbox .aitag{position:absolute;left:10px;top:10px}
@media (max-width:860px){.vsec{grid-template-columns:1fr;gap:18px}.vsec .vbox{order:-1}}