.qrcg-wrap{font-family:var(--qrcg-font,system-ui,sans-serif);color:var(--qrcg-text,#172033);max-width:680px;margin:28px auto}
.qrcg-wrap *{box-sizing:border-box}
.qrcg-panel{background:var(--qrcg-bg,#fff);border-radius:var(--qrcg-radius,16px);padding:clamp(22px,4vw,36px);box-shadow:0 18px 55px rgba(15,23,42,.09);border:1px solid rgba(148,163,184,.18)}
.qrcg-style-minimal .qrcg-panel{box-shadow:none;border-color:transparent;padding:20px 0}
.qrcg-style-outlined .qrcg-panel{box-shadow:none;border:2px solid var(--qrcg-primary)}
.qrcg-heading{text-align:center;margin-bottom:26px}
.qrcg-kicker{display:inline-block;color:var(--qrcg-primary);font-size:11px;font-weight:800;letter-spacing:.14em;margin-bottom:10px}
.qrcg-heading h2{font-size:clamp(23px,4vw,30px);line-height:1.2;margin:0 0 9px;color:var(--qrcg-text);font-weight:750}
.qrcg-heading p{margin:0;color:#64748b;font-size:14px;line-height:1.6}
.qrcg-label{display:block;font-weight:700;font-size:13px;margin:0 0 9px}
.qrcg-input-row{display:flex;gap:10px}
.qrcg-input{flex:1;min-width:0;min-height:48px;border:1px solid #dbe2ea!important;border-radius:11px!important;padding:0 14px!important;background:#fff!important;color:#172033!important;font:inherit!important;font-size:14px!important;box-shadow:none!important}
.qrcg-input:focus{outline:2px solid color-mix(in srgb,var(--qrcg-primary) 22%,transparent);border-color:var(--qrcg-primary)!important}
.qrcg-generate,.qrcg-download,.qrcg-reset{border:0;border-radius:11px;padding:0 18px;min-height:48px;background:var(--qrcg-primary);color:#fff;font:inherit;font-size:13px;font-weight:750;cursor:pointer;transition:transform .15s,opacity .15s}
.qrcg-generate:hover,.qrcg-download:hover{opacity:.9;transform:translateY(-1px)}
.qrcg-error{color:#b91c1c;font-size:13px;margin-top:9px}
.qrcg-result{margin-top:25px;text-align:center;padding-top:22px;border-top:1px solid #e8edf3}
.qrcg-qr-frame{display:inline-flex;align-items:center;justify-content:center;padding:13px;background:#fff;border:1px solid #e5eaf0;border-radius:15px;min-height:100px;min-width:100px}
.qrcg-qr img,.qrcg-qr canvas{display:block;max-width:100%;height:auto}
.qrcg-result-title{font-weight:750;margin:14px 0;color:var(--qrcg-text);font-size:15px}
.qrcg-result-actions{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}
.qrcg-download{min-height:42px}
.qrcg-reset{min-height:42px;background:#eef2f7;color:#334155}
.qrcg-footnote{text-align:center;color:#94a3b8;font-size:11px;margin-top:19px}
@media(max-width:540px){.qrcg-input-row{flex-direction:column}.qrcg-generate{width:100%}.qrcg-panel{padding:22px 17px}}

.qrcg-type{display:block;width:100%;min-height:48px;margin:0 0 16px;padding:0 13px;border:1px solid #dbe2ea;border-radius:11px;background:#fff;color:#172033;font:inherit;font-size:14px}
.qrcg-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-bottom:16px}
.qrcg-field{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:700;color:var(--qrcg-text)}
.qrcg-field-control{width:100%;min-height:44px;padding:10px 12px;border:1px solid #dbe2ea;border-radius:10px;background:#fff;color:#172033;font:inherit;font-size:14px}
.qrcg-field-control:focus,.qrcg-type:focus{outline:2px solid color-mix(in srgb,var(--qrcg-primary) 22%,transparent);border-color:var(--qrcg-primary)}
.qrcg-field textarea.qrcg-field-control{min-height:76px;resize:vertical}
.qrcg-checkbox-field{flex-direction:row;align-items:center;gap:9px}
.qrcg-checkbox-field input{width:17px;height:17px}
.qrcg-input-row .qrcg-generate{width:100%}
@media(max-width:540px){.qrcg-fields{grid-template-columns:1fr}}

/* Colorful UI/UX refresh */
.qrcg-wrap{isolation:isolate}
.qrcg-panel{position:relative;overflow:hidden;background:var(--qrcg-bg,#fff);border:1px solid rgba(148,163,184,.22);box-shadow:0 22px 65px rgba(15,23,42,.11)}
.qrcg-panel:before{content:"";position:absolute;inset:0 0 auto;height:6px;background:linear-gradient(90deg,var(--qrcg-primary),#8b5cf6,#06b6d4)}
.qrcg-heading{position:relative}
.qrcg-kicker{padding:7px 12px;border-radius:999px;background:color-mix(in srgb,var(--qrcg-primary) 10%,white);letter-spacing:.12em}
.qrcg-heading h2{letter-spacing:-.035em}
.qrcg-heading p{max-width:460px;margin-left:auto;margin-right:auto}
.qrcg-type{appearance:none;padding-right:42px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364758b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;box-shadow:0 3px 10px rgba(15,23,42,.035)}
.qrcg-type:focus,.qrcg-field-control:focus,.qrcg-input:focus{box-shadow:0 0 0 4px color-mix(in srgb,var(--qrcg-primary) 12%,transparent)!important}
.qrcg-field{gap:8px}
.qrcg-field span{line-height:1.35}
.qrcg-field-control{transition:border-color .15s,box-shadow .15s}
.qrcg-generate,.qrcg-download{background:linear-gradient(135deg,var(--qrcg-primary),color-mix(in srgb,var(--qrcg-primary) 72%,#7c3aed));box-shadow:0 7px 16px color-mix(in srgb,var(--qrcg-primary) 24%,transparent)}
.qrcg-generate:focus-visible,.qrcg-download:focus-visible,.qrcg-reset:focus-visible{outline:3px solid color-mix(in srgb,var(--qrcg-primary) 35%,white);outline-offset:3px}
.qrcg-generate:active,.qrcg-download:active,.qrcg-reset:active{transform:translateY(1px)}
.qrcg-result{border-top:1px solid color-mix(in srgb,var(--qrcg-primary) 15%,#e8edf3);animation:qrcg-pop .25s ease-out}
.qrcg-qr-frame{background:var(--qrcg-qr-bg,#fff);border:1px solid color-mix(in srgb,var(--qrcg-primary) 20%,#e5eaf0);box-shadow:0 12px 30px rgba(15,23,42,.08)}
.qrcg-qr img,.qrcg-qr canvas{border-radius:3px}
.qrcg-reset{border:1px solid #e2e8f0}
.qrcg-error{padding:9px 11px;border-radius:9px;background:#fef2f2}
.qrcg-style-minimal .qrcg-panel:before{display:none}
@keyframes qrcg-pop{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.qrcg-result{animation:none}.qrcg-generate,.qrcg-download,.qrcg-reset{transition:none}}

/* Advanced design, bulk generation and local history */
.qrcg-design-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0;padding:14px;border:1px solid #e5eaf0;border-radius:13px;background:#f8fafc}
.qrcg-design-tools label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700;color:#334155}
.qrcg-design-tools input[type=color]{width:100%;height:36px;border:1px solid #dbe2ea;border-radius:8px;background:#fff;padding:3px}
.qrcg-design-tools input[type=range]{width:100%;accent-color:var(--qrcg-primary)}
.qrcg-logo-label{grid-column:1/-1}
.qrcg-design-tools input[type=file]{max-width:100%;font-size:12px}
.qrcg-print,.qrcg-bulk-generate,.qrcg-clear-history{border:1px solid #dbe2ea;border-radius:10px;padding:10px 15px;background:#f1f5f9;color:#334155;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.qrcg-bulk-tools,.qrcg-history{margin-top:22px;padding-top:18px;border-top:1px solid #e8edf3}
.qrcg-bulk-tools h3,.qrcg-history h3{margin:0 0 7px;font-size:16px;color:var(--qrcg-text)}
.qrcg-bulk-tools p{margin:0 0 10px;color:#64748b;font-size:12px}
.qrcg-bulk-input{width:100%;padding:12px;border:1px solid #dbe2ea;border-radius:10px;font:inherit;font-size:13px}
.qrcg-bulk-generate{margin-top:10px;background:var(--qrcg-primary);color:#fff;border:0}
.qrcg-bulk-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px;margin-top:14px}
.qrcg-bulk-card{padding:12px;border:1px solid #e5eaf0;border-radius:12px;text-align:center;overflow:hidden}
.qrcg-bulk-card p{overflow-wrap:anywhere;min-height:30px}
.qrcg-bulk-qr{display:flex;justify-content:center;margin:8px auto}
.qrcg-bulk-qr canvas,.qrcg-bulk-qr img{max-width:100%;height:auto}
.qrcg-bulk-card button{min-height:35px;padding:5px 10px;font-size:11px}
.qrcg-history-list{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}
.qrcg-history-item{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid #dbe2ea;background:#fff;border-radius:999px;padding:7px 11px;font-size:11px;cursor:pointer;color:#334155}
.qrcg-history{font-size:12px;color:#64748b}
@media(max-width:540px){.qrcg-design-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.qrcg-logo-label{grid-column:1/-1}}