.qrx{--qr-ink:#111;--qr-paper:#fff;--sh-entity:#1a7342;--sh-class:#1a7342;--sh-identifier:#303030;--sh-property:#303030;--sh-jsxliterals:#303030;--sh-keyword:#3c4bd5;--sh-string:#636363;--sh-sign:#9a9a9a;--sh-comment:#9a9a9a}.qrx .playground{flex-direction:column;align-items:center;display:flex}.qrx .stage{place-items:center;min-height:272px;display:grid}.qrx .qr-art{border-radius:22px;box-shadow:0 0 0 1px #0000000f,0 1px 2px #0000000a,0 8px 24px #0000000f}.qrx .qr-art .qr-logo>div{border-radius:0;overflow:visible}.qrx .boop{width:100%;height:100%;font:900 22px/.84 var(--font-rubik), sans-serif;letter-spacing:-.02em;grid-template-columns:repeat(2,auto);place-content:center;display:grid}.qrx .boop span{-webkit-text-stroke:2.4px #141414;paint-order:stroke fill;text-shadow:0 1.5px #141414}.qrx .b1{color:#5cbf62}.qrx .b2{color:#e690d6}.qrx .b3{color:#fde25a}.qrx .b4{color:#f6a54c}.qrx .controls{align-items:center;gap:8px;max-width:100%;margin-top:32px;display:flex}.qrx .segmented{scrollbar-width:none;background:#0000000d;border-radius:12px;gap:2px;padding:4px;display:flex;overflow-x:auto}.qrx .segmented::-webkit-scrollbar{display:none}.qrx .segmented-item{height:32px;color:var(--color-muted);border-radius:8px;flex-shrink:0;padding:0 12px;font-size:14px;font-weight:500;transition:background .15s,color .15s,box-shadow .15s}.qrx .segmented-item:hover{color:var(--color-black)}.qrx .segmented-item.is-on{background:var(--color-white);color:var(--color-black);box-shadow:0 1px 2px #0000000f,0 0 0 1px #0000000d}.qrx :is(.segmented-item,.replay,.code-tab,.code-copy,.code-more):focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.qrx .replay{background:var(--color-white);border:1px solid #0000000f;border-radius:12px;flex-shrink:0;place-items:center;width:40px;height:40px;display:grid}.qrx .replay svg{width:18px;height:18px}.qrx .replay:active svg{transition:transform .15s;transform:rotate(-40deg)}.qrx .amount{color:var(--color-muted);align-items:center;gap:12px;margin-top:16px;font-size:16px;display:flex}.qrx .amount-field{background:var(--color-white);height:40px;color:var(--color-black);border:1px solid #0000000f;border-radius:12px;align-items:center;gap:2px;padding:0 14px;font-weight:500;display:inline-flex}.qrx .amount-field input{background:0 0;border:0;outline:none;width:90px;font-weight:500}.qrx .amount-field:focus-within{border-color:var(--color-accent)}.qrx :not(pre)>code{font:.85em var(--font-geist-mono), ui-monospace, monospace;background:var(--color-placeholder);border-radius:6px;padding:2px 6px}.qrx .code{color:#000;background:#f2f2f2;border-radius:16px;padding:6px}.qrx .code-head{justify-content:space-between;align-items:center;gap:8px;padding:2px 4px 8px 2px;display:flex}.qrx .code-tabs{scrollbar-width:none;gap:4px;display:flex;overflow-x:auto}.qrx .code-tabs::-webkit-scrollbar{display:none}.qrx .code-tab{color:#636363;border-radius:8px;flex-shrink:0;height:32px;padding:0 12px;font-size:14px;font-weight:500}.qrx .code-tab.is-on{color:#000;background:#fff;box-shadow:0 1px 2px #0000000f}.qrx .code-copy{color:#636363;border-radius:10px;flex-shrink:0;place-items:center;width:34px;height:34px;display:grid}.qrx .code-copy:hover{color:#000;background:#e8e8e8}.qrx .code-copy svg{width:20px;height:20px}.qrx .code-body{background:#fff;border-radius:12px;position:relative;overflow:hidden;box-shadow:0 1px 2px #0000000d}.qrx .code-body pre{font:14px/1.7 var(--font-geist-mono), ui-monospace, monospace;tab-size:2;margin:0;padding:18px 20px;overflow-x:auto}.qrx .code-body.is-clipped pre{max-height:440px;overflow-y:hidden}.qrx .code-body.is-clipped:after{content:"";pointer-events:none;background:linear-gradient(#fff0,#fff 70%);height:110px;position:absolute;bottom:0;left:0;right:0}.qrx .code-more{z-index:1;background:#fff;border:1px solid #00000014;border-radius:999px;height:34px;padding:0 14px;font-size:14px;font-weight:500;position:absolute;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 1px 2px #0000000d}.qrx .code-body:not(.is-clipped) .code-more{margin:0 auto 16px;display:block;position:static;transform:none}@media (max-width:767px){.qrx .controls{flex-direction:column}.qrx .segmented{flex-wrap:wrap;justify-content:center;overflow:visible}}
