.qr-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:24px;padding:24px 0 64px;display:grid}.qr-left{flex-direction:column;display:flex}.qr-right{flex-direction:column;gap:24px;display:flex}.qr-colors{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;display:grid}.qr-preview-block{flex-direction:column;gap:12px;display:flex}.qr-preview{aspect-ratio:1;border:1px solid var(--ink);background:var(--bg);place-items:center;max-height:480px;padding:40px;display:grid;position:relative}.qr-svg{width:100%;max-width:360px;height:100%;max-height:360px}.qr-preview[data-stale=true] .qr-svg{opacity:.3}.qr-stale-tag{background:var(--ink);color:var(--surface);padding:6px 10px;position:absolute}.qr-empty{aspect-ratio:1;place-items:center;width:100%;max-width:360px;display:grid;position:relative}.qr-empty-pattern{background-image:linear-gradient(var(--surface-alt) 0 0), linear-gradient(var(--surface-alt) 0 0), linear-gradient(var(--surface-alt) 0 0);background-position:0 0,100% 0,0 100%;background-repeat:no-repeat;background-size:26% 26%;position:absolute;inset:0}.qr-empty-pattern:after{content:"";background:repeating-linear-gradient(90deg, var(--surface-alt) 0 10%, transparent 10% 20%);opacity:.8;position:absolute;inset:34%}.qr-empty p{border:1px solid var(--rule);background:var(--surface);text-align:center;max-width:220px;padding:12px 16px;font-size:14px;position:relative}.qr-encoded{border-bottom:1px solid var(--rule);flex-direction:column;gap:4px;padding-bottom:16px;display:flex}.qr-encoded-value{font-family:var(--font-mono);white-space:nowrap;text-overflow:ellipsis;font-size:14px;overflow:hidden}.qr-buttons{grid-template-columns:1fr 1fr;gap:12px;display:grid}.qr-download-status{min-height:24px;margin-top:10px}@media (width<=1023px){.qr-colors{grid-template-columns:minmax(0,1fr)}}@media (width<=767px){.qr-layout{flex-direction:column;align-items:stretch;gap:20px;padding-top:16px;display:flex}.qr-left,.qr-right{display:contents}.qr-preview-block{order:1}.qr-content{border:1px solid var(--rule);background:var(--surface);order:2}.qr-actions{order:3}.qr-style{border:1px solid var(--rule);background:var(--surface);order:4}.qr-ad{order:5}.qr-content,.qr-style{padding:16px}.qr-preview{padding:20px}.qr-buttons{grid-template-columns:minmax(0,1fr)}.qr-colors{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}@media (width<=359px){.qr-colors{grid-template-columns:minmax(0,1fr)}}
