/* QR workbench only. Keep the shared site and image tool unchanged. */
.qr-page [hidden]{display:none!important}
.qr-page .breadcrumbs{margin-bottom:28px}
.qr-page .tools-hero{max-width:none;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:14px 48px;align-items:center;padding:4px 0 36px}
.qr-page .tools-hero>.section-label{grid-column:1/-1;margin:0}
.qr-page .tools-hero h1{grid-column:1;grid-row:2/4;font-size:clamp(36px,3.6vw,54px);line-height:1.15;margin:0;text-wrap:balance}
.qr-page .tools-hero>p:not(.section-label){grid-column:2;font-size:16px;line-height:1.85;margin:0}
.qr-page .tools-hero .tools-pills{grid-column:2;margin:0;gap:8px}
.qr-page .tools-pills span{padding:7px 10px;font-size:11px}
.qr-workspace{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);align-items:stretch;gap:24px}
.qr-panel{min-width:0;border:1px solid #2a3d5b;border-radius:22px;padding:28px;background:linear-gradient(145deg,#0e1a30,#0a101d)}
.qr-panel h2{font:700 23px/1.4 var(--display);letter-spacing:-.03em;margin:8px 0 22px}
.qr-panel .section-label{font-size:10px;color:#8cbaff}
.qr-types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 28px}
.qr-type{display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid #344660;background:#101a2c;border-radius:11px;padding:12px 6px;min-height:48px;color:#a7bad6;font:600 12px/1.4 var(--body);cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.qr-type svg{width:18px;height:18px;flex:none}
.qr-type[aria-pressed=true]{color:#dcecff;border-color:#72abff;background:#19448155;box-shadow:inset 0 0 0 1px #72abff22}
.qr-fields{display:grid;gap:18px;min-width:0}
.qr-fields[hidden]{display:none}
.qr-panel label{display:block;font-size:13px;line-height:1.6;font-weight:600;color:#cbdaf0;margin-bottom:8px}
.qr-panel input:not([type=checkbox]):not([type=color]):not([type=file]),.qr-panel textarea,.qr-panel select{display:block;width:100%;min-width:0;border:1px solid #344f72;border-radius:10px;background:#0a1426;color:#e2edff;padding:12px 14px;font:400 16px/1.5 var(--body);color-scheme:dark}
.qr-panel textarea{min-height:120px;resize:vertical}
.qr-panel textarea:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
.qr-panel input::placeholder,.qr-panel textarea::placeholder{color:#6e87aa}
.qr-panel .qr-check{display:flex;align-items:center;gap:10px;margin:0;font-size:12px}
.qr-check input{accent-color:#3b82f6;width:18px;height:18px}
.qr-grid-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.qr-customize{margin-top:26px;padding-top:24px;border-top:1px solid var(--line)}
.qr-customize h3{font:700 15px var(--display);margin:0 0 18px}
.qr-colors{display:flex;align-items:center;gap:8px;height:48px}
.qr-swatch{width:34px;height:34px;border:2px solid transparent;box-shadow:0 0 0 1px #8ca8d455;border-radius:50%;background:var(--swatch);cursor:pointer}
.qr-swatch[aria-pressed=true]{border-color:#e7f1ff;box-shadow:0 0 0 3px #3b82f6}
.qr-color-custom{width:38px;height:38px;padding:2px;border:1px solid #536984;border-radius:9px;background:#14233a;cursor:pointer}
.qr-logo-box{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:16px;border:1px dashed #40638e;border-radius:13px;margin-top:20px;background:#12315b16}
.qr-logo-preview{width:58px;height:58px;object-fit:contain;background:#fff;padding:3px;border-radius:10px}
.qr-logo-copy{flex:1;min-width:150px;font-size:12px;line-height:1.7;color:#94aac8;overflow-wrap:anywhere}
.qr-logo-copy strong{display:block;color:#d6e4f8;font-weight:600}
.qr-logo-box .tools-btn{font-size:12px;min-height:44px;padding:9px 12px}
.qr-file{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}
.qr-preview-panel{position:sticky;top:142px;text-align:center}
.qr-preview-panel .section-label{text-align:left}
.qr-preview-panel h2{text-align:left}
.qr-preview-stage{display:grid;place-items:center;min-height:300px;padding:22px;border:1px solid #3b5980;border-radius:18px;background:radial-gradient(ellipse at 50% 10%,#17376260,transparent 80%),#091223}
.qr-preview-stage img{display:block;width:min(100%,310px);height:auto;aspect-ratio:1;background:#fff;border-radius:4px;box-shadow:0 14px 45px #0004}
.qr-placeholder{color:#7892b4;font-size:13px;line-height:1.8;max-width:230px}
.qr-placeholder svg{width:48px;height:48px;display:block;margin:0 auto 18px;color:#74abf3}
.qr-feedback{font-size:12px;color:#91b8e9;line-height:1.8;text-align:left;min-height:44px;margin:16px 0;overflow-wrap:anywhere}
.qr-feedback.is-error{color:#f0a0ad}
.qr-downloads{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.qr-downloads .tools-btn{padding:12px 8px}
.qr-preview-note{font-size:11px;line-height:1.9;color:#8ea3c0;text-align:left;margin:18px 0 0}
.qr-help{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
.qr-help article{position:relative;padding:24px;border:1px solid #2a3d5b;border-radius:18px;background:radial-gradient(ellipse at 0 0,#153c6b33,transparent 75%),#0b1322}
.qr-help-icon{display:grid;place-items:center;width:44px;height:44px;margin-bottom:20px;border:1px solid #73a9f340;border-radius:12px;background:#2258a91a;color:#8fc3ff}
.qr-help-icon svg{width:23px;height:23px}
.qr-help h2{font:700 17px/1.5 var(--display);letter-spacing:-.02em;margin:0 0 10px;color:#d6e7ff}
.qr-help p{font-size:13px;line-height:1.85;color:#9cafca;margin:0}
.qr-catalog-card{margin-top:20px}
@media(hover:hover){.qr-type:hover{border-color:#77adf6;color:#e0ecff;background:#17376755}.qr-swatch:hover{outline:2px solid #87b7ff;outline-offset:3px}}
@media(max-width:900px){.qr-workspace{grid-template-columns:minmax(0,1fr)}.qr-preview-panel{position:static}.qr-preview-stage{min-height:280px}.qr-help{grid-template-columns:1fr}.qr-preview-panel .qr-downloads{max-width:420px;margin:auto}}
@media(max-width:480px){.qr-panel{padding:18px;border-radius:17px}.qr-types{gap:6px}.qr-type{font-size:11px;gap:6px}.qr-type svg{width:16px;height:16px}.qr-grid-two{grid-template-columns:1fr;gap:18px}.qr-preview-stage{min-height:240px;padding:14px}.qr-panel h2{font-size:21px}.qr-preview-stage img{max-width:250px}.qr-logo-box{padding:12px}.qr-downloads{gap:8px}}
@media(max-height:780px){.qr-preview-panel{position:static}}
@media(max-width:360px){.qr-types{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.qr-page .tools-hero{grid-template-columns:1fr;gap:18px}.qr-page .tools-hero h1{grid-column:1;grid-row:auto;max-width:720px;font-size:clamp(34px,6vw,48px)}.qr-page .tools-hero>p:not(.section-label),.qr-page .tools-hero .tools-pills{grid-column:1;max-width:650px}.qr-help article{display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 18px}.qr-help-icon{grid-row:1/3;margin:0}.qr-help h2{margin:0 0 6px}.qr-help p{grid-column:2}}
