/* Quiet Build share engine, branded share cards + one-click social.
   Tokens match the QB dark site. Self-contained, no dependencies. */
.qbs-btn{
  display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;
  font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.7rem;
  text-transform:uppercase;letter-spacing:.15em;
  background:rgba(212,184,150,.08);color:#D4B896;border:1px solid rgba(212,184,150,.3);
  padding:.5rem .85rem;border-radius:999px;transition:background .25s,color .25s,border-color .25s;
  -webkit-tap-highlight-color:transparent;line-height:1;
}
.qbs-btn:hover{background:#D4B896;color:#111110;border-color:#D4B896}
.qbs-btn svg{width:14px;height:14px;display:block}

/* corner share button auto-injected on shareable cards */
.qbs-corner{
  position:absolute;top:.85rem;right:.85rem;z-index:6;width:34px;height:34px;padding:0;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:rgba(10,10,10,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(212,184,150,.28);color:#D4B896;cursor:pointer;
  opacity:0;transform:translateY(-4px);transition:opacity .25s,transform .25s,background .25s,color .25s;
}
.qbs-host{position:relative}
.qbs-host:hover .qbs-corner,.qbs-corner:focus-visible{opacity:1;transform:translateY(0)}
.qbs-corner:hover{background:#D4B896;color:#111110}
.qbs-corner svg{width:15px;height:15px}
@media(hover:none){.qbs-corner{opacity:1;transform:none}}

/* floating "create share card" button for text selection */
.qbs-float{
  position:absolute;z-index:10000;display:none;align-items:center;gap:.4rem;
  font-family:'JetBrains Mono',monospace;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  background:#D4B896;color:#111110;border:none;border-radius:999px;padding:.5rem .85rem;
  cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.45);white-space:nowrap;
}
.qbs-float.on{display:inline-flex}

/* modal */
.qbs-modal{
  position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;
  background:rgba(8,8,8,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:1.25rem;
}
.qbs-modal.on{display:flex}
.qbs-sheet{
  width:min(440px,100%);max-height:92vh;overflow:auto;background:#161613;border:1px solid #2A2824;
  border-radius:18px;padding:1.5rem;position:relative;box-shadow:0 40px 90px rgba(0,0,0,.6);
}
.qbs-close{position:absolute;top:.9rem;right:1rem;background:none;border:none;color:#8A857C;font-size:1.7rem;line-height:1;cursor:pointer}
.qbs-close:hover{color:#E8E4DF}
.qbs-h{font-family:'DM Serif Display',Georgia,serif;font-size:1.4rem;color:#FAF8F5;margin-bottom:.25rem}
.qbs-sub{font-size:.85rem;color:#8A857C;margin-bottom:1.1rem;line-height:1.5}
.qbs-preview{border:1px solid #2A2824;border-radius:12px;overflow:hidden;background:#0A0A0A;margin-bottom:1rem}
.qbs-preview canvas{display:block;width:100%;height:auto}
.qbs-fmt{display:flex;gap:.5rem;margin-bottom:1rem}
.qbs-fmt button{
  flex:1;font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  background:#1F1E1A;color:#8A857C;border:1px solid #2A2824;border-radius:8px;padding:.6rem;cursor:pointer;transition:.2s
}
.qbs-fmt button.on{background:rgba(212,184,150,.12);color:#D4B896;border-color:#D4B896}
.qbs-acts{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.qbs-acts .b{
  display:flex;align-items:center;justify-content:center;gap:.45rem;text-align:center;
  font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;
  border-radius:8px;padding:.7rem;cursor:pointer;border:1px solid #2A2824;background:#1F1E1A;color:#E8E4DF;transition:.2s;text-decoration:none
}
.qbs-acts .b:hover{border-color:#D4B896;color:#D4B896}
.qbs-acts .b.primary{background:#D4B896;color:#111110;border-color:#D4B896;grid-column:1/-1}
.qbs-acts .b.primary:hover{background:#E0C9A8}
.qbs-hint{font-size:.72rem;color:#5C5850;margin-top:.9rem;line-height:1.5;text-align:center}
.qbs-toast{
  position:fixed;left:50%;bottom:2rem;transform:translate(-50%,20px);z-index:100001;
  background:#0A0A0A;color:#E8E4DF;border:1px solid #2A2824;border-radius:999px;padding:.6rem 1.2rem;
  font-family:'JetBrains Mono',monospace;font-size:.75rem;letter-spacing:.05em;opacity:0;transition:.3s;pointer-events:none
}
.qbs-toast.in{opacity:1;transform:translate(-50%,0)}

/* always-visible, obvious share buttons (mobile + desktop) */
.qbs-corner{opacity:1 !important;transform:none !important;width:38px;height:38px}
.qbs-corner svg{width:17px;height:17px}
