#qrgn *{box-sizing:border-box;margin:0;padding:0}#qrgn{font-family:var(--font-sarabun), system-ui, sans-serif;color:var(--ink)}#qrgn .qrgn-shell{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-lg);grid-template-columns:1fr;display:grid}#qrgn .qrgn-panel{padding:clamp(20px,3vw,30px)}#qrgn .qrgn-block+.qrgn-block{border-top:1px solid var(--line);margin-top:26px;padding-top:24px}#qrgn .qrgn-step{font-family:var(--font-anuphan), system-ui, sans-serif;align-items:center;gap:9px;margin-bottom:14px;font-size:1rem;font-weight:700;display:flex}#qrgn .qrgn-step-num{background:var(--brand-l);width:24px;height:24px;color:var(--brand-dd);border-radius:50%;place-items:center;font-size:.78rem;display:grid}#qrgn .qrgn-type-select{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);width:100%;padding:13px;font-family:inherit;font-size:1rem;display:block}#qrgn .qrgn-types{display:none}#qrgn .qrgn-type{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:11px 6px;font-family:inherit;transition:all .15s;display:flex}#qrgn .qrgn-type:hover{border-color:var(--brand);background:var(--bg)}#qrgn .qrgn-type.is-active{border-color:var(--brand);background:var(--brand-l);box-shadow:0 0 0 3px #0d94881f}#qrgn .qrgn-type-icon{font-size:1.35rem;line-height:1}#qrgn .qrgn-type-label{font-family:var(--font-anuphan), system-ui, sans-serif;color:var(--ink);white-space:nowrap;font-size:.83rem;font-weight:600}#qrgn .qrgn-type-hint{color:var(--sub);border-left:3px solid var(--brand-l);margin-bottom:14px;padding-left:11px;font-size:.83rem}#qrgn label{color:var(--sub);margin-bottom:5px;font-size:.83rem;font-weight:500;display:block}#qrgn .qrgn-field label+input,#qrgn .qrgn-field label+textarea,#qrgn .qrgn-field label+select{margin-bottom:12px}#qrgn .qrgn-field>:last-child{margin-bottom:0}#qrgn input,#qrgn textarea,#qrgn select{width:100%;font-family:var(--font-sarabun), system-ui, sans-serif;color:var(--ink);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);outline:none;padding:12px 14px;font-size:1rem;transition:all .15s}#qrgn input:focus,#qrgn textarea:focus,#qrgn select:focus{border-color:var(--brand);box-shadow:0 0 0 3px #0d948824}#qrgn .qrgn-note{color:var(--sub);margin-top:8px;font-size:.8rem;line-height:1.6}#qrgn .qrgn-note code{background:var(--bg);border-radius:5px;padding:1px 5px}#qrgn .qrgn-presets{flex-wrap:wrap;gap:8px;margin-bottom:18px;display:flex}#qrgn .qrgn-preset{font-family:var(--font-anuphan), system-ui, sans-serif;border:1px solid var(--line);background:var(--surface);color:var(--sub);cursor:pointer;border-radius:999px;align-items:center;gap:7px;padding:8px 14px 8px 9px;font-size:.85rem;font-weight:600;transition:all .15s;display:inline-flex}#qrgn .qrgn-preset:hover{border-color:var(--brand)}#qrgn .qrgn-preset.is-active{border-color:var(--brand);color:var(--brand-dd);background:var(--brand-l)}#qrgn .qrgn-preset-dot{border-radius:6px;flex:none;width:18px;height:18px;display:inline-block}#qrgn .qrgn-frames{grid-template-columns:repeat(5,1fr);gap:7px;margin-bottom:14px;display:grid}#qrgn .qrgn-frame{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);cursor:pointer;font-family:var(--font-anuphan), system-ui, sans-serif;color:var(--sub);flex-direction:column;align-items:center;gap:6px;padding:9px 4px;font-size:.74rem;font-weight:600;transition:all .15s;display:flex}#qrgn .qrgn-frame:hover{border-color:var(--brand)}#qrgn .qrgn-frame.is-active{border-color:var(--brand);background:var(--brand-l);color:var(--brand-dd)}#qrgn .qrgn-frame-ico{background:var(--line);border-radius:4px;flex:none;width:26px;height:30px;position:relative}#qrgn .qrgn-frame-ico--none{background:var(--line);height:26px}#qrgn .qrgn-frame-ico--border{border:2px solid var(--sub);background:0 0;height:26px}#qrgn .qrgn-frame-ico--label-bottom{border:2px solid var(--sub);background:0 0}#qrgn .qrgn-frame-ico--label-bottom:after{content:"";background:var(--sub);border-radius:0 0 4px 4px;height:9px;position:absolute;bottom:-2px;left:-2px;right:-2px}#qrgn .qrgn-frame-ico--label-top{background:0 0}#qrgn .qrgn-frame-ico--label-top:before{content:"";background:var(--sub);border-radius:999px;width:16px;height:7px;position:absolute;top:0;left:50%;transform:translate(-50%)}#qrgn .qrgn-frame-ico--label-top:after{content:"";border:2px solid var(--sub);border-radius:4px;position:absolute;inset:11px 0 0}#qrgn .qrgn-frame-ico--bubble-bottom{background:0 0}#qrgn .qrgn-frame-ico--bubble-bottom:before{content:"";background:var(--sub);border-radius:999px;width:16px;height:7px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}#qrgn .qrgn-frame-ico--bubble-bottom:after{content:"";border:2px solid var(--sub);border-radius:4px;position:absolute;inset:0 0 11px}#qrgn .qrgn-frame-ico--pocket{border:2px solid var(--sub);background:0 0;overflow:hidden}#qrgn .qrgn-frame-ico--pocket:after{content:"";background:var(--sub);height:14px;position:absolute;bottom:-2px;left:-2px;right:-2px;-webkit-mask-image:radial-gradient(68% 6px at 50% 0,#0000 99%,#000 100%);mask-image:radial-gradient(68% 6px at 50% 0,#0000 99%,#000 100%)}#qrgn .qrgn-frame-ico--card{background:var(--sub)}#qrgn .qrgn-frame-ico--card:after{content:"";background:#fff;border-radius:2px;position:absolute;inset:3px 3px 11px}#qrgn .qrgn-frame-text{margin-bottom:16px}#qrgn .qrgn-canvas-wrap{--f-color:#111827;--f-pad:15px;--f-radius:12px;--f-border-w:11px;--f-bubble-h:79px;--f-bubble-r:20px;--f-bubble-pad-x:35px;--f-bubble-fs:44px;--f-tail-w:37px;--f-tail-h:25px;--f-gap:11px;padding:var(--f-pad);border-radius:var(--r-md);background:#fff;margin-bottom:18px;transition:all .15s;overflow:hidden;box-shadow:0 18px 40px -18px #0009}#qrgn .qrgn-bar{font-family:var(--font-anuphan), system-ui, sans-serif;letter-spacing:.01em;color:#fff;background:var(--f-color);text-align:center;margin:0 calc(var(--f-pad) * -1);text-overflow:ellipsis;white-space:nowrap;padding:12px 10px;font-size:clamp(1.05rem,4vw,1.3rem);font-weight:700;line-height:1.4;display:none;overflow:hidden}#qrgn .qrgn-box{display:contents}#qrgn .qrgn-tail,#qrgn .qrgn-pocket{display:none}#qrgn .qrgn-pocket path{fill:var(--f-color)}#qrgn .qrgn-canvas-wrap[data-frame=border],#qrgn .qrgn-canvas-wrap[data-frame=label-bottom]{border:2px solid var(--f-color)}#qrgn .qrgn-canvas-wrap[data-frame=label-bottom] .qrgn-bar--bottom{margin-top:var(--f-pad);margin-bottom:calc(var(--f-pad) * -1);display:block}#qrgn .qrgn-canvas-wrap[data-frame=label-top],#qrgn .qrgn-canvas-wrap[data-frame=bubble-bottom]{box-shadow:none;text-align:center;background:0 0;border-radius:0;padding:0;overflow:visible}#qrgn .qrgn-canvas-wrap[data-frame=label-top] .qrgn-bar--top,#qrgn .qrgn-canvas-wrap[data-frame=bubble-bottom] .qrgn-bar--bottom{height:var(--f-bubble-h);line-height:var(--f-bubble-h);padding:0 var(--f-bubble-pad-x);border-radius:var(--f-bubble-r);font-size:var(--f-bubble-fs);margin:0;display:block}#qrgn .qrgn-canvas-wrap[data-frame=label-top] .qrgn-tail--top,#qrgn .qrgn-canvas-wrap[data-frame=bubble-bottom] .qrgn-tail--bottom{border-left:calc(var(--f-tail-w) / 2) solid transparent;border-right:calc(var(--f-tail-w) / 2) solid transparent;width:0;height:0;margin:0 auto;display:block}#qrgn .qrgn-canvas-wrap[data-frame=label-top] .qrgn-tail--top{margin-bottom:var(--f-gap);border-top:var(--f-tail-h) solid var(--f-color)}#qrgn .qrgn-canvas-wrap[data-frame=bubble-bottom] .qrgn-tail--bottom{margin-top:var(--f-gap);border-bottom:var(--f-tail-h) solid var(--f-color)}#qrgn .qrgn-canvas-wrap[data-frame=label-top] .qrgn-box,#qrgn .qrgn-canvas-wrap[data-frame=bubble-bottom] .qrgn-box{padding:var(--f-pad);border:var(--f-border-w) solid var(--f-color);border-radius:var(--f-radius);background:#fff;display:block;box-shadow:0 18px 40px -18px #0009}#qrgn .qrgn-canvas-wrap[data-frame=pocket]{position:relative}#qrgn .qrgn-canvas-wrap[data-frame=pocket] .qrgn-pocket{width:100%;height:var(--f-pocket-h);display:block;position:absolute;bottom:0;left:0;right:0}#qrgn .qrgn-canvas-wrap[data-frame=pocket] .qrgn-bar--bottom{z-index:1;height:var(--f-pocket-h);padding:var(--f-pocket-dip) 10px 0;line-height:calc(var(--f-pocket-h) - var(--f-pocket-dip));margin-top:var(--f-gap);margin-bottom:calc(var(--f-pad) * -1);background:0 0;display:block;position:relative}#qrgn .qrgn-canvas-wrap[data-frame=card]{background:var(--f-color)}#qrgn .qrgn-canvas-wrap[data-frame=card] #qrgn-canvas{background:#fff;border-radius:6px}#qrgn .qrgn-canvas-wrap[data-frame=card] .qrgn-bar--bottom{background:0 0;margin:0;padding-top:12px;padding-bottom:0;display:block}#qrgn .qrgn-advanced summary{font-family:var(--font-anuphan), system-ui, sans-serif;color:var(--brand-d);cursor:pointer;padding:6px 0;font-size:.9rem;font-weight:600}#qrgn .qrgn-advanced[open] summary{margin-bottom:14px}#qrgn .qrgn-advanced>label{margin-top:16px}#qrgn .qrgn-row{align-items:flex-end;gap:12px;display:flex}#qrgn .qrgn-col{flex:1}#qrgn input[type=color]{cursor:pointer;height:44px;padding:4px}#qrgn .qrgn-col-check{flex-direction:column;gap:6px;display:flex}#qrgn .qrgn-switch{color:var(--ink);cursor:pointer;align-items:center;gap:6px;margin:0;font-size:.83rem;font-weight:500;display:flex}#qrgn .qrgn-switch input{width:auto}#qrgn .qrgn-swatches{gap:8px;margin-bottom:4px;display:flex}#qrgn .qrgn-sw{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);cursor:pointer;justify-content:center;align-items:center;width:46px;height:46px;transition:all .15s;display:flex}#qrgn .qrgn-sw:hover{border-color:var(--brand)}#qrgn .qrgn-sw.is-active{border-color:var(--brand);box-shadow:0 0 0 3px #0d948824}#qrgn .sw-square{background:var(--ink);width:20px;height:20px}#qrgn .sw-rounded{background:var(--ink);border-radius:6px;width:20px;height:20px}#qrgn .sw-dots{background:var(--ink);border-radius:50%;width:20px;height:20px}#qrgn .sw-classy{background:var(--ink);border-radius:10px 2px;width:20px;height:20px}#qrgn .sw-c-square{border:4px solid var(--ink);width:22px;height:22px}#qrgn .sw-c-round{border:4px solid var(--ink);border-radius:8px;width:22px;height:22px}#qrgn .sw-c-dot{border:4px solid var(--ink);border-radius:50%;width:22px;height:22px}#qrgn .qrgn-logo{align-items:center;gap:10px;display:flex}#qrgn .qrgn-logo input[type=file]{padding:9px;font-size:.83rem}#qrgn .qrgn-logo-clear{font-family:var(--font-sarabun), system-ui, sans-serif;color:#b4304a;cursor:pointer;white-space:nowrap;background:0 0;border:none;font-size:.83rem;text-decoration:underline}#qrgn .qrgn-preview{background:linear-gradient(160deg, var(--hero-2), var(--hero-1));border-radius:var(--r-lg) var(--r-lg) 0 0;order:-1;justify-content:center;align-items:flex-start;padding:clamp(22px,3vw,30px);display:flex}#qrgn .qrgn-preview-inner{flex-direction:column;align-items:center;width:100%;max-width:320px;display:flex}#qrgn .qrgn-panel{border-radius:0 0 var(--r-lg) var(--r-lg)}#qrgn #qrgn-canvas{width:100%;max-width:var(--qr-preview);aspect-ratio:1;justify-content:center;align-items:center;height:auto;display:flex}#qrgn #qrgn-canvas canvas,#qrgn #qrgn-canvas svg{border-radius:6px;max-width:100%;height:auto}#qrgn .qrgn-empty{width:var(--qr-preview);aspect-ratio:1;text-align:center;border:2px dashed var(--line);background:#fff;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;gap:14px;max-width:100%;padding:18px;line-height:1.6;display:flex}#qrgn .qrgn-empty-ico{width:56px;height:56px;color:var(--sub);opacity:.28;flex:none}#qrgn .qrgn-empty-title{font-family:var(--font-anuphan), system-ui, sans-serif;color:var(--ink);font-size:1rem;font-weight:700}#qrgn .qrgn-empty-sub{color:var(--sub);margin-top:-8px;font-size:.84rem}#qrgn #qrgn-canvas[hidden],#qrgn .qrgn-empty[hidden]{display:none}#qrgn .qrgn-actions{gap:10px;width:100%;display:flex}#qrgn .qrgn-btn{font-family:var(--font-anuphan), system-ui, sans-serif;cursor:pointer;border-radius:var(--r-sm);border:1px solid #0000;flex:1;padding:13px 14px;font-size:.95rem;font-weight:600;transition:all .15s}#qrgn .qrgn-btn:disabled{opacity:.45;cursor:not-allowed}#qrgn .qrgn-btn-primary{background:var(--brand);color:#fff}#qrgn .qrgn-btn-primary:hover:not(:disabled){background:#14b8a6}#qrgn .qrgn-btn-ghost{color:var(--on-hero);background:0 0;border-color:#ffffff4d}#qrgn .qrgn-btn-ghost:hover:not(:disabled){background:#ffffff1a}#qrgn .qrgn-hint{color:var(--on-hero-sub);text-align:center;margin-top:14px;font-size:.76rem;line-height:1.6}#qrgn .qrgn-hint strong{color:var(--on-hero);font-weight:600;display:block}@media (width>=560px){#qrgn .qrgn-types{grid-template-columns:repeat(5,1fr);gap:7px;display:grid}#qrgn .qrgn-type-select{display:none}}@media (width>=900px){#qrgn .qrgn-shell{grid-template-columns:1.35fr 1fr}#qrgn .qrgn-preview{border-radius:0 var(--r-lg) var(--r-lg) 0;order:0}#qrgn .qrgn-panel{border-radius:var(--r-lg) 0 0 var(--r-lg)}#qrgn .qrgn-preview-inner{position:sticky;top:84px}}.hero[data-astro-cid-lcdefpme]{isolation:isolate;background:linear-gradient(165deg, var(--hero-2), var(--hero-1));color:var(--on-hero);text-align:center;padding:clamp(26px,4vw,44px) 0 clamp(66px,8vw,92px);position:relative;overflow:hidden}.hero[data-astro-cid-lcdefpme]:before{content:"";z-index:-2;opacity:.05;background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22160%22%20height%3D%22160%22%20viewBox%3D%220%200%20160%20160%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%3E%3Crect%20x%3D%2212%22%20y%3D%2212%22%20width%3D%2234%22%20height%3D%2234%22%20rx%3D%224%22%2F%3E%3Crect%20x%3D%2221%22%20y%3D%2221%22%20width%3D%2216%22%20height%3D%2216%22%20rx%3D%222%22%20fill%3D%22%23ffffff%22%20stroke%3D%22none%22%2F%3E%3Crect%20x%3D%22114%22%20y%3D%2212%22%20width%3D%2234%22%20height%3D%2234%22%20rx%3D%224%22%2F%3E%3Crect%20x%3D%22123%22%20y%3D%2221%22%20width%3D%2216%22%20height%3D%2216%22%20rx%3D%222%22%20fill%3D%22%23ffffff%22%20stroke%3D%22none%22%2F%3E%3Crect%20x%3D%2212%22%20y%3D%22114%22%20width%3D%2234%22%20height%3D%2234%22%20rx%3D%224%22%2F%3E%3Crect%20x%3D%2221%22%20y%3D%22123%22%20width%3D%2216%22%20height%3D%2216%22%20rx%3D%222%22%20fill%3D%22%23ffffff%22%20stroke%3D%22none%22%2F%3E%3C%2Fg%3E%3Cg%20fill%3D%22%23ffffff%22%3E%3Crect%20x%3D%2260%22%20y%3D%2214%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2276%22%20y%3D%2214%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2260%22%20y%3D%2230%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2292%22%20y%3D%2230%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%2260%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2230%22%20y%3D%2260%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2260%22%20y%3D%2260%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2292%22%20y%3D%2260%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%22124%22%20y%3D%2260%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%22140%22%20y%3D%2260%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%2292%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2246%22%20y%3D%2292%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2276%22%20y%3D%2292%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%22108%22%20y%3D%2292%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%22140%22%20y%3D%2292%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2260%22%20y%3D%22124%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2292%22%20y%3D%22124%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%22124%22%20y%3D%22124%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%2276%22%20y%3D%22140%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3Crect%20x%3D%22108%22%20y%3D%22140%22%20width%3D%228%22%20height%3D%228%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E);background-size:160px 160px;position:absolute;inset:0}.hero[data-astro-cid-lcdefpme]:after{content:"";z-index:-1;pointer-events:none;background:radial-gradient(#2dd4bf38,#0000 70%);width:min(900px,90%);height:320px;position:absolute;bottom:-140px;left:50%;transform:translate(-50%)}.hero__inner[data-astro-cid-lcdefpme]{max-width:720px;margin:0 auto}.hero[data-astro-cid-lcdefpme] h1[data-astro-cid-lcdefpme]{color:#fff;margin:12px 0 10px;font-size:clamp(1.7rem,1.15rem + 2.2vw,2.5rem)}.hero__lede[data-astro-cid-lcdefpme]{color:var(--on-hero-sub);max-width:620px;margin:0 auto;font-size:clamp(.98rem,.94rem + .25vw,1.1rem)}.tool-slot[data-astro-cid-lcdefpme]{z-index:2;margin-top:clamp(-70px,-6vw,-48px);position:relative}.trust[data-astro-cid-lcdefpme]{color:var(--sub);flex-wrap:wrap;justify-content:center;gap:8px 26px;margin:20px 0 0;padding:0;font-size:.88rem;list-style:none;display:flex}.trust[data-astro-cid-lcdefpme] li[data-astro-cid-lcdefpme]{align-items:center;gap:7px;display:flex}.trust[data-astro-cid-lcdefpme] li[data-astro-cid-lcdefpme]:before{content:"✓";color:var(--brand);font-weight:700}.ad-gap[data-astro-cid-lcdefpme]{border-top:1px solid var(--line);margin-top:44px;padding-top:8px}.card__link[data-astro-cid-lcdefpme]{margin-top:auto;font-size:.88rem;font-weight:500;text-decoration:none}.card__link[data-astro-cid-lcdefpme]:hover{text-decoration:underline}.type-grid[data-astro-cid-lcdefpme]{grid-template-columns:1fr;gap:18px 32px;margin:0;padding:0;list-style:none;display:grid}@media (width>=760px){.type-grid[data-astro-cid-lcdefpme]{grid-template-columns:repeat(2,1fr)}}.type-item[data-astro-cid-lcdefpme]{align-items:flex-start;gap:14px;display:flex}.type-item__icon[data-astro-cid-lcdefpme]{flex:none;font-size:1.5rem;line-height:1.3}.type-item__title[data-astro-cid-lcdefpme]{margin:0 0 4px;font-size:1rem}.type-item__desc[data-astro-cid-lcdefpme]{color:var(--sub);margin:0;font-size:.92rem}.type-cta[data-astro-cid-lcdefpme]{text-align:center;margin:36px 0 0}