
#certStickers{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:visible}
.cert-sticker{position:absolute;pointer-events:auto;cursor:move;touch-action:none;user-select:none}
.cert-sticker .cs-inner{position:relative;width:100%;height:0;padding-bottom:100%}
.cert-sticker .cs-inner svg,.cert-sticker .cs-inner img{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.cert-sticker .cs-frame{position:absolute;inset:-2px;border:1.5px dashed rgba(198,162,83,.9);border-radius:3px;display:none}
.cert-sticker.sel .cs-frame{display:block}
.cs-h{position:absolute;width:14px;height:14px;background:#fff;border:2px solid var(--gold,#c6a253);border-radius:50%;display:none}
.cert-sticker.sel .cs-h{display:block}
.cs-h.br{right:-8px;bottom:-8px;cursor:nwse-resize}
.cs-rot{position:absolute;left:50%;top:-30px;transform:translateX(-50%);width:15px;height:15px;background:#fff;border:2px solid var(--gold,#c6a253);border-radius:50%;display:none;cursor:grab}
.cert-sticker.sel .cs-rot{display:block}
.cs-rot::before{content:"";position:absolute;left:50%;top:14px;width:1px;height:16px;background:rgba(198,162,83,.9);transform:translateX(-50%)}
.cs-tools{position:absolute;left:50%;bottom:-40px;transform:translateX(-50%);display:none;gap:5px;background:#0c1826;border:1px solid rgba(198,162,83,.4);border-radius:8px;padding:5px;box-shadow:0 8px 22px rgba(0,0,0,.5);z-index:10}
.cert-sticker.sel .cs-tools{display:flex}
.cs-tools button{width:28px;height:28px;border:none;border-radius:6px;background:rgba(198,162,83,.1);color:#e6cd8f;cursor:pointer;font-size:13px;display:grid;place-items:center}
.cs-tools button:hover{background:rgba(198,162,83,.25)}
.cs-tools button.del:hover{background:rgba(200,60,60,.3);color:#ffb0b0}

/* library modal */
#compOverlay{position:fixed;inset:0;z-index:99998;background:rgba(6,11,20,.72);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center}
#compOverlay.open{display:flex}
#compModal{width:760px;max-width:96vw;max-height:88vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#101d30,#0b1523);border:1px solid rgba(198,162,83,.28);border-radius:16px;box-shadow:0 32px 80px rgba(0,0,0,.6);overflow:hidden}
#compModal .cm-head{display:flex;align-items:center;padding:18px 22px;border-bottom:1px solid rgba(198,162,83,.15)}
#compModal .cm-title{flex:1;font-family:'Cinzel',serif;font-size:18px;color:var(--gold-light,#e6cd8f);letter-spacing:.5px}
#compModal .cm-close{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.05);border:1px solid rgba(198,162,83,.2);color:rgba(216,203,179,.6);cursor:pointer}
#compModal .cm-close:hover{background:rgba(200,60,60,.15);color:#e08080}
.cm-tabs{display:flex;gap:4px;flex-wrap:wrap;padding:12px 20px 0}
.cm-tab{padding:7px 14px;border-radius:8px 8px 0 0;cursor:pointer;font-family:'Cinzel',serif;font-size:12px;letter-spacing:.5px;color:#9a875f;border:1px solid transparent;border-bottom:none}
.cm-tab.on{color:#f0e6cc;background:rgba(198,162,83,.1);border-color:rgba(198,162,83,.22)}
.cm-body{flex:1;overflow-y:auto;padding:16px 20px 22px}
.cm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px}
.cm-item{aspect-ratio:1;border:1px solid rgba(198,162,83,.18);border-radius:10px;background:rgba(255,255,255,.03);cursor:pointer;display:grid;place-items:center;padding:12px;transition:.15s;position:relative}
.cm-item:hover{border-color:var(--gold,#c6a253);background:rgba(198,162,83,.08);transform:translateY(-2px)}
.cm-item svg,.cm-item img{max-width:100%;max-height:100%;display:block}
.cm-item .cm-del{position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:rgba(0,0,0,.5);color:#ffb0b0;border:none;cursor:pointer;font-size:11px;display:none}
.cm-item:hover .cm-del{display:block}
.cm-upl{display:flex;align-items:center;justify-content:center;gap:8px;border:1px dashed rgba(198,162,83,.5);color:#c9bc9d;font-family:'Cinzel',serif;font-size:11px;letter-spacing:.5px;text-align:center}
.cm-upl:hover{color:#f3e7c6}
.cm-hint{font-size:12px;color:#8d7c5c;font-style:italic;margin:0 20px 12px}
#certGrid{position:absolute;inset:0;z-index:7;pointer-events:none;display:none}
#certGrid svg{position:absolute;inset:0;display:block}
#alignGuides{position:absolute;inset:0;z-index:9;pointer-events:none}
#alignGuides .ag-v{position:absolute;top:-2%;bottom:-2%;border-left:1.4px solid #ff3d95;transform:translateX(-50%);box-shadow:0 0 3px rgba(255,61,149,.55)}
#alignGuides .ag-h{position:absolute;left:-2%;right:-2%;border-top:1.4px solid #ff3d95;transform:translateY(-50%);box-shadow:0 0 3px rgba(255,61,149,.55)}
.cm-tab-my{color:#e6cd8f;background:rgba(198,162,83,.12);border-color:rgba(198,162,83,.3)}
.cm-tab-my.on{color:#f0e6cc;background:rgba(198,162,83,.24);border-color:rgba(198,162,83,.45)}
.cm-item.cm-plate{aspect-ratio:1.414/1}
.certificate.frame-none .cert-corner{display:none !important}
@media print{
  .cs-frame,.cs-h,.cs-rot,.cs-tools{display:none !important}
  #compOverlay,#certGrid,#alignGuides{display:none !important}
}
