.qr-app{--qr-ink:#172b3e;--qr-accent:#1758c6;--qr-pale:#eef4ff;color:var(--qr-ink);max-width:1100px;margin:0 auto;font:16px/1.6 system-ui,sans-serif;overflow-wrap:anywhere}.qr-app *{box-sizing:border-box}.qr-app h1{font-size:clamp(2rem,5vw,3.6rem);letter-spacing:-.045em;line-height:1.1;margin:.5em 0}.qr-app h2{font-size:1.4rem;line-height:1.3}.qr-app .eyebrow{font-size:.8rem;font-weight:800;letter-spacing:.16em;color:#1758c6}.qr-app .intro{max-width:760px;color:#45586b}.qr-app .qr-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin:28px 0}.qr-app .panel{border:1px solid #cbd6e5;border-radius:24px;padding:24px;background:white;min-width:0}.qr-app .create-panel{background:var(--qr-pale)}.qr-app label{display:block;font-weight:650;margin:14px 0 5px}.qr-app input:not([type=checkbox]),.qr-app textarea,.qr-app select{display:block;width:100%;padding:12px;border:1px solid #8294aa;border-radius:10px;background:#fff;color:#172b3e;font:inherit;min-height:48px}.qr-app textarea{resize:vertical;min-height:110px}.qr-app input[type=checkbox]{width:20px;height:20px;vertical-align:middle;margin-right:8px}.qr-app button,.qr-app .qr-button{border:1px solid #1758c6;background:#1758c6;color:white;border-radius:12px;min-height:48px;padding:10px 17px;font:650 1rem/1.4 system-ui;cursor:pointer;display:inline-block;text-align:center;text-decoration:none}.qr-app button.secondary{background:#fff;color:#174da3}.qr-app button:disabled{opacity:.5;cursor:default}.qr-app .actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.qr-app .preview{display:grid;place-items:center;margin:22px 0;background:white;border-radius:14px;min-height:240px}.qr-app canvas{max-width:100%;height:auto;image-rendering:pixelated}.qr-app video{width:100%;max-height:320px;background:#172b3e;border-radius:12px}.qr-app .note{font-size:.9rem;color:#45586b}.qr-app .warning{border-left:4px solid #c56500;padding:10px 14px;background:#fff2d6;color:#563000}.qr-app .result{white-space:pre-wrap;overflow-wrap:anywhere;background:#f4f7fb;padding:16px;border-radius:12px;max-height:280px;overflow:auto;user-select:text}.qr-app .status{min-height:1.6em;color:#9e241c;font-weight:600}.qr-app .library-item{padding:16px 0;border-bottom:1px solid #d4dce7}.qr-app .library-item p{white-space:pre-wrap;max-height:100px;overflow:auto}.qr-app .library-item button{margin-right:8px}.qr-app article{max-width:780px;margin:48px auto}.qr-app article h2{margin-top:2em}.qr-app a{color:#164caa}.qr-app :focus-visible{outline:3px solid #b45b00;outline-offset:3px}.qr-app [hidden]{display:none!important}.qr-app .lang{display:flex;gap:8px;justify-content:flex-end}.qr-app .lang a{padding:6px 10px;border:1px solid #adbed5;border-radius:8px;text-decoration:none}.qr-native{background:#f7f9fc;margin:0;padding:20px}.qr-native .qr-app h1{font-size:2rem}.qr-native .qr-grid{display:block}.qr-native .panel{margin:16px 0;padding:18px}.qr-native article{margin-top:24px}@media(max-width:700px){.qr-app .qr-grid{grid-template-columns:1fr}.qr-app .panel{padding:18px}.qr-app h1{font-size:2.4rem}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.qr-app#qr-guide{max-width:780px;margin:64px auto}.qr-app#qr-guide section{margin:36px 0}.qr-app#qr-guide h2{margin-bottom:12px}.qr-app#qr-guide>h2{font-size:2rem;line-height:1.2;margin-bottom:36px}

.qr-app canvas{display:block;width:100%;max-width:380px;height:auto;aspect-ratio:1/1}.qr-app .preview{min-height:0;padding:12px}