/* Нативное увеличение (без transform) */
.flw{
  gap: 14px;
}
.flw__hero{ padding: 18px; }
.flwsrv{ padding: 18px; }

.flw__title{ font-size: 18px; }
.flw__subtitle{ font-size: 13px; }

.flw__tag{ font-size: 12px; padding: 7px 12px; }

.flwcard{ padding: 14px; }
.flwcard__title{ font-size: 14px; }
.flwcard__desc{ font-size: 13px; }

.flwbtn{ padding: 12px 14px; font-size: 13px; }

.flw__logo{ width: 52px; height: 52px; border-radius: 18px; }
.flw__logoimg{ padding: 7px; border-radius: 18px; }





/* ===== FROSTLINE WIDGET THEME ===== */

.flw{
  --bg: rgba(10, 14, 24, .72);
  --panel: rgba(255,255,255,.06);
  --stroke: rgba(255,255,255,.12);
  --text: rgba(255,255,255,.93);
  --muted: rgba(255,255,255,.70);

  --ice: #38bdf8;
  --violet: #a78bfa;
  --mint: #2cd9aa;
  --pink: #fb7185;

  --r: 16px;
  --r2: 20px;

  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  color: var(--text);
  display: grid;
  gap: 12px;
}

/* Hero */
.flw__hero{
  position: relative;
  overflow: hidden;
  padding: 14px 14px 12px;
  border-radius: var(--r2);
  border: 1px solid var(--stroke);
  background:
    radial-gradient(260px 160px at 20% 20%, rgba(56,189,248,.22), transparent 60%),
    radial-gradient(260px 160px at 85% 30%, rgba(167,139,250,.18), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow: 0 16px 50px rgba(0,0,0,.35);
}

.flw__brand{
  display: flex;
  align-items: center;
  gap: 12px;
}



.flw__title-icon{
  width: 28px;
  height: 28px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 0 0 6px rgba(56,189,248,.10);
}

.flw__subtitle{
  font-size: 12px;
  color: var(--muted);
  margin-top: 3px;
}

.flw__tags{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.flw__tag{
  font-size: 11px;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
  color: rgba(255,255,255,.9);
}
.flw__tag--ice{
  border-color: rgba(56,189,248,.35);
  background: rgba(56,189,248,.12);
}
.flw__tag--violet{
  border-color: rgba(167,139,250,.35);
  background: rgba(167,139,250,.12);
}

/* Grid */
.flw__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 520px){
  .flw__grid{ grid-template-columns: 1fr; }
}

/* Social cards */
.flwcard{
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 12px;
  border-radius: var(--r);
  border: 1px solid var(--stroke);
  background: var(--panel);
  text-decoration: none;
  color: var(--text);
  box-shadow: 0 14px 36px rgba(0,0,0,.25);
  transition: transform .14s ease, border-color .14s ease, background .14s ease;
}
.flwcard:hover{
  transform: translateY(-2px);
  border-color: rgba(56,189,248,.30);
  background: rgba(255,255,255,.07);
}
.flwcard::before{
  content:"";
  position:absolute;
  inset:-1px;
  opacity:.55;
  pointer-events:none;
  background: radial-gradient(220px 120px at 20% 30%, rgba(255,255,255,.20), transparent 60%);
}

.flwcard__icon{
  width: 36px;
  height: 36px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  display: inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(0,0,0,.18);
  color: rgba(255,255,255,.92);
}
.flwcard__body{ flex: 1; position: relative; z-index: 2; }
.flwcard__title{ font-weight: 950; letter-spacing: .2px; }
.flwcard__desc{ font-size: 12px; color: var(--muted); margin-top: 2px; }
.flwcard__cta{
  position: relative;
  z-index: 2;
  font-size: 11px;
  font-weight: 950;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.16);
}

.flwcard--discord{
  background:
    radial-gradient(240px 140px at 20% 30%, rgba(167,139,250,.18), transparent 60%),
    rgba(255,255,255,.06);
}
.flwcard--discord:hover{ border-color: rgba(167,139,250,.35); }

.flwcard--tg{
  background:
    radial-gradient(240px 140px at 20% 30%, rgba(56,189,248,.20), transparent 60%),
    rgba(255,255,255,.06);
}
.flwcard--tg:hover{ border-color: rgba(56,189,248,.35); }

/* Server card */
.flwsrv{
  border-radius: var(--r2);
  border: 1px solid var(--stroke);
  background:
    radial-gradient(320px 180px at 20% 10%, rgba(56,189,248,.18), transparent 62%),
    radial-gradient(320px 180px at 90% 30%, rgba(167,139,250,.14), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow: 0 18px 55px rgba(0,0,0,.35);
  padding: 14px;
}

.flwsrv__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

.flwsrv__name{
  font-weight: 950;
  letter-spacing: .3px;
  display:flex;
  align-items:center;
  gap:10px;
}
.flwsrv__dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--ice), var(--violet));
  box-shadow: 0 0 0 6px rgba(56,189,248,.10);
}

.flwsrv__pill{
  font-size: 11px;
  font-weight: 900;
  color: rgba(255,255,255,.85);
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.16);
  text-align:right;
}

.flwsrv__meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom: 12px;
}

.flwsrv__badge{
  font-size: 11px;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.16);
  color: rgba(255,255,255,.85);
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.flwsrv__badge--online{
  border-color: rgba(44,217,170,.25);
  background: rgba(44,217,170,.10);
}
.flwsrv__badgeDot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--mint);
  box-shadow: 0 0 0 6px rgba(44,217,170,.10);
}

.flwsrv__connect{
  display:flex;
  align-items:stretch;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.flwsrv__ip{
  flex: 1;
  min-width: 210px;
  border-radius: var(--r);
  border: 1px dashed rgba(255,255,255,.18);
  background: rgba(0,0,0,.16);
  padding: 10px 12px;
}

.flwsrv__label{
  font-size: 11px;
  color: var(--muted);
  font-weight: 900;
  letter-spacing: .2px;
}
.flwsrv__value{
  margin-top: 6px;
  font-size: 13px;
  font-weight: 950;
  letter-spacing: .2px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.flwsrv__buttons{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
  min-width: 240px;
  flex: 0 0 260px;
}
@media (max-width: 520px){
  .flwsrv__buttons{ grid-template-columns: 1fr; flex: 1 1 auto; min-width: unset; }
}

.flwbtn{
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.92);
  border-radius: 14px;
  padding: 10px 12px;
  font-weight: 950;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition: transform .14s ease, background .14s ease, border-color .14s ease;
}
.flwbtn:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.07);
}

.flwbtn--play{
  border-color: rgba(44,217,170,.32);
  background: linear-gradient(135deg, rgba(44,217,170,.18), rgba(56,189,248,.10));
}
.flwbtn--copy{
  border-color: rgba(56,189,248,.32);
  background: linear-gradient(135deg, rgba(56,189,248,.16), rgba(167,139,250,.10));
}

.flwsrv__foot{
  margin-top: 10px;
}
.flwsrv__hint{
  font-size: 11px;
  color: var(--muted);
  line-height: 1.35;
}

/* Toast */
.flwtoast{
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 99999;
  display:none;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(17,24,39,.92);
  color: rgba(255,255,255,.92);
  font-weight: 950;
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
  backdrop-filter: blur(6px);
}
.flwtoast.is-show{ display:block; }
.flwtoast.is-err{
  border-color: rgba(251,113,133,.35);
  background: rgba(251,113,133,.12);
}
.flw__title-icon{
  width: 28px;
  height: 28px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 0 0 6px rgba(56,189,248,.10);
}