/* สไตล์ร่วมของห้องทดลอง แบบทดสอบ และสไลด์ ใช้ชุดเดียวกับหม้อเคี่ยวเพื่อรวมกันภายหลัง */
:root{--bg:#f4f5f4;--panel:#fff;--ink:#14191d;--dim:#5a646b;--line:#d9dddd;--steel:#10171c;--steel2:#1a242b;--amber:#d48b1f;--amber-text:#9a5f08;--on-dark:#f3f1ec;--dim-dark:#aab2b5;--green:#0f7a56;--green-soft:#dff3ea;--red:#b83d33;--red-soft:#fbe6e3;--blue:#1d6fb0;
 --sans:"IBM Plex Sans Thai","Leelawadee UI",Tahoma,sans-serif;--mono:"IBM Plex Mono",Consolas,monospace;color-scheme:light}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.65 var(--sans)}
a{color:inherit;text-decoration:none}h1,h2,h3{margin:0;line-height:1.28;font-weight:600;text-wrap:balance}button{font:inherit;color:inherit;cursor:pointer}
.wrap{max-width:1100px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.top{background:var(--steel);color:var(--on-dark)}.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px}.brand{font-weight:600}.brand span{color:var(--amber)}.topback{font-size:14px;color:var(--dim-dark)}.topback:hover{color:#fff}
.page{padding-block:30px 60px;display:grid;gap:18px}.kicker{font:500 13px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--amber-text)}
.page h1{font-size:clamp(28px,4.4vw,42px);font-weight:700;margin:6px 0 8px}.lead{margin:0;color:var(--dim);max-width:44em}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:20px}.note{border-left:3px solid var(--amber);background:#fbf5e8;padding:10px 14px;font-size:14px;color:#59410f;border-radius:0 6px 6px 0}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;border:1px solid var(--line);background:var(--panel);border-radius:6px;padding:10px 18px;font-weight:600;transition:transform .08s,background .15s,border-color .15s}.btn:hover{border-color:#8f979b}.btn:active{transform:scale(.97)}
.btn.primary{background:var(--amber);border-color:var(--amber);color:#17120a}.btn.primary:hover{background:#e39c30}.btn.dark{background:var(--steel);border-color:var(--steel);color:#fff}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}