:root{--caynt-accent:#f43f5e;--caynt-on:#ffffff;--caynt-fb:"Sarabun","Segoe UI",system-ui,sans-serif;--caynt-fh:"Kanit","Avenir Next","Segoe UI",system-ui,sans-serif;--caynt-r:14px}
.caynt{--caynt-line:rgba(128,128,128,.35);--caynt-tint:rgba(128,128,128,.08);font-family:var(--caynt-fb);padding:28px 0 64px;line-height:1.7}
@supports (color:color-mix(in srgb,red,blue)){.caynt{--caynt-line:color-mix(in srgb,currentColor 20%,transparent);--caynt-tint:color-mix(in srgb,currentColor 6%,transparent)}}
.caynt *,.caynt *::before,.caynt *::after{box-sizing:border-box}
.caynt [id]{scroll-margin-top:96px}
.caynt-wrap{max-width:760px;margin:0 auto;padding:0 20px}
.caynt h1,.caynt h2,.caynt h3,.caynt-toc-title{font-family:var(--caynt-fh);line-height:1.15;letter-spacing:normal;text-transform:none}
.caynt h1{font-size:clamp(1.9rem,1.3rem + 2.4vw,3rem);margin:.2em 0 .4em}
.caynt h2{font-size:clamp(1.4rem,1.1rem + 1vw,1.9rem);margin:1.7em 0 .6em}
.caynt h3{font-size:1.2rem;margin:1.4em 0 .4em}
.caynt p,.caynt ul,.caynt ol,.caynt dl{margin:0 0 1em}
.caynt ul,.caynt ol{padding-left:1.3em}
.caynt ul{list-style:disc}
.caynt ol{list-style:decimal}
.caynt li{margin:0 0 .35em}
.caynt-article a,.caynt-crumbs a{color:var(--caynt-accent);text-decoration:underline;text-underline-offset:3px}
.caynt img{display:block;max-width:100%;height:auto}
.caynt-fig{margin:1.6em 0}
.caynt-fig img{width:100%;border-radius:var(--caynt-r)}
.caynt-meta{margin:0 0 1.2em;font-size:.92rem;opacity:.8}
.caynt-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.caynt-intro{font-size:1.1em}
.caynt-faq dt{font-weight:700;margin:1.1em 0 .25em}
.caynt-faq dd{margin:0}
.caynt-t2 .caynt-wrap{max-width:1120px}
.caynt-grid{display:grid;gap:36px}
@media (min-width:900px){.caynt-grid{grid-template-columns:minmax(0,1fr) 290px}.caynt-side{position:sticky;top:90px;align-self:start}}
.caynt-side>*{margin:0 0 1.4em}
.caynt-side .caynt-related{margin-top:0}
.caynt-related{margin-top:40px}
.caynt-related--list ol{list-style:none;padding:0;margin:0}
.caynt-related--list li{margin:0;padding:10px 0;border-bottom:1px solid var(--caynt-line)}
.caynt-related--list a{color:inherit;font-weight:600}
.caynt-cta{margin:2.2em 0;padding:18px 22px;border:2px solid var(--caynt-accent);border-radius:var(--caynt-r);text-align:center}
.caynt-cta p{margin:.35em 0}
.caynt-cta a{color:var(--caynt-accent);font-weight:700;font-size:1.05em}
.caynt-share{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:1.6em 0;font-size:.93rem}
.caynt-share a{padding:5px 14px;border:1px solid var(--caynt-line);border-radius:999px;color:inherit;text-decoration:none}
.caynt-share a:hover{border-color:var(--caynt-accent);color:var(--caynt-accent)}
.caynt-faq{margin:1.6em 0}
.caynt-author-by{margin:0;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;opacity:.7}
.caynt-author-name{margin:.1em 0;font-weight:700}
.caynt-author-bio{margin:0}
.caynt-author--side{padding:14px 18px;border:1px solid var(--caynt-line);border-radius:var(--caynt-r);font-size:.93rem}
@media (min-width:900px){.caynt-article>.caynt-author--side{float:right;width:250px;margin:0 0 1em 1.6em}}
.caynt-crumbs ol{display:flex;flex-wrap:wrap;gap:.4em;list-style:none;margin:0 0 1em;padding:0;font-size:.88rem;opacity:.85}
.caynt-crumbs li{margin:0}
.caynt-crumbs li+li::before{content:"/";margin-right:.4em;opacity:.6}
.caynt-back{margin:0 0 1em;font-size:.92rem}
.caynt-back a{color:var(--caynt-accent)}
.caynt-row{display:grid;gap:4px 28px;padding:22px 0;border-top:1px solid var(--caynt-line)}
@media (min-width:700px){.caynt-row{grid-template-columns:150px 1fr}}
.caynt-row .caynt-meta{margin:.35em 0 0}
.caynt-row h2{margin:0 0 .3em;font-size:1.3rem}
.caynt-row a{color:var(--caynt-accent)}
.caynt-row p{margin:0}
.caynt-toc{margin:1.4em 0;padding:10px 0;border-top:3px solid var(--caynt-accent);border-bottom:1px solid var(--caynt-line)}
.caynt-toc-title{margin:0 0 .4em;font-weight:700;font-size:1.05rem}
.caynt-toc ol{margin:0;padding:0;list-style:none}
.caynt-toc a{color:inherit;text-decoration:none;border-bottom:1px solid var(--caynt-accent)}
