.qr-intro{padding-bottom:32px}.qr-intro h1{max-width:20ch}.qr-intro .eyebrow{margin-top:28px}.qr-intro .case-lead{max-width:54ch}.qr-local{display:inline-block;background:var(--ink);color:var(--white);padding:8px 12px;font:700 11px/1.4 "Courier New",monospace;letter-spacing:.04em;margin-bottom:8px}
.qr-studio{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);gap:32px;align-items:start;padding-bottom:65px}.qr-form{min-width:0}.qr-panel{border:1px solid var(--ink);margin-bottom:16px;background:var(--white)}.qr-panel>summary{cursor:pointer;display:flex;gap:15px;align-items:center;padding:22px;font-size:23px;font-weight:700;letter-spacing:-.04em;list-style:none}.qr-panel>summary::-webkit-details-marker{display:none}.qr-panel>summary:after{content:'+';margin-left:auto;font:400 28px/1 "Courier New",monospace}.qr-panel[open]>summary:after{content:'−'}.qr-panel[open]>summary{border-bottom:1px solid var(--line)}.qr-section-number{font:700 12px/1 "Courier New",monospace;color:var(--muted);letter-spacing:0}.qr-panel-body{padding:24px}.qr-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px 16px}.qr-field{display:flex;flex-direction:column;gap:8px;min-width:0;font-size:12px;font-weight:700}.qr-field-wide{grid-column:1/-1}.qr-form input:not([type=radio]):not([type=checkbox]):not([type=color]):not([type=range]),.qr-form textarea,.qr-form select,.qr-export select{font:inherit;letter-spacing:normal;border:1px solid var(--ink);background:var(--white);color:var(--ink);padding:12px;width:100%;min-height:45px;border-radius:0}.qr-form input::placeholder,.qr-form textarea::placeholder{font-weight:400;color:#747474}.qr-form textarea{min-height:140px;resize:vertical}.qr-form :focus-visible,.qr-preview :focus-visible{outline:3px solid var(--orange);outline-offset:3px}.qr-subdetails{margin-top:22px}.qr-subdetails>summary{font-size:13px;font-weight:700;cursor:pointer;padding-block:8px}.qr-subdetails[open]>.qr-fields{margin-top:15px}.qr-note{font-size:12px;line-height:1.7;color:var(--muted);margin-top:14px}.qr-content-types{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--ink);margin-bottom:20px}.qr-content-types label{position:relative}.qr-content-types input,.qr-dot-choice input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer}.qr-content-types span{display:block;text-align:center;font-size:12px;font-weight:700;padding:13px 6px;border-right:1px solid var(--ink)}.qr-content-types label:last-child span{border-right:0}.qr-content-types input:checked+span{background:var(--ink);color:var(--white)}.qr-content-types input:focus-visible+span,.qr-dot-choice input:focus-visible+span{outline:3px solid var(--orange);outline-offset:-3px}.qr-dot-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:22px;border:0;padding:0;min-width:0}.qr-dot-choices legend{font-size:12px;font-weight:700;margin-bottom:12px}.qr-dot-choice{position:relative;min-width:0}.qr-dot-choice>span{display:flex;flex-direction:column;align-items:center;gap:12px;border:1px solid var(--line);padding:16px 5px;font-size:11px;font-weight:700;min-height:110px}.qr-dot-choice input:checked+span{border:2px solid var(--ink);padding:15px 4px;background:var(--orange)}.qr-dot-sample{display:grid;grid-template-columns:repeat(3,9px);gap:3px;pointer-events:none}.qr-dot-sample i{height:9px;background:var(--ink)}.qr-dot-sample[data-style=dots] i{border-radius:100%}.qr-dot-sample[data-style=rounded] i{border-radius:3px}.qr-dot-sample[data-style=extra-rounded] i{border-radius:5px}.qr-dot-sample[data-style=classy] i{border-radius:0 6px}.qr-dot-sample[data-style=classy-rounded] i{border-radius:3px 7px}
.qr-colour-group{border:0;border-top:1px solid var(--line);padding:20px 0 0;margin:22px 0 0;min-width:0}.qr-colour-group:first-child{margin-top:0}.qr-colour-group legend{float:left;width:100%;font-size:15px;font-weight:700;margin-bottom:16px}.qr-colour-fields{clear:both;display:grid;grid-template-columns:1fr 1fr;gap:14px}.qr-form input[type=color]{width:100%;height:45px;border:1px solid var(--ink);padding:4px;background:white;cursor:pointer}.qr-check{display:flex;align-items:center;gap:10px;font-size:13px;line-height:1.5;margin-top:18px}.qr-form input[type=checkbox]{width:18px;height:18px;accent-color:var(--ink);flex-shrink:0}.qr-form input[type=range]{width:100%;accent-color:var(--ink);padding-block:6px}.qr-range-label{display:flex;justify-content:space-between;gap:12px}.qr-form-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:10px}.qr-reset{background:none;border:0;text-decoration:underline;text-underline-offset:5px;font-size:12px;cursor:pointer}.qr-form-actions .text-link{font-size:12px}
.qr-preview{position:sticky;top:105px;border:1px solid var(--ink);min-width:0}.qr-preview-top{display:flex;justify-content:space-between;align-items:center;background:var(--orange);padding:18px 22px;border-bottom:1px solid var(--ink);gap:15px}.qr-preview-top h2{font-size:19px;letter-spacing:-.04em}.qr-preview-top>span{font:700 11px/1.4 "Courier New",monospace}.qr-preview-stage{padding:28px;min-height:280px;display:grid;place-items:center;background:#fafafa;background-image:linear-gradient(45deg,#ededed 25%,transparent 25%),linear-gradient(-45deg,#ededed 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ededed 75%),linear-gradient(-45deg,transparent 75%,#ededed 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.qr-canvas{width:100%;max-width:360px;aspect-ratio:1}.qr-canvas>div,.qr-canvas svg,.qr-canvas canvas{display:block;width:100%;height:auto;aspect-ratio:1}.qr-preview-info{border-top:1px solid var(--ink);padding:20px 22px;background:var(--white)}.qr-status{font-size:13px;line-height:1.6;margin-bottom:10px;min-height:21px}.qr-warning{border-left:3px solid var(--orange);padding-left:12px;font-size:12px;line-height:1.7;margin-bottom:18px}.qr-export{display:grid;grid-template-columns:100px 1fr;gap:10px;margin-top:18px}.qr-export label{font-size:11px;display:flex;flex-direction:column;gap:7px}.qr-export .button{align-self:end;justify-content:center;padding:14px 12px;min-height:45px;font-size:12px;cursor:pointer}.qr-preview button:disabled{opacity:.4;cursor:not-allowed}.qr-vcf{margin-top:16px;background:none;border:0;text-decoration:underline;text-underline-offset:5px;font-size:12px;font-weight:700;cursor:pointer}.qr-howto{border-top:1px solid var(--ink);padding-block:35px 60px}.qr-howto h2{font-size:clamp(28px,3.5vw,42px);max-width:22ch;margin-bottom:22px;letter-spacing:-.04em}.qr-howto-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.qr-howto h3{font-size:18px;margin-bottom:10px;letter-spacing:-.03em}.qr-howto p{font-size:14px;line-height:1.7}.qr-howto a{text-decoration:underline;text-underline-offset:4px}.qr-form [hidden],.qr-preview [hidden]{display:none!important}
@media(max-width:1000px){.qr-studio{grid-template-columns:minmax(0,1fr) minmax(300px,.8fr);gap:22px}.qr-panel-body{padding:20px}.qr-preview-stage{padding:20px}}
@media(max-width:800px){.qr-studio{grid-template-columns:1fr}.qr-preview{position:static;grid-row:1}.qr-preview-stage{padding:25px}.qr-canvas{max-width:290px}.qr-howto-grid{grid-template-columns:1fr;gap:24px}.qr-intro h1{font-size:clamp(40px,9vw,65px)}}
@media(max-width:480px){.qr-panel>summary{padding:18px;font-size:21px}.qr-panel-body{padding:18px}.qr-fields{gap:16px 12px}.qr-field-wide-mobile{grid-column:1/-1}.qr-colour-fields{gap:12px}.qr-form-actions{align-items:start}.qr-preview-stage{padding:20px}}
