@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@600;700;800&family=JetBrains+Mono:wght@400;500;700&family=Sarabun:wght@400;500;600;700&display=swap");
:root{--ink:#10272b;--paper:#f7f4ed;--accent:#d97706;--muted:#526568;--code-bg:#0b1f23;--code-fg:#fefcf7}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Sarabun,sans-serif;line-height:1.8}
header,footer{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1.25rem max(1rem,calc((100% - 56rem)/2));background:#071214;color:#f7f4ed}
header a,footer a{color:#fbbf24;text-decoration:none;font-weight:700}
.logo{font:800 1.2rem "Be Vietnam Pro",sans-serif;color:#f7f4ed}
.logo span{color:#fbbf24}
main{max-width:56rem;margin:0 auto;padding:4rem 1rem 5rem}
h1,h2,h3{font-family:"Be Vietnam Pro",Sarabun,sans-serif;line-height:1.3}
h1{font-size:clamp(2rem,5vw,3.3rem);margin-top:0}
h2{margin-top:2.5rem;border-bottom:2px solid #e5d9c5;padding-bottom:.4rem}
h3{margin-top:2rem}
a{color:#b45309}
blockquote{border-left:4px solid var(--accent);margin:1.5rem 0;padding:.5rem 1rem;background:#efe7d8;color:var(--ink)}
table{border-collapse:collapse;width:100%;display:block;overflow-x:auto}
th,td{border:1px solid #d8cdbb;padding:.55rem;text-align:left}
th{background:#eadfce}
code{font-family:"JetBrains Mono",Sarabun,monospace;background:#e9e2d5;padding:.1rem .3rem;border-radius:.2rem}
pre{overflow:auto;background:var(--code-bg);color:var(--code-fg);padding:1rem 1.1rem;border-radius:.4rem;border:1px solid #1f3a40;box-shadow:0 1px 0 rgba(0,0,0,.25) inset}
pre code{font-family:"JetBrains Mono",Sarabun,monospace;background:transparent;padding:0;color:inherit;font-weight:500;font-size:.95rem;line-height:1.7}
li{margin:.25rem 0}
footer{font-size:.9rem}