/* Templates gallery + preview modal */
.lx-tg-card{
  background:var(--paper,#fff);
  border:1px solid var(--line,rgba(42,33,28,0.08));
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 20px 44px -34px rgba(42,33,28,.4);
  display:flex;
  flex-direction:column;
  width:100%;
  padding:0;
  margin:0;
  text-align:left;
  cursor:pointer;
  font:inherit;
  color:inherit;
  transition:transform .18s ease, box-shadow .18s ease;
}
.lx-tg-card:hover,
.lx-tg-card:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 28px 50px -30px rgba(42,33,28,.5);
  outline:none;
}
.lx-tg-card:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb, var(--coral,#FF6B4A) 45%, transparent), 0 28px 50px -30px rgba(42,33,28,.5)}
.lx-tg-card-preview{
  padding:18px 16px 12px;
  background:var(--bg,#FAF6F1);
  display:flex;
  justify-content:center;
}
.lx-tg-phone{
  position:relative;
  width:100%;
  margin:0 auto;
  background:#0F0B09;
  border-radius:22px;
  padding:7px;
  box-sizing:border-box;
  box-shadow:0 16px 28px -18px rgba(42,33,28,.55);
}
.lx-tg-card-preview .lx-tg-phone{
  width:min(178px,78%);
  max-width:178px;
  aspect-ratio:290 / 552;
  height:auto;
  border-radius:28px;
  padding:8px;
}
.lx-tg-card-preview .lx-tg-phone::before{
  content:"";
  position:absolute;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  width:54px;
  height:12px;
  background:#0F0B09;
  border-radius:0 0 9px 9px;
  z-index:2;
  pointer-events:none;
}
.lx-tg-phone-screen{
  background:var(--paper,#fff);
  border-radius:16px;
  overflow:hidden;
  min-height:0;
}
.lx-tg-card-preview .lx-tg-phone-screen{
  height:100%;
  border-radius:22px;
  display:flex;
  flex-direction:column;
}

.lx-tg-links{display:flex;flex-direction:column;gap:6px;width:100%}
.lx-tg-card-preview .lx-tg-links{gap:6px}
.lx-tg-link{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border-radius:999px;
  padding:0 10px;
  height:28px;
  min-height:28px;
  max-height:28px;
  font-size:9px;
  font-weight:600;
  line-height:1.1;
  text-align:center;
  flex:0 0 auto;
  box-sizing:border-box;
  width:100%;
}
.lx-tg-link:has(.lx-tg-badge){justify-content:space-between}
.lx-tg-card-preview .lx-tg-link{
  height:28px;
  min-height:28px;
  max-height:28px;
  padding:0 10px;
  font-size:9px;
  border-radius:999px;
}
.lx-tg-link.is-ink{background:var(--ink,#2A211C);color:#fff}
.lx-tg-link.is-coral{background:var(--coral-strong,#C2410C);color:#fff}
.lx-tg-link.is-teal{background:var(--teal-strong,#0F5C4E);color:#fff}
.lx-tg-link.is-amber{background:#8B5A0F;color:#fff}
.lx-tg-link.is-violet{background:#5B3FA0;color:#fff}
.lx-tg-link.is-paper{
  background:var(--paper,#fff);
  color:var(--ink,#2A211C);
  border:1px solid var(--line,rgba(42,33,28,0.12));
  font-weight:600;
}
.lx-tg-badge{
  flex-shrink:0;
  background:#fff;
  color:var(--ink,#2A211C);
  padding:1px 5px;
  border-radius:999px;
  font-size:7px;
}
.lx-tg-link.is-paper .lx-tg-badge{background:color-mix(in srgb, var(--teal-strong,#0F5C4E) 12%, transparent);color:var(--teal-strong,#0F5C4E)}
.lx-tg-card-foot{
  padding:14px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:var(--paper,#fff);
}
.lx-tg-card-label{
  font-family:'Bricolage Grotesque',sans-serif;
  font-weight:700;
  font-size:16px;
}
.lx-tg-card-arrow{color:var(--coral-strong,#C2410C);font-weight:700;font-size:16px}

.lx-tg-modal[hidden]{display:none!important}
.lx-tg-modal{
  position:fixed;
  inset:0;
  z-index:10000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.lx-tg-backdrop{
  position:absolute;
  inset:0;
  background:rgba(42,33,28,.52);
  border:0;
  padding:0;
  cursor:pointer;
}
.lx-tg-dialog{
  position:relative;
  z-index:1;
  width:min(920px,100%);
  max-height:min(94vh,820px);
  overflow:auto;
  background:var(--paper,#fff);
  border-radius:28px;
  box-shadow:0 40px 80px -28px rgba(42,33,28,.55);
  display:grid;
  grid-template-columns:minmax(320px,auto) 1fr;
  gap:0;
}
.lx-tg-dialog-preview{
  background:var(--bg,#FAF6F1);
  padding:40px 36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-right:1px solid var(--line,rgba(42,33,28,0.08));
}
.lx-tg-dialog-preview .lx-tg-phone{
  position:relative;
  width:290px;
  max-width:290px;
  height:552px;
  border-radius:44px;
  padding:11px;
  box-sizing:border-box;
  box-shadow:0 40px 80px -30px rgba(42,33,28,.6);
}
.lx-tg-dialog-preview .lx-tg-phone::before{
  content:"";
  position:absolute;
  top:20px;
  left:50%;
  transform:translateX(-50%);
  width:96px;
  height:22px;
  background:#0F0B09;
  border-radius:0 0 14px 14px;
  z-index:2;
  pointer-events:none;
}
.lx-tg-dialog-preview .lx-tg-phone-screen{
  border-radius:34px;
  min-height:0;
  height:100%;
  display:flex;
  flex-direction:column;
}

.lx-tg-dialog-preview .lx-tg-links{gap:10px}
.lx-tg-dialog-preview .lx-tg-link{
  height:44px;min-height:44px;max-height:44px;
  padding:0 16px;font-size:13px;font-weight:600;border-radius:999px;
}
.lx-tg-dialog-preview .lx-tg-badge{font-size:11px;padding:2px 9px}
.lx-tg-dialog-copy{
  padding:36px 32px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:16px;
}
.lx-tg-dialog-kicker{
  font-family:'Space Mono',monospace;
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--teal,#14806E);
}
.lx-tg-dialog-title{
  font-family:'Bricolage Grotesque',sans-serif;
  font-weight:800;
  font-size:clamp(28px,4vw,36px);
  letter-spacing:-0.02em;
  line-height:1.05;
  margin:0;
}
.lx-tg-dialog-pitch{
  margin:0;
  font-size:16px;
  line-height:1.55;
  color:var(--muted,#756A60);
  text-wrap:pretty;
}
.lx-tg-dialog-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.lx-tg-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--coral-strong,#C2410C);
  color:#fff!important;
  font-weight:700;
  font-size:15px;
  padding:14px 22px;
  border-radius:12px;
  border:0;
  text-decoration:none;
}

/* Bio layout skins (layout1–5) — same phone chrome, different page styles */
.lx-tg-skin{
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  padding:10px 10px 12px;
  box-sizing:border-box;
}

.lx-tg-l1{
  align-items:stretch;
  text-align:center;
  padding:0;
  justify-content:flex-start;
  position:relative;
}
.lx-tg-l1-band{
  min-height:42px;
  width:100%;
  background:var(--lx-tg-band, #FF6B4A);
}
.lx-tg-l1-avatar{
  width:48px;height:48px;border-radius:999px;overflow:hidden;margin:-24px auto 6px;flex-shrink:0;
  box-shadow:0 6px 14px -8px rgba(42,33,28,.45);
  border:3px solid #fff;
  position:relative;z-index:1;
}
.lx-tg-l1-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.lx-tg-l1-name{
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:12px;line-height:1.1;margin-bottom:2px;
  padding:0 10px;
}
.lx-tg-l1-meta{font-size:7px;opacity:.68;margin-bottom:6px;line-height:1.2;padding:0 10px}

.lx-tg-l1 .lx-tg-links{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:0 0 auto;
  margin-top:0;
  padding:0 9px 14px;
  box-sizing:border-box;
}
.lx-tg-socials{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0 0 8px;
  color:inherit;
}
.lx-tg-socials i{
  font-size:11px;
  line-height:1;
  opacity:.85;
  width:1.1em;
  text-align:center;
}
.lx-tg-dialog-preview .lx-tg-socials{gap:12px;margin-bottom:12px}
.lx-tg-dialog-preview .lx-tg-socials i{font-size:18px}
.lx-tg-l1 > .lx-tg-socials{
  margin-top:0;
  margin-bottom:8px;
}
.lx-tg-l1 .lx-tg-link{
  flex:0 0 auto;
  height:28px;
  min-height:28px;
  max-height:28px;
  padding:0 10px;
  border-radius:999px;
  font-size:9px;
  font-weight:600;
  justify-content:center;
}
.lx-tg-l1 .lx-tg-link.is-paper{
  background:#fff;
  border:1px solid rgba(42,33,28,.16);
}
.lx-tg-l2{padding:0 0 10px;align-items:stretch}
.lx-tg-l2-banner{
  height:32%;min-height:52px;overflow:hidden;flex-shrink:0;background:center/cover no-repeat;
}
.lx-tg-l2-banner img{display:block;width:100%;height:100%;object-fit:cover}
.lx-tg-l2-avatar{
  width:44px;height:44px;border-radius:999px;border:3px solid #fff;margin:-22px auto 6px;
  overflow:hidden;background:#fff;flex-shrink:0;position:relative;z-index:1;
}
.lx-tg-l2-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.lx-tg-l2-name{
  text-align:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:12px;line-height:1.1;
}
.lx-tg-l2-meta{text-align:center;font-size:8px;opacity:.8;margin:3px 0 6px}
.lx-tg-l2 > .lx-tg-socials{
  margin-top:0;
  margin-bottom:8px;
}
.lx-tg-l2-links{
  padding:0 10px 14px;
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:0 0 auto;
  margin-top:0;
  width:100%;
  box-sizing:border-box;
}
.lx-tg-l2-links .lx-tg-link{
  flex:0 0 auto;
  height:28px;
  min-height:28px;
  max-height:28px;
  padding:0 10px;
  border-radius:999px;
  font-size:9px;
  font-weight:600;
  justify-content:center;
}

.lx-tg-l2--on-color .lx-tg-l2-name,
.lx-tg-l2--on-color .lx-tg-l2-meta{color:#fff}
.lx-tg-l2--on-color .lx-tg-socials,
.lx-tg-l2--on-color .lx-tg-socials i{color:#fff;opacity:.95}

.lx-tg-l3{padding:7px 7px 8px}
.lx-tg-l3-header{
  display:flex;align-items:center;gap:7px;padding:8px;border-radius:11px;color:#fff;flex-shrink:0;margin-bottom:6px;
}
.lx-tg-l3-avatar{width:34px;height:34px;border-radius:999px;overflow:hidden;flex-shrink:0;background:#fff}
.lx-tg-l3-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.lx-tg-l3-copy{min-width:0;flex:1}
.lx-tg-l3-copy strong{
  display:block;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:10px;line-height:1.1;color:#fff;
}
.lx-tg-l3-copy span{display:block;font-size:7px;opacity:.85;margin-top:2px;color:#fff}
.lx-tg-l3 > .lx-tg-socials{
  margin-top:0;
  margin-bottom:8px;
}
.lx-tg-l3-links{
  display:flex;flex-direction:column;gap:6px;padding:0 1px 14px;
  flex:0 0 auto;margin-top:0;width:100%;
}
.lx-tg-l3-links .lx-tg-link{
  flex:0 0 auto;
  height:28px;
  min-height:28px;
  max-height:28px;
  padding:0 10px;
  border-radius:999px;
  font-size:9px;
  font-weight:600;
  justify-content:center;
}
.lx-tg-l3-links .lx-tg-link.is-paper{
  background:#fff;
  border:1px solid rgba(42,33,28,.16);
}
.lx-tg-l5{position:relative;padding:0;color:#fff}
.lx-tg-l5-bg{
  position:absolute;inset:0;background:center/cover no-repeat;transform:scale(1.02);
}
.lx-tg-l5-scrim{
  position:absolute;inset:0;background:linear-gradient(to top,rgba(20,14,10,.92) 0%,rgba(20,14,10,.45) 45%,rgba(20,14,10,.2) 100%);
}
.lx-tg-l5-content{
  position:relative;z-index:1;height:100%;display:flex;flex-direction:column;align-items:center;
  justify-content:flex-end;text-align:center;padding:14px 12px 16px;box-sizing:border-box;
}
.lx-tg-l5-avatar{
  width:48px;height:48px;border-radius:999px;overflow:hidden;border:2px solid rgba(255,255,255,.9);margin-bottom:8px;
}
.lx-tg-l5-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.lx-tg-l5-name{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:13px;color:#fff}
.lx-tg-l5-meta{font-size:8px;color:rgba(255,255,255,.88);margin:3px 0 10px}
.lx-tg-l5-links{width:100%;display:flex;flex-direction:column;gap:6px}
.lx-tg-l5 .lx-tg-link{
  height:28px;min-height:28px;max-height:28px;border-radius:999px;justify-content:center;font-weight:600;
}
.lx-tg-l5 .lx-tg-link.is-paper{background:rgba(255,255,255,.16);color:#fff;border-color:transparent}
.lx-tg-l5 .lx-tg-link.is-ink{background:#2A211C;color:#fff}

.lx-tg-dialog-preview .lx-tg-skin{padding:16px 14px 18px}

.lx-tg-dialog-preview .lx-tg-l1{padding:0}
.lx-tg-dialog-preview .lx-tg-l1-band{min-height:72px}
.lx-tg-dialog-preview .lx-tg-l1-avatar{width:76px;height:76px;margin:-38px auto 12px;border-width:4px}
.lx-tg-dialog-preview .lx-tg-l1-name{font-size:18px;padding:0 16px}
.lx-tg-dialog-preview .lx-tg-l1-meta{font-size:12px;margin-bottom:12px;padding:0 16px}
.lx-tg-dialog-preview .lx-tg-l1 > .lx-tg-socials,
.lx-tg-dialog-preview .lx-tg-l2 > .lx-tg-socials,
.lx-tg-dialog-preview .lx-tg-l3 > .lx-tg-socials{margin-top:0;margin-bottom:12px}
.lx-tg-dialog-preview .lx-tg-l1 .lx-tg-links{gap:10px;padding:0 14px 20px;margin-top:0}
.lx-tg-dialog-preview .lx-tg-l2-links{padding:0 16px 20px;gap:10px;margin-top:0}
.lx-tg-dialog-preview .lx-tg-l3-links{gap:10px;margin-top:0;padding-bottom:20px}
.lx-tg-dialog-preview .lx-tg-l1 .lx-tg-link{height:44px;min-height:44px;max-height:44px;padding:0 16px;font-size:13px}
.lx-tg-dialog-preview .lx-tg-l2{padding:0 0 16px}
.lx-tg-dialog-preview .lx-tg-l2-banner{height:28%;min-height:90px}
.lx-tg-dialog-preview .lx-tg-l2-avatar{width:72px;height:72px;margin:-36px auto 10px;border-width:4px}
.lx-tg-dialog-preview .lx-tg-l2-name{font-size:18px}
.lx-tg-dialog-preview .lx-tg-l2-meta{font-size:12px;margin:4px 0 10px}
.lx-tg-dialog-preview .lx-tg-l3{padding:14px}
.lx-tg-dialog-preview .lx-tg-l3-header{padding:14px;gap:12px;border-radius:16px;margin-bottom:12px}
.lx-tg-dialog-preview .lx-tg-l3-avatar{width:56px;height:56px}
.lx-tg-dialog-preview .lx-tg-l3-copy strong{font-size:15px}
.lx-tg-dialog-preview .lx-tg-l3-copy span{font-size:11px}
.lx-tg-dialog-preview .lx-tg-l3-links .lx-tg-link{height:44px;min-height:44px;max-height:44px;padding:0 16px;font-size:13px;border-radius:999px}
.lx-tg-dialog-preview .lx-tg-l5-content{padding:24px 18px 28px}
.lx-tg-dialog-preview .lx-tg-l5-avatar{width:76px;height:76px;margin-bottom:12px}
.lx-tg-dialog-preview .lx-tg-l5-name{font-size:20px}
.lx-tg-dialog-preview .lx-tg-l5-meta{font-size:12px;margin:6px 0 16px}

.lx-tg-close-secondary,
.lx-tg-close{
  font:inherit;
  cursor:pointer;
}
.lx-tg-close-secondary{
  background:transparent;
  border:1px solid var(--line,rgba(42,33,28,0.16));
  color:var(--ink,#2A211C);
  font-weight:700;
  font-size:15px;
  padding:14px 20px;
  border-radius:12px;
}
.lx-tg-close{
  position:absolute;
  top:14px;
  right:14px;
  width:40px;
  height:40px;
  border-radius:999px;
  border:1px solid var(--line,rgba(42,33,28,0.12));
  background:var(--paper,#fff);
  color:var(--ink,#2A211C);
  font-size:22px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
}
body.lx-tg-open{overflow:hidden}
@media (max-width:760px){
  .lx-tg-dialog{grid-template-columns:1fr}
  .lx-tg-dialog-preview{border-right:0;border-bottom:1px solid var(--line,rgba(42,33,28,0.08));padding:28px 20px}
  .lx-tg-dialog-preview .lx-tg-phone{
    width:min(260px,72vw);
    max-width:min(260px,72vw);
    height:auto;
    aspect-ratio:290 / 552;
  }
  .lx-tg-dialog-copy{padding:28px 22px 32px}
}
@media (max-height:760px) and (min-width:761px){
  .lx-tg-dialog-preview{padding:28px 24px}
  .lx-tg-dialog-preview .lx-tg-phone{
    width:250px;
    max-width:250px;
    height:476px;
    border-radius:38px;
  }
  .lx-tg-dialog-preview .lx-tg-phone::before{width:84px;height:18px;top:16px}
  
  
  
  
  
  .lx-tg-dialog-preview .lx-tg-link{padding:11px 12px;font-size:12px}
}
@media (prefers-reduced-motion:reduce){
  .lx-tg-card{transition:none}
}

.lx-tg-handle{
  font-size:7px;
  opacity:.72;
  line-height:1.2;
  word-break:break-all;
}
.lx-tg-tagline{
  font-size:7px;
  opacity:.68;
  line-height:1.2;
  margin-top:2px;
}

.lx-tg-dialog-preview .lx-tg-handle{font-size:11px}
.lx-tg-dialog-preview .lx-tg-tagline{font-size:12px;margin-top:4px}

@keyframes lx-tg-modal-in {
  from { opacity: 0; transform: scale(.96); }
  to { opacity: 1; transform: scale(1); }
}
.lx-tg-modal .lx-tg-backdrop{
  opacity:0;
  transition:opacity .18s ease;
}
.lx-tg-modal.is-open .lx-tg-backdrop{opacity:1}
.lx-tg-modal .lx-tg-dialog{
  opacity:0;
  transform:scale(.96);
  transition:opacity .2s ease, transform .2s ease;
}
.lx-tg-modal.is-open .lx-tg-dialog{
  opacity:1;
  transform:scale(1);
  animation: lx-tg-modal-in .22s ease both;
}
@media (prefers-reduced-motion:reduce){
  .lx-tg-card{transition:none}
  .lx-tg-modal .lx-tg-backdrop,
  .lx-tg-modal .lx-tg-dialog{
    transition:none!important;
    animation:none!important;
  }
  .lx-tg-modal.is-open .lx-tg-dialog{
    opacity:1;
    transform:none;
  }
}