:root{
    --color-bg:#FFFFFF;
    --color-muted:#F8FAF9;
    --color-text:#0B1F17;
    --color-accent:#16A34A;
    --color-accent-700:#12823D;
    --color-border:#E6EDE9;
    --overlay:#06261C99; /* rgba(6,38,28,0.6) */
    --shadow-soft:0 10px 30px rgba(0,0,0,0.08);
    --radius-lg:18px;
    --radius-md:14px;
}
  /* Overlay */
  .ig-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.68);
    display: grid;
    place-items: center;
    padding: 16px;
    z-index: 1000;
  }

  /* Dialog as 3-row grid to keep footer visible */
  .ig-dialog{
    position:relative;
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-soft);
    width: min(490px, 92vw);
    max-height: 90vh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    overflow: hidden;
    animation: dialogFlyIn 0.4s ease-out forwards;
  }
  
  @keyframes dialogFlyIn {
    from {
      opacity: 0;
      transform: translateY(-30px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  @keyframes dialogFadeIn {
    from {
      opacity: 0;
      transform: scale(0.95) translateY(10px);
    }
    to {
      opacity: 1;
      transform: scale(1) translateY(0);
    }
  }

  .ig-content{
    min-height:0;
    overflow: clip;
    padding: 14px 16px;
    display: grid;
    gap: 12px;
  }

  .ig-stack{
    width: 100%;
    max-width: 450px;
    display: grid;
    gap: 12px;
    margin: 0 auto;
    justify-items: stretch;
  }

  /* Header */
  .ig-header{
    display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  }
  .ig-header > div{ flex:1; display:flex; flex-direction:column; align-items:center; }
  .ig-title{
    font-size:22px; line-height:1.3; font-weight:700; margin:0; text-align:center;
  }
  .ig-subline{
    margin:6px 0 0 0; font-size:14px; line-height:1.6; color:#2A3D34; text-align:center;
  }
  .ig-close{
    appearance:none; border:none; background:transparent; cursor:pointer; padding:6px; border-radius:8px; color:#21362D;
    position:absolute; right:12px; top:12px;
  }
  .ig-close:hover{ background:#F0F5F2; }
  .ig-close:focus-visible{ outline:2px solid var(--color-accent); outline-offset: 2px; }

  /* Feature panel */
  .ig-panel{
    position:relative;
    border-radius:16px;
    padding:12px;
    background: linear-gradient(180deg, #F4FBF7 0%, #F1F8F4 100%);
    border:1px solid #DDEAE3;
    box-shadow: 0 6px 24px rgba(6,38,28,0.06);
  }
  .ig-panel::before,
  .ig-panel::after{
    content:""; position:absolute; pointer-events:none; border-radius:16px;
    width:120px; height:60px; filter: blur(12px);
  }
  .ig-panel::before{ left:10px; top:10px; background: radial-gradient(ellipse at left top, rgba(34,197,94,0.08), transparent 70%); }
  .ig-panel::after{ right:10px; bottom:10px; background: radial-gradient(ellipse at right bottom, rgba(59,130,246,0.08), transparent 70%); }

  .ig-value-props{ display:grid; grid-template-columns:1fr; gap:12px; }
  .ig-card{
    display:flex; gap:12px; align-items:center;
    background:#FFFFFF; border:1px solid #E7EEE9; border-radius:12px;
    padding:10px 12px; box-shadow:0 2px 10px rgba(6,38,28,0.05);
  }
  .ig-icon{ width:24px; height:24px; flex:0 0 24px; }
  .ig-badge{
    width:28px; height:28px; border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center; color:#fff; flex:0 0 28px;
  }
  .ig-badge--green{ background:#22C55E; }
  .ig-badge--blue{ background:#3B82F6; }
  .ig-badge--purple{ background:#8B5CF6; }
  .ig-card h4{ margin:0 0 2px 0; font-size:15px; line-height:1.4; font-weight:600; }
  .ig-card p{ margin:0; font-size:14px; line-height:1.6; color:#2A3D34; }

  /* Divider */
  .ig-divider{ height:1px; background:#E2ECE6; border-radius:1px; margin:12px 0 10px; }

  /* Subtitle and hint */
  .ig-subtitle{ display:flex; justify-content:center; align-items:center; gap:8px; margin-top:18px; flex-wrap:wrap; text-align:center; }
  .ig-subtitle > span:first-child{ font-size:18px; font-weight:700; color:#0B5F3A; text-shadow:0 1px 0 rgba(255,255,255,.7), 0 1px 2px rgba(4,27,18,.16); }
  .ig-chip{
    display:inline-flex; align-items:center; gap:6px; height:28px; padding:4px 10px; border-radius:999px;
    border:1px solid #CFE9DA; background:#F2FBF6; color:#1B5E3B; font-weight:600; font-size:12.5px; cursor:pointer;
  }
  .ig-chip:hover{ background:#E8F8F0; }

  .ig-hint{ margin:6px 0 8px; text-align:center; color:#304A3D; font-size:14px; }

  /* Form */
  .ig-form{ display:grid; gap:12px; margin-top:0; }
  .ig-field{ width:100%; }
  .ig-input{
    width:100%; font-size:15px; line-height:1.4; padding:10px 12px; height:42px; border-radius:10px;
    border:1px solid var(--color-border); background:#fff;
    transition:border-color .15s ease, box-shadow .15s ease;
  }
  .ig-input::placeholder{ color:#6A7B73; }
  .ig-input:focus{ outline:none; border-color:var(--color-accent); box-shadow:0 0 0 3px rgba(22,163,74,0.16); }
  .ig-input[aria-invalid="true"]{ border-color:#DC2626; box-shadow:0 0 0 3px rgba(220,38,38,0.12); }
  .ig-error{ min-height:18px; font-size:12px; color:#B91C1C; }

  .ig-consent{ display:flex; align-items:flex-start; gap:10px; font-size:14px; line-height:1.5; }
  .ig-consent input{ margin-top:3px; width:16px; height:16px; accent-color:var(--color-accent); }
  .ig-consent a{ color:#246C4A; text-decoration: underline; }

  .ig-actions{ display:grid; gap:12px; }
  .ig-btn{
    appearance:none; border:none; border-radius:12px; height:46px; padding:0 16px;
    font-weight:600; font-size:15px; cursor:pointer; color:#fff; background:var(--color-accent);
    transition: background-color .15s ease, opacity .15s ease, transform .02s ease;
  }
  .ig-btn:hover{ background: var(--color-accent-700); }
  .ig-btn:disabled{ opacity:.45; cursor:not-allowed; }
  .ig-btn:active{ transform: translateY(1px); }

  /* Telegram plain link */
  .ig-telegram-wrap{ display:flex; justify-content:center; }
  .ig-telegram-inner{ width:100%; max-width:450px; display:flex; justify-content:flex-start; }
  .ig-cta-telegram{
    border:0; background:transparent; padding:0; border-radius:0;
    display:inline-flex; align-items:center; gap:8px; color:#176341; font-weight:600;
    text-decoration: underline; text-underline-offset:2px;
  }
  .ig-cta-telegram:hover{ color:#0E4E33; }
  .ig-cta-telegram .tg-dot{
    width:16px; height:16px; border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center;
    background:#E7F6EE; color:#16A34A;
  }

  /* Footer */
  .ig-footer{ padding:10px 12px 12px; text-align:center; font-size:12px; color:#2A3D34; }

  /* Short viewport tight mode */
  @media (max-height:740px){
    .ig-content{ gap:8px; padding:12px 14px; }
    .ig-stack{ gap:8px; }
    .ig-panel{ padding:10px; }
    .ig-card{ padding:8px 10px; }
    .ig-input{ height:40px; padding:9px 11px; }
    .ig-actions .ig-btn{ height:44px; }
    .ig-hint{ font-size:13px; margin:4px 0 6px; }
  }

  /* Mobile width safety */
  @media (max-width:390px){
    .ig-dialog{ width:92vw; }
    .ig-stack{ max-width:92vw; }
  }

.ig-dialog{ width:min(470px, 92vw); }
.ig-stack{ max-width:440px; }
.ig-content{ gap:10px; padding:12px 14px; }

.ig-title{ font-size:20px; line-height:1.3; }
.ig-subline{ font-size:13px; line-height:1.55; margin-top:6px; }

.ig-panel{ padding:10px; }
.ig-card{ padding:9px 10px; border-radius:12px; }
.ig-card h4{ font-size:14px; }
.ig-card p{ font-size:13px; line-height:1.55; }

.ig-subtitle{ gap:6px; margin-top:14px; }
.ig-subtitle > span:first-child{ font-size:17px; }
.ig-chip{ height:26px; padding:3px 10px; font-size:12px; }

.ig-hint{ margin:4px 0 6px; font-size:13px; }
.ig-form{ gap:10px; }
.ig-input{ height:40px; padding:9px 11px; border-radius:10px; font-size:14.5px; }
.ig-input:focus{ box-shadow:0 0 0 2px rgba(22,163,74,0.12); border-color:#16A34A; }

.ig-consent{ gap:8px; font-size:13px; }
.ig-actions .ig-btn{ height:44px; font-size:14px; }

.ig-telegram-wrap{ margin-top:8px; }
.ig-footer{ padding:10px 12px 12px; }

.ig-divider{ margin: 8px 0 8px; }

.ig-subtitle{ gap:6px; margin-top:8px; }
.ig-subtitle > span:first-child{ font-size:16px; font-weight:700; }
.ig-chip{ height:24px; padding:2px 8px; font-size:11.5px; }

.ig-hint{ margin:4px 0 6px; font-size:12.5px; }
.ig-form{ gap:8px; }
.ig-input{ height:38px; padding:8px 10px; font-size:14px; border-radius:10px; }
.ig-input:focus{ box-shadow:0 0 0 1.5px rgba(22,163,74,0.14); border-color:#16A34A; }

.ig-consent{ gap:8px; font-size:12.5px; }
.ig-actions .ig-btn{ height:42px; font-size:13.5px; }

.ig-telegram-wrap{ margin-top:6px; }
.ig-telegram-inner{ max-width:440px; }
.ig-cta-telegram{ font-size:13px; }
.ig-cta-telegram .tg-dot{ width:14px; height:14px; }

.ig-content{ padding-bottom:10px; }

@media (max-height:760px){
  .ig-subtitle{ margin-top:6px; }
  .ig-input{ height:36px; padding:7px 9px; }
  .ig-actions .ig-btn{ height:40px; }
  .ig-cta-telegram{ font-size:12.5px; }
}

.ig-divider{ margin: 6px 0 6px; }
.ig-subtitle{ margin-top: 4px; gap:6px; }
.ig-hint{ margin: 4px 0 6px; }

.ig-form{ display:grid; justify-items:center; gap:10px; }
.ig-field,
.ig-actions,
.ig-consent{
  width:100%;
  max-width: 440px;
  margin-left:auto;
  margin-right:auto;
}
.ig-input{
  width:100%;
  box-sizing:border-box;
}

.ig-telegram-wrap{
  margin-top:8px;
  display:flex;
  justify-content:center;
}
.ig-telegram-inner{
  width:100%;
  max-width:440px;
  display:flex;
  justify-content:center;
}
.ig-cta-telegram{ font-size:13px; }

@media (max-height:760px){
  .ig-subtitle{ margin-top: 4px; }
  .ig-telegram-wrap{ margin-top:6px; }
}