html.wegss-lock, html.wegss-lock body { overflow:hidden; }

.wegss { margin:38px auto 30px; max-width:860px; font-family:inherit; }

/* Fallback button directly below content */
.wegss-open-inline {
  width:100%; border:0; border-radius:18px; padding:16px 20px;
  background:linear-gradient(135deg,#f45b9a,#ee3d7f); color:#fff;
  font:inherit; font-weight:700; font-size:17px; cursor:pointer;
  box-shadow:0 10px 26px rgba(238,61,127,.20);
}
.wegss-open-inline:hover { transform:translateY(-1px); }

/* Small envelope button – compact, clearly a button, never a banner */
.wegss-float-wrap {
  position:fixed; right:10px; bottom:92px; z-index:99990;
  display:flex; align-items:center; gap:0;
}
.wegss-float {
  position:relative; overflow:hidden;
  width:158px; height:46px; min-height:46px;
  border:1px solid #d6a8ba; border-radius:8px;
  padding:5px 13px 5px 48px;
  display:flex; align-items:center;
  background:linear-gradient(135deg,#f8dce7,#f2c8d9);
  color:#74495b; cursor:pointer;
  box-shadow:0 5px 14px rgba(125,75,94,.16);
  font:inherit; text-align:left;
  transition:transform .18s, box-shadow .18s;
}
.wegss-float:hover {
  transform:translateY(-1px);
  box-shadow:0 7px 17px rgba(125,75,94,.22);
}
.wegss-float:before {
  content:""; position:absolute; inset:4px;
  border:1px solid rgba(255,255,255,.72); border-radius:6px;
  pointer-events:none;
}
.wegss-float-copy {
  position:relative; z-index:2;
  display:block; white-space:nowrap;
}
.wegss-float-copy strong {
  font-size:11px; line-height:1.1; color:#74495b; font-weight:700;
}
.wegss-envelope {
  position:absolute; left:9px; top:50%; transform:translateY(-50%);
  z-index:3; width:31px; height:22px;
  border:1.5px solid #9f647b; border-radius:3px;
  background:rgba(255,255,255,.42);
  box-shadow:0 2px 5px rgba(111,65,82,.10);
}
.wegss-envelope:before, .wegss-envelope:after {
  content:""; position:absolute; left:2px; right:2px; top:5px; height:1.4px;
  background:#9f647b; transform-origin:center;
}
.wegss-envelope:before { transform:rotate(31deg); }
.wegss-envelope:after { transform:rotate(-31deg); }
.wegss-envelope-flap {
  position:absolute; left:6px; right:6px; top:0; height:10px;
  border-left:1.3px solid #9f647b; border-bottom:1.3px solid #9f647b;
  transform:rotate(-45deg) skew(9deg,9deg); opacity:.72;
}
.wegss-envelope-paper {
  position:absolute; left:9px; top:3px; z-index:4;
  width:13px; height:13px; border-radius:50%;
  background:#fff; color:#c75f8a; font-size:7px;
  display:grid; place-items:center;
}
.wegss-hide, .wegss-peek {
  width:25px; height:34px; border:1px solid #c89aaa; background:#e8c0cd;
  color:#795563; cursor:pointer; box-shadow:0 4px 12px rgba(0,0,0,.11);
  font-size:17px; display:grid; place-items:center;
}
.wegss-hide { border-radius:7px 0 0 7px; margin-left:4px; }
.wegss-peek {
  display:none; border-radius:8px 0 0 8px; background:#e8c0cd;
}
.wegss-is-retracted .wegss-float { display:none; }
.wegss-is-retracted .wegss-hide { display:none; }
.wegss-is-retracted .wegss-peek { display:grid; }


/* Modal foundation: bounded to the viewport, centered on every device */
.wegss-dialog, .wegss-personal-dialog {
  position:fixed !important;
  inset:0 !important;
  z-index:999999 !important;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  box-sizing:border-box;
}
.wegss-dialog[hidden], .wegss-personal-dialog[hidden] { display:none !important; }
.wegss-backdrop {
  position:absolute;
  inset:0;
  background:rgba(24,25,27,.66);
  backdrop-filter:blur(3px);
}
.wegss-panel, .wegss-personal-panel {
  position:relative;
  z-index:2;
  width:min(500px, calc(100vw - 32px));
  max-height:calc(100dvh - 32px);
  overflow:auto;
  box-sizing:border-box;
  background:#fff;
  border-radius:24px;
  box-shadow:0 18px 55px rgba(0,0,0,.28);
  scrollbar-width:thin;
}
.wegss-personal-panel { width:min(500px, calc(100vw - 32px)); }

/* Close button is always above image/content */
.wegss-close {
  position:absolute; right:10px; top:10px; z-index:30; width:34px; height:34px;
  border:0; border-radius:50%; background:#303236; color:#fff;
  font-size:22px; line-height:1; cursor:pointer;
  box-shadow:0 4px 13px rgba(0,0,0,.24);
  display:grid; place-items:center;
}
.wegss-close span { display:block; transform:translateY(-1px); }
.wegss-close:hover { transform:scale(1.06); background:#202225; }

/* Image is NEVER cropped. Works with portrait, landscape, square and quote cards. */
.wegss-hero { padding:10px 10px 0; background:#faf8f7; text-align:center; }
.wegss-image-frame { width:100%; min-height:100px; max-height:44dvh; display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:18px; background:#f1efed; }
.wegss-image-frame img {
  display:block; width:auto; height:auto; max-width:100%; max-height:44dvh;
  object-fit:contain; margin:auto;
}
.wegss-image-note { padding:3px 5px 4px; color:#a07b89; font-size:11px; line-height:1.2; }

.wegss-content { padding:7px 24px 22px; text-align:center; }
.wegss-kicker { font-size:24px; margin-bottom:0; line-height:1; }
.wegss-content h2, .wegss-personal-panel h2 { margin:0 0 5px; font-size:25px; line-height:1.15; color:#272b2f; }
.wegss-intro { margin:0 auto 12px; color:#777; font-size:15px; line-height:1.35; max-width:480px; }

.wegss-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.wegss-card {
  min-height:94px; padding:10px 6px; border:2px solid #e5e7ea; border-radius:18px;
  background:#fff; cursor:pointer; font:inherit; color:#303438; display:flex;
  flex-direction:column; align-items:center; justify-content:center; gap:4px;
  transition:transform .16s, box-shadow .16s;
}
.wegss-card:hover { transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.08); }
.wegss-card.whatsapp{border-color:#38c976}.wegss-card.facebook{border-color:#4a8fe8}.wegss-card.pinterest{border-color:#df4059}
.wegss-card.telegram{border-color:#2d9ed1}.wegss-card.email{border-color:#e16b61}.wegss-card.copy{border-color:#90969b}
.wegss-icon{font-size:25px;line-height:1.05}.wegss-card strong{font-size:14px}.wegss-card small{color:#888;font-size:10px;font-weight:500}

.wegss-native, .wegss-personal {
  width:100%; margin-top:13px; border-radius:17px; padding:14px 15px;
  display:flex; align-items:center; gap:12px; text-align:left; font:inherit; cursor:pointer;
}
.wegss-native{border:1px solid #dfe3e6;background:#f7f8f9;color:#303438}
.wegss-personal{border:2px dashed #ed78a4;background:#fff1f6;color:#303438}
.wegss-native span:first-child,.wegss-gift{font-size:26px}
.wegss-native span:nth-child(2),.wegss-personal span:nth-child(2){flex:1;display:flex;flex-direction:column;gap:3px}
.wegss-native small,.wegss-personal small{color:#888;font-size:12px;font-weight:500}
.wegss-native b,.wegss-personal b{font-size:25px;color:#e86b9a}

.wegss-toast{min-height:0;margin-top:9px;color:#6d5360;font-size:14px;opacity:0;transform:translateY(5px);transition:.2s}
.wegss-toast.is-visible{opacity:1;transform:none}

/* Personal, guided mini-experience */
.wegss-personal-panel{padding:31px 28px 26px;text-align:center}
.wegss-personal-top{font-size:35px;margin-bottom:4px}
.wegss-personal-panel h2{font-size:25px}
.wegss-personal-lead{margin:0 auto 20px;color:#777;line-height:1.5;max-width:500px}
.wegss-label,.wegss-message-wrap label,.wegss-preview-label{display:block;text-align:left;font-size:14px;font-weight:700;color:#45484b;margin-bottom:8px}
.wegss-chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.wegss-chips button{
  border:1px solid #e9ccd8;background:#fff8fb;border-radius:999px;padding:9px 11px;
  color:#654e58;font:inherit;font-size:13px;cursor:pointer;transition:.15s;
}
.wegss-chips button:hover,.wegss-chips button.is-selected{background:#ffe2ec;border-color:#ed78a4;transform:translateY(-1px)}
.wegss-message{width:100%;box-sizing:border-box;resize:vertical;min-height:110px;border:1px solid #ddd;border-radius:15px;padding:13px;font:inherit;line-height:1.45}
.wegss-message:focus{outline:2px solid #f4a4c2;outline-offset:1px}
.wegss-message-hint{font-size:11px;color:#999;text-align:left;margin-top:5px}
.wegss-preview{margin-top:17px;text-align:left}
.wegss-preview-box{background:#faf7f8;border:1px solid #eee0e6;border-radius:13px;padding:12px;color:#5d5056;font-size:13px;line-height:1.4}
.wegss-preview-url{font-size:10px;color:#999;word-break:break-all}
.wegss-personal-send{margin-top:15px;width:100%;border:0;border-radius:15px;padding:15px;background:linear-gradient(135deg,#f35b9b,#ed3f80);color:#fff;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 8px 22px rgba(237,63,128,.22)}
.wegss-back{margin-top:8px;border:0;background:transparent;color:#888;text-decoration:underline;font:inherit;font-size:13px;cursor:pointer}

@media (max-width:560px){
  .wegss{margin-top:26px}

  /* Small, rectangular envelope – never a full-width mobile banner */
  .wegss-float-wrap{right:8px;bottom:78px}
  .wegss-float{
    width:150px; height:44px; min-height:44px;
    padding:5px 12px 5px 46px; border-radius:7px;
  }
  .wegss-float:before{inset:5px}
  .wegss-envelope{left:8px;width:32px;height:23px}
  .wegss-envelope-paper{left:9px;top:4px;width:13px;height:13px;font-size:7px}
  .wegss-float-copy{max-width:105px}
  .wegss-float-copy strong{font-size:10px;line-height:1.1}
  .wegss-hide,.wegss-peek{width:25px;height:34px}

  /* Same desktop-style card, simply scaled to the phone */
  .wegss-dialog,.wegss-personal-dialog{
    padding:12px;
    align-items:center;
    justify-content:center;
  }
  .wegss-panel,.wegss-personal-panel{
    width:calc(100vw - 24px);
    max-width:500px;
    max-height:calc(100dvh - 24px);
    border-radius:22px;
  }
  .wegss-hero{padding:8px 8px 0}
  .wegss-image-frame{
    max-height:38dvh;
    min-height:80px;
    border-radius:15px;
  }
  .wegss-image-frame img{max-height:38dvh}
  .wegss-image-note{padding:3px 4px 4px;font-size:10px}
  .wegss-content{padding:6px 12px 16px}
  .wegss-kicker{font-size:22px}
  .wegss-content h2{font-size:21px;margin-bottom:4px}
  .wegss-intro{font-size:13px;line-height:1.3;margin-bottom:11px}
  .wegss-grid{gap:6px}
  .wegss-card{
    min-height:78px;
    border-radius:13px;
    padding:6px 2px;
    border-width:2px;
  }
  .wegss-card strong{font-size:12px}
  .wegss-card small{font-size:9px}
  .wegss-icon{font-size:20px}
  .wegss-close{top:8px;right:8px;width:30px;height:30px;font-size:19px}
  .wegss-native{margin-top:9px;padding:10px 11px;border-radius:13px}
  .wegss-personal{margin-top:9px;padding:10px 11px;border-radius:13px}
}

@media (max-width:380px){
  .wegss-float{width:144px;height:42px;min-height:42px;padding-left:44px;padding-right:12px}
  .wegss-float-copy{max-width:100px}
  .wegss-float-copy strong{font-size:9.5px}
  .wegss-panel,.wegss-personal-panel{width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}
  .wegss-dialog,.wegss-personal-dialog{padding:10px}
  .wegss-image-frame,.wegss-image-frame img{max-height:36dvh}
}
/* Tiny reassurance under the personal-share action */
.wegss-personal-note {
  margin-top:8px; color:#9a8a91; font-size:11px; line-height:1.4; text-align:center;
}

@media (max-width:380px){
  }