/* QR PRINT STUDIO — chrome for the editor. Inherits the host admin's CSS
   variables where they exist (--bg/--tx/--line/--red) and falls back to its own
   values, so it looks native in any client's admin without being restyled. */
.qrs-wrap{position:fixed;inset:0;z-index:9000;background:rgba(6,8,12,.72);
  backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:18px}
.qrs-shell{width:min(1180px,100%);height:min(88vh,860px);display:flex;flex-direction:column;
  background:var(--bg,#12151b);color:var(--tx,#e9edf3);border:1px solid var(--line,#2a303a);
  border-radius:16px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.6)}
.qrs-head{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line,#2a303a)}
.qrs-head b{font-size:15px}
.qrs-sub{color:var(--muted,#93a0b4);font-size:12.5px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qrs-x{background:none;border:0;color:var(--muted,#93a0b4);font-size:17px;cursor:pointer;padding:4px 8px;border-radius:8px}
.qrs-x:hover{background:rgba(255,255,255,.08);color:var(--tx,#fff)}

.qrs-body{flex:1;display:flex;min-height:0}
.qrs-stage{flex:1;display:flex;align-items:center;justify-content:center;min-width:0;
  padding:16px;background:
    repeating-conic-gradient(rgba(255,255,255,.045) 0% 25%,transparent 0% 50%) 50%/22px 22px}
.qrs-canvas{max-width:100%;max-height:100%;border-radius:4px;
  box-shadow:0 8px 34px rgba(0,0,0,.5);touch-action:none;background:#fff}

.qrs-side{width:326px;flex:none;overflow-y:auto;padding:14px;border-left:1px solid var(--line,#2a303a)}
.qrs-grp{margin-bottom:16px}
.qrs-grp h4{margin:0 0 8px;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted,#93a0b4)}
.qrs-row{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.qrs-row>span{flex:none;width:104px;font-size:12.5px;color:var(--muted,#93a0b4)}
.qrs-row>input,.qrs-row>select,.qrs-two{flex:1;min-width:0}
.qrs-row input[type=text],.qrs-row input[type=number],.qrs-row select{
  width:100%;padding:6px 8px;border-radius:8px;font-size:13px;
  background:rgba(255,255,255,.05);color:var(--tx,#e9edf3);border:1px solid var(--line,#2a303a)}
.qrs-row input[type=color]{width:44px;height:28px;padding:2px;border-radius:8px;
  background:transparent;border:1px solid var(--line,#2a303a);cursor:pointer}
.qrs-row input[type=range]{accent-color:var(--red,#e11d2a)}
.qrs-row input[type=checkbox]{width:auto;accent-color:var(--red,#e11d2a)}
.qrs-two{display:flex;gap:7px}
.qrs-two>*{flex:1;min-width:0}

.qrs-chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 8px}
.qrs-chip{font-size:11.5px;padding:5px 9px;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.06);color:var(--tx,#e9edf3);border:1px solid var(--line,#2a303a)}
.qrs-chip:hover{border-color:var(--red,#e11d2a)}
.qrs-chip i{font-style:normal;opacity:.6;margin-left:5px}

.qrs-libfind{width:100%;margin:0 0 7px;box-sizing:border-box}
.qrs-lib{display:grid;grid-template-columns:1fr 1fr;gap:7px;max-height:196px;overflow-y:auto}
.qrs-libitem{display:flex;align-items:center;gap:8px;padding:6px;cursor:pointer;text-align:left;
  background:rgba(255,255,255,.05);color:var(--tx,#e9edf3);border:1px solid var(--line,#2a303a);border-radius:10px}
.qrs-libitem:hover{border-color:var(--red,#e11d2a)}
.qrs-libitem canvas{width:34px;height:34px;flex:none;border-radius:5px;background:#fff}
.qrs-libitem span{min-width:0;display:flex;flex-direction:column}
.qrs-libitem b{font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qrs-libitem small{font-size:10px;color:var(--muted,#93a0b4);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.qrs-placed{display:flex;flex-direction:column;gap:5px}
.qrs-prow{display:flex;align-items:center;gap:8px;padding:7px 9px;cursor:pointer;border-radius:9px;
  background:rgba(255,255,255,.04);border:1px solid transparent}
.qrs-prow.on{border-color:var(--red,#e11d2a);background:rgba(225,29,42,.10)}
.qrs-prow span{flex:1;min-width:0;display:flex;flex-direction:column}
.qrs-prow b{font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qrs-prow small{font-size:10.5px;color:var(--muted,#93a0b4)}
.qrs-del{background:none;border:0;color:var(--muted,#93a0b4);cursor:pointer;font-size:13px;padding:2px 5px;border-radius:6px}
.qrs-del:hover{background:rgba(225,29,42,.18);color:#fff}

.qrs-note{font-size:11.5px;color:var(--muted,#93a0b4);line-height:1.6;margin:2px 0 8px}
.qrs-note b{color:var(--tx,#e9edf3)}
.qrs-sub2{margin-top:5px;opacity:.8}
.qrs-empty{font-size:11.5px;color:var(--muted,#93a0b4);line-height:1.6;padding:8px 0}

.qrs-checks{display:flex;flex-direction:column;gap:5px;margin-bottom:9px}
.qrs-chk{font-size:11.5px;line-height:1.5;padding:7px 9px;border-radius:8px}
.qrs-chk.ok{background:rgba(40,190,120,.13);color:#7ee3ad}
.qrs-chk.warn{background:rgba(240,180,40,.13);color:#f0c860}
.qrs-chk.bad{background:rgba(225,29,42,.15);color:#ff8b93}

.qrs-acts{display:flex;flex-wrap:wrap;gap:7px}
.qrs-btn{padding:8px 13px;border-radius:9px;font-size:12.5px;font-weight:600;cursor:pointer;
  background:rgba(255,255,255,.07);color:var(--tx,#e9edf3);border:1px solid var(--line,#2a303a)}
.qrs-btn:hover:not(:disabled){border-color:var(--red,#e11d2a)}
.qrs-btn:disabled{opacity:.42;cursor:not-allowed}
.qrs-go{background:var(--red,#e11d2a);border-color:var(--red,#e11d2a);color:#fff}
.qrs-soft{width:100%;margin-top:6px}
.qrs-acts .qrs-soft{width:auto;margin-top:0}

@media (max-width:900px){
  .qrs-body{flex-direction:column}
  .qrs-side{width:auto;border-left:0;border-top:1px solid var(--line,#2a303a)}
  .qrs-stage{min-height:250px}
  .qrs-shell{height:94vh}
}