/* Noluvio QR studio: same visual tokens and mobile-first utility pattern. */
.qr-hero{background:radial-gradient(circle at 82% 20%,#1dbdac70,transparent 37%),linear-gradient(120deg,#08182e,#103657)}
.qr-hero-art{min-height:320px;display:grid;place-items:center}
.qr-hero-frame{width:min(360px,90%);padding:20px;border:1px solid #4c8fad;border-radius:22px;background:#09203b;box-shadow:0 30px 75px #06192f90;transform:rotate(3deg)}
.qr-hero-top{display:flex;justify-content:space-between;gap:10px;font-size:10px;font-weight:800;letter-spacing:.11em;color:#b8dcee}
.qr-live-dot{color:#69f4c7}
.qr-hero-pixels{margin:24px auto 16px;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:14px;aspect-ratio:1;background:#fff;padding:22px;position:relative;overflow:hidden;max-width:260px;border-radius:12px}
.qr-hero-finder{display:block;width:100%;height:100%;border:14px solid #10243c;position:relative;background:#fff;z-index:1}
.qr-hero-finder:after{content:"";position:absolute;inset:25%;background:#10243c}
.qr-hero-finder:nth-child(3){grid-column:1;grid-row:2}
.qr-hero-squares{grid-column:2;grid-row:2;background:repeating-conic-gradient(#10243c 0% 25%,#fff 0% 50%) 50% / 31px 31px}
.qr-hero-caption{color:#b8dcee;font-size:11px;letter-spacing:.1em;text-align:center;font-weight:750}
.qr-form .field textarea{width:100%;min-height:96px;resize:vertical;line-height:1.6;overflow-wrap:anywhere}
.qr-form .field select,.qr-form .field textarea{border:1px solid #b9cddf;border-radius:9px;padding:12px;background:#fff;color:#193b55;min-width:0}
.qr-button-stack{display:grid;gap:10px;margin-top:24px}
.qr-download{min-height:52px;border:1px solid #96cae9;background:#e9f6ff;color:#07538c;border-radius:11px;padding:11px 20px;font-size:13px;font-weight:850;cursor:pointer}
.qr-download:hover{background:#d7edff}
.qr-download:disabled{color:#71899b;background:#eef3f8;border-color:#dae4ed;cursor:not-allowed}
.qr-stage{min-height:325px;display:grid;place-items:center;background:linear-gradient(135deg,#e9f4fb,#f7fbfd);border-radius:13px;padding:clamp(15px,3vw,30px);overflow:hidden}
.qr-stage canvas{display:block;max-width:min(100%,440px);height:auto;box-shadow:0 12px 31px #24466025;border:1px solid #c9dbe9}
.qr-stage canvas[hidden]{display:none}
.qr-stage .utility-placeholder[hidden]{display:none}
.qr-preview-details{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.qr-preview-details>div{background:#f2f8fc;border:1px solid #d9e7f1;border-radius:10px;padding:15px}
.qr-preview-details strong{display:block;font-size:12px;color:#173953}
.qr-preview-details small{display:block;font-size:11px;line-height:1.6;color:#607f95;margin-top:6px}
.qr-form textarea:focus-visible,.qr-form select:focus-visible,.qr-download:focus-visible{outline:3px solid #00a9ff;outline-offset:3px}
html[dir=rtl] .qr-hero-frame{transform:rotate(-3deg)}
@media(max-width:760px){.qr-hero-art{min-height:230px}.qr-hero-frame{max-width:315px;transform:none}.qr-hero-pixels{max-width:194px;padding:15px;gap:9px}.qr-hero-finder{border-width:10px}.qr-preview-details{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.qr-hero-frame{transform:none!important}}
@media print{.qr-hero,.qr-form,.qr-result .utility-panel-head,.qr-preview-details,.qr-result .utility-inline-upgrade,.utility-guide,.utility-faq,.utility-upsell,.utility-ar{display:none!important}.qr-stage{min-height:0;padding:0;background:#fff}.qr-stage canvas{width:85mm;max-width:100%;margin:0 auto;box-shadow:none}}