/* ══════════════════════════════════════════════════════════════
   DooDurian — ช่องทาง LINE (มุมของชาวสวน)

   Own file, no <style> block: production serves `style-src 'self'`.
   Every colour comes from a token in styles.css.
   Only layout that is genuinely unique to this screen lives here.

   หน้านี้พูดถึงแค่การใช้งานของชาวสวน — เมนูในห้องแชท กับตารางว่า
   พิมพ์อะไรแล้วบอทตอบอะไร ส่วนที่เป็นเอกสารออกแบบ (flex card, quick
   reply, รายการ endpoint, ID เมนู) ถอดออกไปแล้ว สไตล์ของพวกนั้นจึง
   ไม่เหลืออยู่ในไฟล์นี้
   ══════════════════════════════════════════════════════════════ */

/* ─── Page scaffolding ──────────────────────────────────────── */
.line-eyebrow { color: var(--gold-ink); margin-bottom: 10px; }
.line-section { margin-top: 40px; }

/* ─── อาร์ตเวิร์กเมนู ────────────────────────────────────────── */
.rm-art { margin: 0 0 16px; }
.rm-art img {
  display: block; width: 100%; height: auto;
  max-width: 620px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: #fff;
}
.rm-art figcaption {
  margin-top: 10px; max-width: 620px;
  font-size: 13px; line-height: 21px; color: var(--text-muted);
}

/* ─── ตารางว่าพิมพ์อะไรแล้วได้อะไร ───────────────────────────── */
.spec-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: #fff;
}
.spec-table { width: 100%; border-collapse: collapse; min-width: 520px; }
.spec-table th, .spec-table td {
  text-align: start; vertical-align: top;
  padding: 12px 16px;
  font-size: 14px; line-height: 22px;
  border-bottom: 1px solid var(--border);
}
.spec-table thead th {
  background: var(--surface);
  color: var(--text-muted);
  font-size: 13px; font-weight: 600;
  white-space: nowrap;
}
.spec-table tbody tr:last-child th,
.spec-table tbody tr:last-child td { border-bottom: 0; }
.spec-table tbody th { color: var(--text); font-weight: 600; }
.spec-table td { color: var(--text-body); }