/* JLPT180 Social Links. Lightweight link buttons only; no embeds. */
body.jlpt180-clean-lobby .jlpt180-social-links,
body.jlpt180-clean-lobby .jlpt180-social-links *{
  box-sizing:border-box;
}

body.jlpt180-clean-lobby .jlpt180-social-links{
  color:#12324a;
}

body.jlpt180-clean-lobby .jlpt180-social-head{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

body.jlpt180-clean-lobby .jlpt180-social-leaf{
  flex:0 0 auto;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:linear-gradient(135deg,#dcfce7,#e0f2fe);
  color:#16a34a;
  box-shadow:inset 0 -2px 0 rgba(22,163,74,.10);
}

body.jlpt180-clean-lobby .jlpt180-social-head strong{
  display:block;
  color:#0f766e;
  font-weight:950;
  line-height:1.12;
}

body.jlpt180-clean-lobby .jlpt180-social-head small{
  display:block;
  margin-top:2px;
  color:#5d7388;
  font-size:11px;
  line-height:1.25;
  font-weight:800;
}

body.jlpt180-clean-lobby .jlpt180-social-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  margin-top:9px;
}

body.jlpt180-clean-lobby .jlpt180-social-btn{
  min-width:0;
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 9px;
  border-radius:999px;
  text-decoration:none;
  border:1px solid rgba(20,184,166,.18);
  background:rgba(255,255,255,.88);
  color:#12324a;
  font-weight:950;
  box-shadow:0 7px 16px rgba(10,115,151,.08), inset 0 1px 0 rgba(255,255,255,.92);
}

body.jlpt180-clean-lobby .jlpt180-social-btn span{
  flex:0 0 auto;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:999px;
  font-weight:1000;
  line-height:1;
}

body.jlpt180-clean-lobby .jlpt180-social-btn b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
}

body.jlpt180-clean-lobby .jlpt180-social-btn.is-tiktok{
  border-color:rgba(236,72,153,.22);
  background:linear-gradient(135deg,#fff,#fdf2f8 52%,#eff6ff);
}
body.jlpt180-clean-lobby .jlpt180-social-btn.is-tiktok span{
  background:#111827;
  color:#fff;
}

body.jlpt180-clean-lobby .jlpt180-social-btn.is-facebook{
  border-color:rgba(37,99,235,.24);
  background:linear-gradient(135deg,#fff,#eff6ff);
}
body.jlpt180-clean-lobby .jlpt180-social-btn.is-facebook span{
  background:#2563eb;
  color:#fff;
  font-family:Arial,sans-serif;
}

body.jlpt180-clean-lobby .jlpt180-social-sidebar{
  display:none;
}

body.jlpt180-clean-lobby .jlpt180-social-dashboard{
  display:none;
}

@media (min-width:900px){
  body.jlpt180-clean-lobby .jlpt180-social-sidebar{
    display:block;
    margin:10px 0 10px;
    padding:11px 10px;
    border:1px solid rgba(20,184,166,.18);
    border-radius:18px;
    background:
      radial-gradient(circle at 8% 10%, rgba(255,214,232,.28), transparent 34%),
      linear-gradient(135deg, rgba(255,255,255,.86), rgba(236,253,245,.76));
    box-shadow:0 9px 18px rgba(10,115,151,.08), inset 0 1px 0 rgba(255,255,255,.88);
  }

  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-head strong{
    font-size:13px;
  }
}

@media (max-width:899px){
  body.jlpt180-clean-lobby .jlpt180-social-dashboard{
    display:block;
    width:min(560px, calc(100% - 20px));
    margin:14px auto 10px;
    padding:15px;
    border-radius:22px;
    border:1px solid rgba(20,184,166,.18);
    background:
      radial-gradient(circle at 0% 0%, rgba(190,242,100,.16), transparent 34%),
      radial-gradient(circle at 100% 4%, rgba(249,168,212,.18), transparent 30%),
      linear-gradient(135deg,rgba(255,255,255,.94),rgba(236,253,245,.88) 58%,rgba(239,246,255,.88));
    box-shadow:0 14px 30px rgba(15,118,110,.10), inset 0 1px 0 rgba(255,255,255,.94);
  }

  body.jlpt180-clean-lobby .jlpt180-social-dashboard .jlpt180-social-actions{
    gap:9px;
  }

  body.jlpt180-clean-lobby .jlpt180-social-dashboard .jlpt180-social-btn{
    min-height:46px;
    font-size:14px;
  }

  body.jlpt180-clean-lobby .jlpt180-social-dashboard .jlpt180-social-btn b{
    font-size:13px;
  }
}

@media (max-width:430px){
  body.jlpt180-clean-lobby .jlpt180-social-dashboard{
    width:calc(100% - 14px);
    margin-top:12px;
    padding:13px;
    border-radius:20px;
  }

  body.jlpt180-clean-lobby .jlpt180-social-actions{
    grid-template-columns:1fr 1fr;
  }

  body.jlpt180-clean-lobby .jlpt180-social-btn{
    padding:0 7px;
  }
}


/* V-SOCIAL-2: keep left sidebar logout visible after adding community links. */
@media (min-width:900px){
  body.jlpt180-clean-lobby .jlpt180-social-sidebar{
    margin:6px 0 6px;
    padding:7px 7px;
    border-radius:15px;
  }
  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-head{
    gap:6px;
  }
  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-leaf{
    width:22px;
    height:22px;
    font-size:12px;
  }
  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-head strong{
    font-size:12px;
    line-height:1.05;
  }
  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-head small{
    display:none;
  }
  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-actions{
    gap:5px;
    margin-top:6px;
  }
  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-btn{
    min-height:32px;
    padding:0 6px;
    gap:4px;
  }
  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-btn span{
    width:20px;
    height:20px;
    font-size:11px;
  }
  body.jlpt180-clean-lobby .jlpt180-social-sidebar .jlpt180-social-btn b{
    font-size:11px;
  }
}