@font-face{font-family:Kai;src:url(fonts/Kai.ttf)}@font-face{font-family:Mali;src:url(fonts/Mali.woff2)}*{box-sizing:border-box}body{margin:0;background:#f1eee6;color:#343c31;font:21px/1.7 Kai,Mali,serif}main{max-width:1120px;margin:auto;padding:22px}h1{font-size:38px;font-weight:normal;line-height:1.4;margin:8px 0}header p{margin:6px 0}.intro{margin-top:12px}[lang=th]{font-family:Mali,sans-serif;font-size:17px;line-height:1.8}#steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:24px 0 12px}button{font:inherit;color:inherit;background:#faf9f4;border:1px solid #b8c3b0;border-radius:9px;min-height:44px;padding:10px 12px;cursor:pointer;max-width:100%}button:disabled{opacity:.45;cursor:default}button:focus-visible{outline:3px solid #a15b28;outline-offset:3px}#steps button{display:flex;flex-direction:column;align-items:flex-start;text-align:left}#steps button[aria-current=step]{border:2px solid #22574d;background:#e4ede2;padding:9px 11px}#steps small{display:block;color:#66735f;margin-top:4px}.note,footer{font-size:17px;color:#66735f}#module-host{min-height:420px}iframe{display:block;width:100%;height:720px;border:0;background:#f1eee6}iframe[aria-busy=true]{opacity:.65}.bottom-nav{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:20px 0}footer{border-top:1px solid #c9d0c0;padding-top:15px;margin-top:20px}footer p{margin:6px 0}@media(max-width:650px){main{padding:12px}h1{font-size:29px}#steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#steps button{font-size:20px}#steps small{font-size:15px}.bottom-nav button{font-size:17px}}

.usage-counter{margin:22px 0 4px;padding:12px 18px;background:#faf9f4;border:1px solid #cbd2c3;border-radius:10px}.usage-counter p{margin:3px 0}.usage-counter strong{font-size:30px;font-weight:normal;color:#22574d}.usage-counter #usage-note{font-size:16px;color:#66735f}