/* X share card studio — scoped to its page */
.share-studio { max-width: 1180px; }
.share-studio-head { max-width: 780px; margin-bottom: 2rem; }
.share-studio-head h1 { max-width: 720px; letter-spacing: -.055em; }
.share-trust { display:flex; flex-wrap:wrap; gap:.65rem 1.15rem; margin-top:1.2rem; color:var(--muted); font-size:.78rem; }
.share-trust span { display:inline-flex; align-items:center; gap:.4rem; }
.share-trust-dot,.share-preview-dot { width:7px;height:7px;border-radius:50%;background:#0d9488;display:inline-block; }
.share-studio-app { display:grid; grid-template-columns:minmax(300px,.83fr) minmax(0,1.17fr); gap:1rem; align-items:start; }
.share-editor,.share-preview-panel { min-width:0; border:1px solid var(--line-strong); border-radius:18px; padding:clamp(1rem,2.5vw,1.5rem); background:var(--surface); }
.share-panel-heading { display:flex; justify-content:space-between; align-items:center; gap:.8rem; margin-bottom:1.25rem; }
.share-step { display:block; color:var(--muted); font:600 .68rem/1.4 var(--font-mono); letter-spacing:.09em; }
.share-panel-heading h2 { font-size:1.1rem; margin:.25rem 0 0; letter-spacing:-.025em; }
.share-live-pill,.share-dimensions { color:var(--muted); font-size:.7rem; white-space:nowrap; }
.share-live-pill { border:1px solid var(--line); border-radius:99px; padding:.35rem .55rem; }
.share-field { display:grid; gap:.42rem; margin:0 0 1rem; color:var(--ink-soft); font-size:.8rem; font-weight:600; }
.share-field input,.share-field select { width:100%; min-width:0; border:1px solid var(--line-strong); border-radius:9px; padding:.7rem .75rem; background:var(--bg); color:var(--ink); font:500 .88rem/1.4 var(--font-text); }
.share-field input:focus-visible,.share-field select:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.share-field-row { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
.share-color-field { margin:0 0 1rem; padding:0; border:0; }
.share-color-field legend { margin-bottom:.65rem; color:var(--ink-soft); font-size:.8rem; font-weight:600; }
.share-swatches { display:flex; flex-wrap:wrap; gap:.6rem .85rem; }
.share-swatches label { display:grid; justify-items:center; gap:.35rem; color:var(--muted); font-size:.67rem; cursor:pointer; }
.share-swatches input { position:absolute; opacity:0; width:1px; height:1px; }
.share-swatch { width:29px; height:29px; border-radius:50%; background:var(--swatch); border:3px solid var(--surface); outline:1px solid var(--line-strong); }
.share-swatches input:checked + .share-swatch { outline:2px solid var(--ink); outline-offset:2px; }
.share-swatches input:focus-visible + .share-swatch { outline:2px solid var(--accent); outline-offset:3px; }
.share-privacy-note { display:flex; align-items:flex-start; gap:.45rem; color:var(--muted); font-size:.72rem; line-height:1.6; margin:1.2rem 0 0; }
.share-privacy-note svg { width:16px; height:16px; flex:none; margin-top:1px; }
.share-preview-panel { background:var(--surface-2); }
.share-canvas-wrap { width:100%; overflow:hidden; border-radius:12px; background:#f7f7f5; box-shadow:0 8px 30px #0000000c; }
#share-canvas { display:block; width:100%; height:auto; aspect-ratio:16/9; }
.share-preview-caption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem; margin:.75rem 0 1.2rem; color:var(--muted); font-size:.7rem; }
.share-preview-caption span:first-child { display:flex; align-items:center; gap:.4rem; }
.share-actions { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.share-actions button { display:inline-flex; align-items:center; justify-content:center; gap:.45rem; min-height:44px; padding:.7rem .85rem; border-radius:10px; border:1px solid var(--line-strong); font:650 .82rem/1.2 var(--font-text); cursor:pointer; transition:transform .15s ease,opacity .15s ease; }
.share-actions button:hover { transform:translateY(-1px); }
.share-actions button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.share-actions svg { width:17px; height:17px; }
.share-download { grid-column:1/-1; color:#fff; background:var(--ink); border-color:var(--ink)!important; }
.share-secondary { color:var(--ink); background:var(--surface); }
.share-x { color:var(--ink); background:var(--surface); }
.share-action-feedback { min-height:1.2rem; color:var(--muted); font-size:.72rem; line-height:1.6; margin:.75rem 0 0; }
.share-ideas { margin:3.5rem 0 1.5rem; padding-top:2rem; border-top:1px solid var(--line-strong); }
.share-ideas h2 { font-size:clamp(1.4rem,3vw,1.9rem); letter-spacing:-.04em; margin:.45rem 0 1.4rem; }
.share-idea-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.share-idea-grid article { border:1px solid var(--line); border-radius:14px; padding:1.1rem; background:var(--surface); }
.share-idea-icon { display:grid; place-items:center; width:35px;height:35px;border-radius:10px;background:var(--surface-2);color:var(--accent-text);font-weight:700; }
.share-idea-grid h3 { margin:.85rem 0 .35rem; font-size:.98rem; }
.share-idea-grid p { margin:0; color:var(--muted); font-size:.82rem; line-height:1.7; }
.share-ideas-foot,.share-back-link { color:var(--muted); font-size:.8rem; line-height:1.7; margin-top:1.1rem; }
.share-back-link a { color:var(--accent-text); }
@media(max-width:850px) { .share-studio-app { grid-template-columns:1fr; } .share-editor { order:1; } .share-preview-panel { order:2; } }
@media(max-width:560px) { .share-field-row { grid-template-columns:1fr; gap:0; } .share-idea-grid { grid-template-columns:1fr; } .share-actions { grid-template-columns:1fr; } .share-download { grid-column:auto; } .share-dimensions { font-size:.63rem; } }
@media(prefers-reduced-motion:reduce) { .share-actions button { transition:none; } .share-actions button:hover { transform:none; } }

/* Creator stats studio refinements */
.share-optional { color:var(--muted); font-weight:400; font-size:.72rem; }
.share-field input[type="file"] { padding:.55rem; font-size:.75rem; }
.share-field input[type="file"]::file-selector-button { border:1px solid var(--line); border-radius:7px; padding:.4rem .6rem; margin-right:.65rem; background:var(--surface-2); color:var(--ink); font:600 .72rem var(--font-text); cursor:pointer; }
.share-privacy-note { padding:.75rem .8rem; border-radius:10px; background:var(--surface-2); }
.share-idea-grid article { min-height:155px; }
@media(max-width:560px) {
  .share-panel-heading { align-items:flex-start; }
  .share-live-pill { font-size:.65rem; }
  .share-swatches { gap:.7rem 1rem; }
}
