#application .templates-workspace{max-width:1180px;padding-bottom:36px}
.templates-intro{display:flex;align-items:center;gap:16px;padding:17px 0 19px;border-bottom:1px solid var(--line)}
.templates-intro p{margin:0;color:var(--muted);font-size:13px}
.template-status,.template-badge{display:inline-flex;align-items:center;width:max-content;padding:5px 9px;border:1px solid #c8d4c4;border-radius:999px;color:#38513b;background:#f4f7f1;font-size:11px;line-height:1.2;text-transform:capitalize;white-space:nowrap}
.template-section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:30px 0 10px}
.template-section-heading h2,.qr-heading h2{margin:4px 0 0;font:400 27px/1.2 var(--serif);letter-spacing:-.3px;color:var(--ink)}
.template-section-heading>p{margin:0 0 3px;color:var(--muted);font-size:12px}
.templates-eyebrow{margin:0;color:#656c5d;font-size:10px;font-weight:650;letter-spacing:1.6px}
.template-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 36px}
.template-entry{min-width:0;padding-top:17px;border-top:1px solid var(--line)}
.template-title-line{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.template-title-line h3{margin:0;font:400 22px/1.25 var(--serif);color:var(--ink)}
.template-preview{display:block;width:100%;height:300px;object-fit:contain;background:#f4f2ec;border:1px solid #e0e2da}
.template-description{min-height:42px;margin:13px 0 6px;color:var(--muted);font-size:13px}
.template-metadata{margin:0 0 13px;color:#656c5d;font-size:11px;letter-spacing:.3px}
.template-entry .primary{display:inline-flex;align-items:center;text-decoration:none}
.qr-workspace{margin-top:42px;padding:27px 30px 24px;background:#f1f0e9;border-top:2px solid #ad9554}
.qr-heading{max-width:670px}
.qr-heading>p:last-child{margin:8px 0 22px;color:var(--muted);font-size:13px}
#qr-form{max-width:760px}
#qr-form>label{display:block;margin:0 0 8px;font-size:13px;font-weight:600}
.qr-input-row{display:flex;align-items:stretch;gap:10px}
.qr-input-row input{flex:1;min-width:0;min-height:46px;padding:10px 12px;border:1px solid #bfc9bd;border-radius:4px;background:#fffefa;color:var(--ink);font-size:14px}
.qr-help,.qr-error{margin:7px 0 0;font-size:12px;color:var(--muted)}
.qr-error{color:#96392e;font-weight:550}
.qr-result{display:grid;grid-template-columns:minmax(160px,1fr) auto;gap:4px 24px;align-items:center;margin-top:25px;padding-top:20px;border-top:1px solid #d7d6ca}
.qr-result figure{display:flex;align-items:center;gap:18px;margin:0;min-width:0}
#qr-canvas{display:block;width:170px;height:auto;max-width:42vw;background:#fff;border:1px solid #d6d6cf;image-rendering:pixelated;flex:none}
#qr-destination{max-width:600px;overflow-wrap:anywhere;color:var(--ink);font-size:12px;line-height:1.5}
.qr-downloads{display:flex;flex-wrap:wrap;gap:9px}
#qr-print-note{grid-column:1/-1;margin:9px 0 0;color:var(--muted);font-size:12px}
.qr-status{min-height:1.5em;margin:11px 0 0;color:#536355;font-size:12px}
.templates-font-note{margin:20px 0 0;color:var(--muted);font-size:11px;line-height:1.6}
.local-preview-banner{position:fixed;right:14px;bottom:12px;z-index:50;padding:8px 12px;border:1px solid #7b744f;border-radius:4px;background:#fff7dc;color:#423918;font-size:11px;box-shadow:0 2px 12px #29333026}
@media(max-width:760px){
  .template-list{grid-template-columns:minmax(0,1fr);gap:24px}
  .template-preview{height:270px}
  .qr-workspace{margin-top:30px;padding:22px 18px}
  .qr-result{grid-template-columns:minmax(0,1fr);gap:13px}
  .qr-result figure{align-items:flex-start;flex-direction:column}
  #qr-canvas{width:190px;max-width:100%}
  #qr-print-note{grid-column:1}
}
@media(max-width:520px){
  .templates-intro{align-items:flex-start;flex-direction:column;gap:8px}
  .template-section-heading{align-items:flex-start;flex-direction:column;gap:5px}
  .qr-input-row{align-items:stretch;flex-direction:column}
  .qr-input-row .primary{align-self:flex-start}
  .template-preview{height:245px}
  .local-preview-banner{right:8px;bottom:8px;left:8px;text-align:center}
}
@media(max-width:650px){.local-preview-banner{position:static;margin:16px 18px 0;box-shadow:none}}
@media(prefers-reduced-motion:reduce){.template-preview{scroll-behavior:auto}}