/* Mi colección: botón y ventana de compartir */
html body .cs-open{display:inline-flex;align-items:center;gap:10px;margin:14px 0 0;padding:12px 20px;border:1px solid #ffffff88;border-radius:999px;background:transparent;color:#fff;font:600 11px/1 "IBM Plex Mono","DM Mono",ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
html body .cs-open:hover{background:#fff;color:#121212;border-color:#fff}
.cs-open[hidden]{display:none}
.cs-overlay{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:20px;background:#121212cc;backdrop-filter:blur(6px);overflow:auto}
.cs-overlay[hidden]{display:none}
.cs-box{position:relative;width:min(520px,100%);max-height:calc(100dvh - 40px);overflow:auto;padding:28px;border:1px solid #e4e0d4;border-radius:20px;background:#f7f6f2;color:#121212;box-shadow:0 30px 80px #0007}
html body .cs-overlay .cs-close{position:absolute;top:10px;right:12px;width:36px;height:36px;padding:0;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#5c5a54;font:400 28px/1 Arial,sans-serif;cursor:pointer}
html body .cs-overlay .cs-close:hover{background:#ece9df;color:#121212}
.cs-eyebrow{margin:0 0 10px;color:#ff8346;font:500 11px/1 "IBM Plex Mono","DM Mono",ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase}
.cs-box h2{margin:0 0 18px;font:800 30px/1 Raleway,Arial,sans-serif;letter-spacing:-.045em;text-transform:none}
.cs-field{display:grid;gap:6px;margin-bottom:16px}
.cs-field span{color:#5c5a54;font:500 11px/1 "IBM Plex Mono","DM Mono",ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}
html body .cs-overlay .cs-field input{width:100%;padding:13px 18px;border:1px solid #121212;border-radius:999px;background:#fff;color:#121212;font:600 15px Raleway,Arial,sans-serif;outline:none}
html body .cs-overlay .cs-field input:focus{border-color:#ff8346;box-shadow:0 0 0 3px #ff834633}
.cs-preview{display:grid;place-items:center;margin-bottom:16px;padding:10px;border:1px solid #e4e0d4;border-radius:14px;background:#ece9df}
.cs-preview canvas{display:block;width:auto;max-width:100%;max-height:min(46vh,420px);border-radius:8px;box-shadow:0 8px 24px #0003}
.cs-actions{display:flex;flex-wrap:wrap;gap:10px}
html body .cs-overlay .cs-btn{flex:1 1 auto;padding:14px 20px;border:1px solid #121212;border-radius:999px;background:#fff;color:#121212;font:600 11px/1 "IBM Plex Mono","DM Mono",ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background .15s,color .15s}
html body .cs-overlay .cs-btn:hover{background:#121212;color:#fff}
html body .cs-overlay .cs-btn[hidden]{display:none}
html body .cs-overlay .cs-primary{border-color:#ff8346;background:#ff8346;color:#121212}
html body .cs-overlay .cs-primary:hover{background:#121212;border-color:#121212}
.cs-status{min-height:20px;margin:12px 0 0;color:#2f8f5b;font:600 12px/1.4 "IBM Plex Mono","DM Mono",ui-monospace,monospace;word-break:break-all}
.cs-note{margin:4px 0 0;color:#77736a;font:500 12px/1.5 Raleway,Arial,sans-serif}
@media(max-width:600px){.cs-box{padding:22px 16px}.cs-preview canvas{max-height:36vh}}
html body .collection-header-support .cs-open{justify-self:start;width:fit-content}