:root{
  --qr-navy:#06183a;
  --qr-navy-2:#0c2858;
  --qr-yellow:#f6c928;
  --qr-yellow-soft:#fff8d4;
  --qr-ink:#17233a;
  --qr-muted:#637087;
  --qr-line:#dde3eb;
  --qr-soft:#f6f8fb;
  --qr-white:#ffffff;
  --qr-success:#157347;
  --qr-warning:#8a6200;
  --qr-danger:#a52a22;
  --qr-shadow:0 22px 60px rgba(6,24,58,.11);
}
*{box-sizing:border-box}
.qr-page{background:#f6f8fb;color:var(--qr-ink)}
.qr-page button,.qr-page input,.qr-page select,.qr-page textarea{font:inherit}
.qr-page button,.qr-page a,.qr-page input,.qr-page select,.qr-page label{transition:color .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.qr-shell{width:min(1420px,calc(100% - 38px));margin-inline:auto}
.qr-main{min-height:70vh}

.qr-studio-header{padding:34px 0 20px;background:linear-gradient(180deg,#fff 0,#f6f8fb 100%);border-bottom:1px solid #e7ebf1}
.qr-studio-topbar{display:flex;justify-content:space-between;align-items:center;gap:24px}
.qr-studio-brand{display:flex;align-items:center;gap:15px;min-width:0}
.qr-studio-brand img{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 7px 12px rgba(6,24,58,.12))}
.qr-studio-brand p{margin:0 0 2px;color:#8b6c00;font-size:.68rem;font-weight:900;letter-spacing:.13em}
.qr-studio-brand h1{margin:0;color:var(--qr-navy);font-size:clamp(1.55rem,2.7vw,2.25rem);line-height:1.1}
.qr-studio-brand span{display:block;margin-top:5px;color:var(--qr-muted);font-size:.8rem}
.qr-top-actions{display:flex;align-items:center;gap:9px;position:relative}
.qr-help-btn,.qr-reset-btn{min-height:41px;border:1px solid #cfd7e3;border-radius:999px;background:#fff;color:var(--qr-navy);font-weight:850;font-size:.78rem;padding:0 16px;cursor:pointer}
.qr-help-btn{display:flex;align-items:center;gap:8px}
.qr-help-btn>span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--qr-yellow);color:var(--qr-navy);font-weight:950}
.qr-help-btn:hover,.qr-help-btn:focus-visible{transform:translateY(-2px);background:var(--qr-yellow);border-color:var(--qr-yellow);box-shadow:0 12px 26px rgba(196,150,0,.2)}
.qr-help-btn:hover>span,.qr-help-btn:focus-visible>span{background:var(--qr-navy);color:#fff}
.qr-reset-btn:hover,.qr-reset-btn:focus-visible{transform:translateY(-2px);background:var(--qr-navy);border-color:var(--qr-navy);color:#fff;box-shadow:0 12px 26px rgba(6,24,58,.18)}
.qr-help-wrap{position:relative}
.qr-help-menu{position:absolute;z-index:50;right:0;top:calc(100% + 10px);width:min(320px,calc(100vw - 28px));padding:14px;border:1px solid #d8dee8;border-radius:16px;background:#fff;box-shadow:0 24px 60px rgba(6,24,58,.18)}
.qr-help-menu[hidden]{display:none}
.qr-help-menu>strong{display:block;padding:4px 7px 10px;color:var(--qr-navy);font-size:.84rem}
.qr-help-menu button,.qr-help-menu a{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:9px;width:100%;padding:10px 8px;border:0;border-top:1px solid #edf0f4;background:transparent;color:var(--qr-ink);text-align:left;text-decoration:none;cursor:pointer}
.qr-help-menu button span,.qr-help-menu a span{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--qr-yellow-soft);color:#725400;font-weight:900}
.qr-help-menu i{font-style:normal;font-size:.76rem;line-height:1.35}
.qr-help-menu button:hover,.qr-help-menu a:hover{background:#f8fafc;color:var(--qr-navy);padding-left:12px}
.qr-private-note{display:flex;align-items:center;gap:8px;margin:17px 0 0;color:var(--qr-muted);font-size:.76rem}
.qr-private-note span{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#e9f7ef;color:var(--qr-success);font-weight:900}

.qr-workspace-section{padding:24px 0 76px}
.qr-library-warning{display:none;margin:0 0 14px;padding:13px 15px;border:1px solid #e0bb50;border-radius:12px;background:#fff8da;color:#6d4c00;font-size:.82rem;font-weight:700}
.qr-library-warning.is-visible{display:block}
.qr-studio{display:grid;grid-template-columns:218px minmax(390px,1fr) 390px;min-height:690px;border:1px solid #d9e0e9;border-radius:24px;background:#fff;box-shadow:var(--qr-shadow);overflow:visible}

.qr-step-nav{display:flex;flex-direction:column;padding:23px 13px 17px;background:var(--qr-navy);border-radius:23px 0 0 23px;color:#fff}
.qr-step-nav-title{padding:1px 11px 20px;border-bottom:1px solid rgba(255,255,255,.13);margin-bottom:10px}
.qr-step-nav-title small{display:block;color:#f1d45e;font-size:.62rem;font-weight:900;letter-spacing:.14em}
.qr-step-nav-title strong{display:block;margin-top:5px;font-size:1.18rem}
.qr-step-button{display:grid;grid-template-columns:36px 1fr 16px;align-items:center;gap:10px;width:100%;padding:12px 10px;border:0;border-radius:13px;background:transparent;color:#c9d7ee;text-align:left;cursor:pointer;position:relative}
.qr-step-button+.qr-step-button{margin-top:3px}
.qr-step-number{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.18);border-radius:11px;background:rgba(255,255,255,.06);color:#fff;font-weight:900;font-size:.75rem}
.qr-step-button strong{display:block;color:inherit;font-size:.82rem}
.qr-step-button small{display:block;margin-top:2px;color:#8fa4c3;font-size:.66rem}
.qr-step-button i{font-style:normal;opacity:0;transform:translateX(-5px)}
.qr-step-button:hover,.qr-step-button:focus-visible{background:rgba(255,255,255,.09);color:#fff;transform:translateX(3px)}
.qr-step-button:hover i,.qr-step-button:focus-visible i{opacity:1;transform:translateX(0)}
.qr-step-button.is-active{background:var(--qr-yellow);color:var(--qr-navy);box-shadow:0 11px 24px rgba(0,0,0,.18)}
.qr-step-button.is-active small{color:#5f4b00}
.qr-step-button.is-active .qr-step-number{border-color:var(--qr-navy);background:var(--qr-navy);color:#fff}
.qr-step-button.is-complete:not(.is-active) .qr-step-number{border-color:#50b983;background:#e9f8f0;color:var(--qr-success);font-size:0}
.qr-step-button.is-complete:not(.is-active) .qr-step-number::after{content:"✓";font-size:.82rem}
.qr-nav-signature{display:flex;align-items:center;gap:8px;margin-top:auto;padding:17px 9px 3px;border-top:1px solid rgba(255,255,255,.13)}
.qr-nav-signature img{width:30px;height:30px}
.qr-nav-signature strong{display:block;color:#fff;font-size:.69rem}
.qr-nav-signature small{display:block;margin-top:2px;color:#8fa4c3;font-size:.58rem}

.qr-editor{padding:34px 38px 38px;min-width:0}
.qr-editor-heading{padding-bottom:22px;border-bottom:1px solid var(--qr-line)}
.qr-editor-heading p{margin:0 0 8px;color:#8b6c00;font-size:.67rem;font-weight:900;letter-spacing:.12em}
.qr-editor-heading h2{margin:0;color:var(--qr-navy);font-size:clamp(1.45rem,2vw,2rem);line-height:1.2}
.qr-editor-heading span{display:block;margin-top:8px;color:var(--qr-muted);font-size:.82rem;line-height:1.55}
.qr-step-panel{display:none;padding-top:27px;animation:qrPanelIn .24s ease}
.qr-step-panel.is-active{display:block}
@keyframes qrPanelIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.qr-field{min-width:0}
.qr-field-wide{max-width:680px}
.qr-field label{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;color:var(--qr-navy);font-size:.78rem;font-weight:850}
.qr-field label em{font-style:normal;color:var(--qr-muted);font-size:.66rem;font-weight:700}
.qr-field input:not([type=color]):not([type=range]):not([type=file]),.qr-field select,.qr-field textarea{width:100%;min-height:48px;padding:11px 13px;border:1px solid #cfd7e2;border-radius:12px;background:#fff;color:var(--qr-ink);outline:none;font-size:.86rem}
.qr-field textarea{min-height:112px;resize:vertical;line-height:1.55}
.qr-field input:focus,.qr-field select:focus,.qr-field textarea:focus{border-color:#c49a00;box-shadow:0 0 0 4px rgba(246,201,40,.2)}
.qr-field input:hover,.qr-field select:hover,.qr-field textarea:hover{border-color:#9eacc0}
.qr-field-help{display:block;margin-top:7px;color:var(--qr-muted);font-size:.7rem;line-height:1.5}
.qr-inline-error{margin:7px 0 0;color:var(--qr-danger);font-size:.7rem;font-weight:750}
.qr-search-select{position:relative}
.qr-search-select>span{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#6a7890;font-size:1.2rem;pointer-events:none}
.qr-search-select input{padding-left:43px!important;padding-right:42px!important;font-weight:750}
.qr-search-select>b{position:absolute;right:14px;top:50%;transform:translateY(-53%);color:var(--qr-navy);font-size:1rem;pointer-events:none}
.qr-selection-summary{display:flex;align-items:center;gap:13px;margin-top:25px;padding:17px 0;border-top:1px solid var(--qr-line);border-bottom:1px solid var(--qr-line)}
.qr-selection-summary>span{display:grid;place-items:center;width:43px;height:43px;border-radius:13px;background:var(--qr-yellow);color:var(--qr-navy);font-size:1.15rem;font-weight:900}
.qr-selection-summary strong{display:block;color:var(--qr-navy);font-size:.86rem}
.qr-selection-summary small{display:block;margin-top:4px;color:var(--qr-muted);font-size:.72rem;line-height:1.45}
.qr-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 18px}
.qr-dynamic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 17px}
.qr-dynamic-grid .full{grid-column:1/-1}
.qr-colour-control{display:grid;grid-template-columns:48px 1fr;align-items:center;border:1px solid #cfd7e2;border-radius:12px;overflow:hidden;background:#fff}
.qr-colour-control:focus-within{border-color:#c49a00;box-shadow:0 0 0 4px rgba(246,201,40,.2)}
.qr-colour-control input[type=color]{width:48px;height:48px;padding:0;border:0;border-right:1px solid #dbe1e9;background:#fff;cursor:pointer}
.qr-colour-control input[type=text]{min-height:46px!important;border:0!important;border-radius:0!important;box-shadow:none!important;text-transform:uppercase;font-weight:800}
.qr-contrast-note{display:flex;gap:11px;align-items:center;margin-top:24px;padding:14px 0;border-top:1px solid var(--qr-line);border-bottom:1px solid var(--qr-line)}
.qr-contrast-note>span{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:#e8f7ef;color:var(--qr-success);font-weight:950}
.qr-contrast-note strong{display:block;color:var(--qr-navy);font-size:.77rem}
.qr-contrast-note small{display:block;margin-top:3px;color:var(--qr-muted);font-size:.69rem}
.qr-contrast-note.is-warning>span{background:#fff4d2;color:var(--qr-warning)}
.qr-contrast-note.is-warning strong{color:#785300}
.qr-file-line{display:grid!important;grid-template-columns:42px 1fr auto;align-items:center!important;gap:12px!important;min-height:76px;padding:12px 14px;border:1px dashed #acb9ca;border-radius:14px;background:#fafbfd;cursor:pointer}
.qr-file-line:hover,.qr-file-line:focus-within{border-color:#b68e00;background:var(--qr-yellow-soft);transform:translateY(-2px);box-shadow:0 12px 24px rgba(6,24,58,.08)}
.qr-file-line>span:first-child{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--qr-navy);color:#fff;font-size:1.25rem}
.qr-file-line strong{display:block;color:var(--qr-navy);font-size:.8rem}
.qr-file-line small{display:block;margin-top:4px;color:var(--qr-muted);font-size:.67rem;font-weight:600}
.qr-file-line b{padding:8px 12px;border-radius:999px;background:var(--qr-yellow);color:var(--qr-navy);font-size:.68rem}
.qr-hidden-file{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}
.qr-logo-controls{margin-top:23px;padding-top:23px;border-top:1px solid var(--qr-line)}
.qr-logo-controls[hidden]{display:none}
.qr-logo-preview{display:grid;place-items:center;width:96px;height:96px;margin-bottom:20px;border:1px solid #d7dee8;border-radius:16px;background:linear-gradient(135deg,#f7f9fc,#fff);overflow:hidden}
.qr-logo-preview img{max-width:78px;max-height:78px;object-fit:contain}
.qr-field input[type=range]{width:100%;accent-color:var(--qr-yellow);cursor:pointer}
.qr-field output{color:#806000;font-size:.69rem}
.qr-text-button{margin-top:18px;padding:0;border:0;background:transparent;color:var(--qr-danger);font-size:.73rem;font-weight:800;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.qr-text-button:hover{color:#6f1611}
.qr-logo-tip,.qr-download-tip{display:flex;gap:9px;margin:23px 0 0;padding:13px 0;border-top:1px solid var(--qr-line);color:var(--qr-muted);font-size:.71rem;line-height:1.55}
.qr-logo-tip span{display:grid;place-items:center;flex:0 0 22px;height:22px;border-radius:50%;background:#eaf0f8;color:var(--qr-navy);font-weight:900}
.qr-download-ready{display:flex;align-items:center;gap:13px;padding:17px 0;border-bottom:1px solid var(--qr-line)}
.qr-download-ready>span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#e9f8f0;color:var(--qr-success);font-weight:950;font-size:1rem}
.qr-download-ready strong{display:block;color:var(--qr-navy);font-size:.86rem}
.qr-download-ready small{display:block;margin-top:4px;color:var(--qr-muted);font-size:.71rem;line-height:1.45}
.qr-download-choice{display:grid;grid-template-columns:1fr auto;align-items:end;gap:14px;margin-top:24px}
.qr-primary-download{min-height:48px;padding:0 20px;border:1px solid var(--qr-yellow);border-radius:12px;background:var(--qr-yellow);color:var(--qr-navy);font-size:.8rem;font-weight:900;cursor:pointer;white-space:nowrap}
.qr-primary-download:hover,.qr-primary-download:focus-visible{transform:translateY(-3px);background:var(--qr-navy);border-color:var(--qr-navy);color:#fff;box-shadow:0 15px 28px rgba(6,24,58,.2)}
.qr-download-tip strong{color:var(--qr-navy)}

.qr-preview-panel{border-left:1px solid var(--qr-line);background:#fafbfd;border-radius:0 23px 23px 0}
.qr-preview-inner{position:sticky;top:82px;padding:27px 25px 25px}
.qr-mobile-preview-toggle{display:none}
.qr-preview-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.qr-preview-heading p{margin:0 0 4px;color:#8b6c00;font-size:.62rem;font-weight:900;letter-spacing:.12em}
.qr-preview-heading h2{margin:0;color:var(--qr-navy);font-size:1.15rem}
.qr-preview-status{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border-radius:999px;background:#e9f8f0;color:var(--qr-success);font-size:.64rem;font-weight:850;white-space:nowrap}
.qr-preview-status i{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(21,115,71,.12)}
.qr-preview-status.is-waiting{background:#fff3ca;color:#795600}
.qr-code-stage{display:grid;place-items:center;min-height:342px;margin-top:20px;padding:25px;border:1px solid #dce2ea;border-radius:20px;background:#fff;position:relative;overflow:hidden}
.qr-code-stage::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 12%,rgba(246,201,40,.14),transparent 28%),linear-gradient(135deg,transparent 49.5%,rgba(6,24,58,.025) 50%,transparent 50.5%);background-size:auto,18px 18px;pointer-events:none}
#qrCodeMount{display:grid;place-items:center;width:260px;height:260px;position:relative;z-index:1}
#qrCodeMount canvas,#qrCodeMount svg{max-width:100%;max-height:100%;border-radius:10px}
.qr-preview-brand{position:absolute;z-index:2;left:16px;bottom:13px;display:flex;align-items:center;gap:5px;color:#637087;font-size:.54rem;font-weight:900;letter-spacing:.08em}
.qr-preview-brand img{width:20px;height:20px}
.qr-preview-content{padding:15px 2px 14px;border-bottom:1px solid var(--qr-line)}
.qr-preview-content small{display:block;color:#8b6c00;font-size:.6rem;font-weight:900;letter-spacing:.1em}
.qr-preview-content strong{display:block;margin-top:5px;color:var(--qr-navy);font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qr-preview-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:9px;margin-top:15px}
.qr-preview-actions button{min-height:43px;border:1px solid #cbd4e1;border-radius:11px;background:#fff;color:var(--qr-navy);font-size:.73rem;font-weight:850;cursor:pointer}
.qr-preview-actions button:hover,.qr-preview-actions button:focus-visible{transform:translateY(-2px);background:var(--qr-navy);border-color:var(--qr-navy);color:#fff;box-shadow:0 11px 22px rgba(6,24,58,.16)}
.qr-preview-actions .is-primary{background:var(--qr-yellow);border-color:var(--qr-yellow)}
.qr-preview-actions .is-primary:hover,.qr-preview-actions .is-primary:focus-visible{background:var(--qr-navy);border-color:var(--qr-navy)}
.qr-preview-checks{display:grid;gap:7px;margin:17px 0 0;padding:0;list-style:none}
.qr-preview-checks li{display:flex;align-items:center;gap:8px;color:var(--qr-muted);font-size:.66rem}
.qr-preview-checks li span{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#e9f8f0;color:var(--qr-success);font-weight:900}
.qr-preview-checks li.is-waiting span{background:#fff3ca;color:#795600}
.qr-preview-checks li.is-danger span{background:#fde9e7;color:var(--qr-danger)}
.qr-test-result{margin-top:12px;padding:11px 12px;border-left:3px solid var(--qr-yellow);background:#fff;color:var(--qr-muted);font-size:.68rem;line-height:1.5;word-break:break-word}
.qr-test-result[hidden]{display:none}
.qr-test-result strong{display:block;color:var(--qr-navy);margin-bottom:3px}
.qr-test-result a{display:inline-block;margin-top:7px;color:#6e5300;font-weight:850}
.qr-toast{position:fixed;z-index:12000;left:50%;bottom:28px;transform:translate(-50%,24px);max-width:min(520px,calc(100% - 28px));padding:12px 17px;border-radius:12px;background:var(--qr-navy);color:#fff;box-shadow:0 18px 45px rgba(0,0,0,.26);opacity:0;pointer-events:none;transition:.22s ease;font-size:.79rem;font-weight:750}
.qr-toast.is-visible{opacity:1;transform:translate(-50%,0)}
.qr-toast.success{background:#11643e}.qr-toast.error{background:#9e231c}.qr-toast.warning{background:#795600}

@media(max-width:1180px){
  .qr-studio{grid-template-columns:196px minmax(360px,1fr) 340px}
  .qr-editor{padding:30px 28px 34px}
  .qr-preview-inner{padding:24px 20px}
  #qrCodeMount{width:225px;height:225px}
  .qr-code-stage{min-height:305px}
}
@media(max-width:960px){
  .qr-studio{grid-template-columns:170px 1fr}
  .qr-preview-panel{grid-column:1/-1;grid-row:1;border-left:0;border-bottom:1px solid var(--qr-line);border-radius:23px 23px 0 0}
  .qr-preview-inner{position:relative;top:auto;display:grid;grid-template-columns:auto minmax(220px,1fr) auto;align-items:center;gap:18px;padding:18px 22px}
  .qr-preview-heading{grid-column:1/-1}
  .qr-code-stage{grid-column:1;grid-row:2/6;min-height:auto;width:190px;margin:0;padding:15px}
  #qrCodeMount{width:155px;height:155px}
  .qr-preview-content{grid-column:2;align-self:end}
  .qr-preview-actions{grid-column:2;align-self:start;margin-top:0}
  .qr-preview-checks{grid-column:3;grid-row:2/5;margin:0;min-width:145px}
  .qr-test-result{grid-column:2/4;margin:0}
  .qr-step-nav{grid-column:1;grid-row:2;border-radius:0 0 0 23px}
  .qr-editor{grid-column:2;grid-row:2}
}
@media(max-width:760px){
  .qr-shell{width:min(100% - 18px,1420px)}
  .qr-studio-header{padding:22px 0 16px}
  .qr-studio-topbar{align-items:flex-start}
  .qr-studio-brand img{width:46px;height:46px}
  .qr-studio-brand p{font-size:.56rem}
  .qr-studio-brand h1{font-size:1.35rem}
  .qr-studio-brand span{font-size:.68rem}
  .qr-reset-btn{display:none}
  .qr-help-btn{min-height:38px;padding:0 12px;font-size:.7rem}
  .qr-private-note{font-size:.68rem}
  .qr-workspace-section{padding:14px 0 55px}
  .qr-studio{display:flex;flex-direction:column;min-height:0;border-radius:19px;overflow:visible}
  .qr-preview-panel{order:1;position:sticky;top:63px;z-index:30;border-radius:18px 18px 0 0;box-shadow:0 12px 28px rgba(6,24,58,.12)}
  .qr-mobile-preview-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:42px;padding:0 15px;border:0;border-bottom:1px solid var(--qr-line);border-radius:18px 18px 0 0;background:#fff;color:var(--qr-navy);font-size:.72rem;font-weight:900;cursor:pointer}
  .qr-mobile-preview-toggle i{font-style:normal;transition:transform .2s ease}
  .qr-preview-inner{display:grid;grid-template-columns:104px 1fr;gap:11px;padding:12px 14px;background:#fafbfd}
  .qr-preview-heading{display:none}
  .qr-code-stage{grid-column:1;grid-row:1/4;width:104px;min-height:104px;padding:8px;border-radius:13px}
  #qrCodeMount{width:88px;height:88px}
  .qr-preview-brand{display:none}
  .qr-preview-content{grid-column:2;padding:4px 0 8px}
  .qr-preview-actions{grid-column:2;grid-template-columns:1fr 1fr;gap:6px;margin:0}
  .qr-preview-actions button{min-height:36px;font-size:.63rem}
  .qr-preview-checks,.qr-test-result{display:none}
  .qr-preview-panel.is-expanded .qr-preview-inner{grid-template-columns:150px 1fr;padding:15px}
  .qr-preview-panel.is-expanded .qr-code-stage{width:150px;min-height:150px}
  .qr-preview-panel.is-expanded #qrCodeMount{width:130px;height:130px}
  .qr-preview-panel.is-expanded .qr-test-result{display:block;grid-column:1/-1}
  .qr-preview-panel.is-compact .qr-preview-inner{grid-template-columns:76px 1fr;padding:8px 12px}
  .qr-preview-panel.is-compact .qr-code-stage{width:76px;min-height:76px;padding:6px}
  .qr-preview-panel.is-compact #qrCodeMount{width:64px;height:64px}
  .qr-preview-panel.is-compact .qr-preview-content{padding:0 0 4px}
  .qr-preview-panel.is-compact .qr-preview-actions button{min-height:31px}
  .qr-preview-panel.is-compact .qr-mobile-preview-toggle i{transform:rotate(180deg)}
  .qr-step-nav{order:2;display:flex;flex-direction:row;gap:5px;overflow-x:auto;padding:10px;border-radius:0;background:var(--qr-navy);scrollbar-width:none}
  .qr-step-nav::-webkit-scrollbar{display:none}
  .qr-step-nav-title,.qr-nav-signature{display:none}
  .qr-step-button{flex:0 0 auto;display:flex;gap:7px;width:auto;padding:8px 10px;border-radius:10px}
  .qr-step-button+.qr-step-button{margin-top:0}
  .qr-step-button span:nth-child(2) small,.qr-step-button i{display:none}
  .qr-step-number{width:27px;height:27px;border-radius:8px;font-size:.65rem}
  .qr-step-button strong{font-size:.7rem}
  .qr-editor{order:3;padding:24px 18px 29px}
  .qr-editor-heading{padding-bottom:17px}
  .qr-editor-heading p{font-size:.59rem}
  .qr-editor-heading h2{font-size:1.35rem}
  .qr-editor-heading span{font-size:.73rem}
  .qr-step-panel{padding-top:21px}
  .qr-form-grid,.qr-dynamic-grid{grid-template-columns:1fr;gap:17px}
  .qr-dynamic-grid .full{grid-column:auto}
  .qr-download-choice{grid-template-columns:1fr}
  .qr-primary-download{width:100%}
}
@media(max-width:430px){
  .qr-studio-brand span{display:none}
  .qr-help-btn{font-size:0;padding:0 8px}
  .qr-help-btn>span{font-size:.73rem}
  .qr-private-note{align-items:flex-start}
  .qr-preview-inner{grid-template-columns:90px 1fr}
  .qr-code-stage{width:90px;min-height:90px}
  #qrCodeMount{width:76px;height:76px}
  .qr-preview-content strong{font-size:.67rem}
  .qr-preview-actions{grid-template-columns:1fr}
  .qr-preview-actions button:first-child{display:none}
  .qr-step-button{padding:7px 9px}
  .qr-step-button strong{font-size:.66rem}
  .qr-editor{padding-inline:15px}
}
@media(prefers-reduced-motion:reduce){.qr-page *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}


/* Search-friendly supporting content kept below the focused builder. */
.qr-seo-section{padding:clamp(68px,8vw,108px) 0;background:linear-gradient(180deg,#f7faff,#fff);border-top:1px solid rgba(8,55,120,.1)}.qr-seo-heading{max-width:790px;margin-bottom:34px}.qr-seo-heading h2{margin:12px 0;color:#062f70;font-size:clamp(2rem,4.6vw,3.55rem);line-height:1.08}.qr-seo-heading>p:last-child{color:#5b6b82;line-height:1.75}.qr-seo-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:46px;padding:30px 0;border-top:1px solid rgba(8,55,120,.13);border-bottom:1px solid rgba(8,55,120,.13)}.qr-seo-layout article{background:transparent!important;border:0!important;box-shadow:none!important}.qr-seo-layout h3,.qr-seo-faq h3{margin:0 0 15px;color:#07366f}.qr-seo-layout :is(ul,ol){margin:0;padding-left:22px;color:#53647b}.qr-seo-layout li+li{margin-top:10px}.qr-seo-faq{padding-top:34px}.qr-seo-faq details{border-bottom:1px solid rgba(8,55,120,.13)}.qr-seo-faq summary{padding:17px 0;color:#09396f;font-weight:900;cursor:pointer}.qr-seo-faq p{margin:0;padding:0 0 18px;color:#5b6c82;line-height:1.7}.qr-related-tools{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}.qr-related-tools a{padding:10px 14px;border-radius:999px;text-decoration:none;background:#eaf2ff;color:#07458f;font-weight:850;transition:transform .25s ease,background .25s ease}.qr-related-tools a:hover{transform:translateY(-3px);background:#facc15;color:#062d67}@media(max-width:760px){.qr-seo-layout{grid-template-columns:1fr;gap:28px}}

/* QR Poster Studio refinement — 2026-07-29 */
.qr-studio{grid-template-columns:210px minmax(380px,1fr) 370px;min-height:760px}
.qr-step-button{padding-block:10px}

/* Reliable searchable QR type combobox */
.qr-combobox{z-index:25}
.qr-combobox>button{position:absolute;right:4px;top:4px;bottom:4px;width:42px;border:0;border-left:1px solid #e2e7ee;border-radius:0 9px 9px 0;background:#fff;color:var(--qr-navy);cursor:pointer}
.qr-combobox>button:hover,.qr-combobox>button:focus-visible{background:var(--qr-yellow-soft);color:var(--qr-navy)}
.qr-combobox>button b{display:block;font-size:1rem;transition:transform .2s ease}
.qr-combobox.is-open>button b{transform:rotate(180deg)}
.qr-type-list{position:absolute;z-index:80;left:0;right:0;top:calc(100% + 8px);max-height:360px;margin:0;padding:7px;border:1px solid #cfd7e2;border-radius:15px;background:#fff;box-shadow:0 24px 55px rgba(6,24,58,.18);overflow-y:auto;list-style:none}
.qr-type-list[hidden]{display:none}
.qr-type-list li[data-type-key]{display:grid;grid-template-columns:38px minmax(0,1fr) 20px;align-items:center;gap:11px;padding:10px;border-radius:11px;color:var(--qr-ink);cursor:pointer}
.qr-type-list li[data-type-key]+li[data-type-key]{border-top:1px solid #edf0f4}
.qr-type-list li[data-type-key]>span{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#f2f5f9;color:var(--qr-navy);font-weight:900}
.qr-type-list li[data-type-key] strong{display:block;color:var(--qr-navy);font-size:.78rem}
.qr-type-list li[data-type-key] small{display:block;margin-top:3px;color:var(--qr-muted);font-size:.65rem;line-height:1.35}
.qr-type-list li[data-type-key] i{font-style:normal;color:var(--qr-success);font-weight:900}
.qr-type-list li[data-type-key]:hover,.qr-type-list li[data-type-key].is-active{background:var(--qr-yellow-soft);transform:translateX(3px)}
.qr-type-list li[data-type-key]:hover>span,.qr-type-list li[data-type-key].is-active>span{background:var(--qr-yellow)}
.qr-type-empty{padding:18px 13px;color:var(--qr-muted);font-size:.74rem;line-height:1.5}

/* Poster text controls */
.qr-poster-controls{display:grid;gap:0}
.qr-toggle-group{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:15px 0;border-bottom:1px solid var(--qr-line)}
.qr-toggle-group:first-child{padding-top:0}
.qr-toggle-copy strong{display:block;color:var(--qr-navy);font-size:.8rem}
.qr-toggle-copy small{display:block;margin-top:4px;color:var(--qr-muted);font-size:.68rem;line-height:1.45}
.qr-poster-text-field{padding:18px 0 21px;border-bottom:1px solid var(--qr-line)}
.qr-poster-text-field.is-disabled{opacity:.52}
.qr-poster-text-field.is-disabled input{background:#f1f3f6}
.qr-switch{display:flex!important;justify-content:flex-start!important;align-items:center!important;gap:8px!important;margin:0!important;cursor:pointer;white-space:nowrap}
.qr-switch input{position:absolute;opacity:0;pointer-events:none}
.qr-switch span{position:relative;width:44px;height:24px;border-radius:999px;background:#bdc7d5;box-shadow:inset 0 0 0 1px rgba(6,24,58,.08)}
.qr-switch span::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(6,24,58,.28);transition:transform .2s ease}
.qr-switch input:checked+span{background:var(--qr-yellow)}
.qr-switch input:checked+span::after{transform:translateX(20px);background:var(--qr-navy)}
.qr-switch input:focus-visible+span{box-shadow:0 0 0 4px rgba(246,201,40,.25)}
.qr-switch b{color:var(--qr-navy);font-size:.67rem}
.qr-brand-toggle{border-bottom:0;padding-bottom:0}

/* Compact premium portrait preview */
.qr-preview-inner{padding:25px 23px}
.qr-poster-stage{display:grid;place-items:center;margin-top:17px;padding:18px;border:1px solid #dce3ec;border-radius:20px;background:linear-gradient(145deg,#edf2f8,#fafbfd);overflow:hidden}
.qr-poster-sheet{position:relative;display:flex;flex-direction:column;align-items:center;width:min(100%,258px);aspect-ratio:210/297;padding:26px 22px 21px;border:1px solid #d7dee8;border-radius:14px;background:#fff;box-shadow:0 15px 35px rgba(6,24,58,.13);overflow:hidden}
.qr-poster-sheet::before{content:"";width:48px;height:4px;margin-bottom:15px;border-radius:999px;background:var(--qr-yellow);flex:0 0 auto}
.qr-poster-top,.qr-poster-bottom{width:100%;margin:0;color:var(--qr-navy);text-align:center;overflow-wrap:anywhere}
.qr-poster-top{min-height:39px;font-size:.72rem;font-weight:850;line-height:1.35}
.qr-poster-bottom{min-height:30px;margin-top:11px;font-size:.65rem;font-weight:780;line-height:1.35}
.qr-poster-website{margin-top:auto;color:#6c788b;font-size:.48rem;font-weight:850;letter-spacing:.04em}
.qr-poster-sheet .qr-code-stage{display:grid!important;place-items:center!important;flex:1 1 auto;width:100%!important;min-height:0!important;margin:6px 0 0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;overflow:visible!important}
.qr-poster-sheet .qr-code-stage::before{display:none!important}
.qr-poster-sheet #qrCodeMount{width:190px;height:190px}
.qr-poster-sheet.without-top .qr-code-stage{margin-top:18px!important}
.qr-poster-sheet.without-bottom .qr-code-stage{margin-bottom:8px!important}
.qr-poster-sheet [hidden]{display:none!important}
.qr-preview-content{padding-top:13px}

/* Poster and QR-only downloads */
.qr-poster-download-choice{align-items:end}
.qr-secondary-download-row{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:20px;padding:17px 0;border-top:1px solid var(--qr-line);border-bottom:1px solid var(--qr-line)}
.qr-secondary-download-row strong{display:block;color:var(--qr-navy);font-size:.78rem}
.qr-secondary-download-row small{display:block;margin-top:4px;color:var(--qr-muted);font-size:.68rem;line-height:1.45}
.qr-secondary-download{min-height:42px;padding:0 16px;border:1px solid #cbd4e1;border-radius:11px;background:#fff;color:var(--qr-navy);font-size:.72rem;font-weight:850;cursor:pointer;white-space:nowrap}
.qr-secondary-download:hover,.qr-secondary-download:focus-visible{transform:translateY(-2px);border-color:var(--qr-navy);background:var(--qr-navy);color:#fff;box-shadow:0 12px 23px rgba(6,24,58,.16)}

@media(max-width:1180px){
  .qr-studio{grid-template-columns:190px minmax(350px,1fr) 330px}
  .qr-poster-sheet{width:min(100%,230px);padding:22px 18px 18px}
  .qr-poster-sheet #qrCodeMount{width:168px;height:168px}
}
@media(max-width:960px) and (min-width:761px){
  .qr-poster-stage{grid-column:1;grid-row:2/6;width:205px;margin:0;padding:10px}
  .qr-poster-sheet{width:180px;padding:15px 13px 12px;border-radius:10px}
  .qr-poster-sheet::before{width:34px;height:3px;margin-bottom:7px}
  .qr-poster-top{min-height:26px;font-size:.48rem}
  .qr-poster-bottom{min-height:18px;margin-top:4px;font-size:.42rem}
  .qr-poster-website{font-size:.34rem}
  .qr-poster-sheet #qrCodeMount{width:125px;height:125px}
}
@media(max-width:760px){
  .qr-poster-stage{grid-column:1;grid-row:1/4;width:104px;margin:0;padding:5px;border-radius:12px}
  .qr-poster-sheet{width:92px;padding:7px 6px 6px;border-radius:7px;box-shadow:0 6px 14px rgba(6,24,58,.12)}
  .qr-poster-sheet::before{width:19px;height:2px;margin-bottom:3px}
  .qr-poster-top{min-height:13px;font-size:.25rem;line-height:1.25}
  .qr-poster-bottom{min-height:9px;margin-top:2px;font-size:.22rem;line-height:1.2}
  .qr-poster-website{font-size:.17rem}
  .qr-poster-sheet #qrCodeMount{width:66px;height:66px}
  .qr-preview-panel.is-expanded .qr-poster-stage{width:150px;padding:8px}
  .qr-preview-panel.is-expanded .qr-poster-sheet{width:134px;padding:10px 9px 8px}
  .qr-preview-panel.is-expanded .qr-poster-sheet::before{width:28px;height:3px;margin-bottom:5px}
  .qr-preview-panel.is-expanded .qr-poster-top{min-height:20px;font-size:.36rem}
  .qr-preview-panel.is-expanded .qr-poster-bottom{min-height:13px;margin-top:3px;font-size:.31rem}
  .qr-preview-panel.is-expanded .qr-poster-website{font-size:.24rem}
  .qr-preview-panel.is-expanded .qr-poster-sheet #qrCodeMount{width:96px;height:96px}
  .qr-preview-panel.is-compact .qr-poster-stage{width:76px;padding:4px}
  .qr-preview-panel.is-compact .qr-poster-sheet{width:68px;padding:5px 4px 4px}
  .qr-preview-panel.is-compact .qr-poster-top,.qr-preview-panel.is-compact .qr-poster-bottom,.qr-preview-panel.is-compact .qr-poster-website,.qr-preview-panel.is-compact .qr-poster-sheet::before{display:none}
  .qr-preview-panel.is-compact .qr-poster-sheet #qrCodeMount{width:58px;height:58px}
  .qr-secondary-download-row{align-items:flex-start;flex-direction:column}
  .qr-secondary-download{width:100%}
}
@media(max-width:430px){
  .qr-poster-stage{width:90px}
  .qr-poster-sheet{width:79px}
  .qr-poster-sheet #qrCodeMount{width:57px;height:57px}
  .qr-preview-actions button:first-child{display:none}
}