/* Minimal layout for the embed */
.link-app{
  display:flex; flex-direction:column; gap:14px;
  max-width:520px; margin:24px auto; padding:0;
}

/* Pretty buttons */
.rb-btn{
  -webkit-appearance:none; appearance:none; border:1px solid rgba(255,255,255,.12);
  background:rgba(20,24,32,.6);
  color:#e8eef7; border-radius:14px; padding:14px 18px;
  font: 600 16px/1.2 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  display:flex; align-items:center; gap:12px; justify-content:center;
  cursor:pointer; transition:transform .06s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
  position:relative;
}
.rb-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 24px rgba(0,0,0,.25); border-color:rgba(255,255,255,.2); }
.rb-btn:disabled{ opacity:.55; cursor:not-allowed; transform:none; box-shadow:none; }
.rb-btn .icon{ font-size:18px; opacity:.9; }
.rb-btn .spinner{ display:none; font-size:16px; }
.rb-btn.loading .spinner{ display:inline-block; }
.rb-btn .status{ display:none; color:#9BE37B; font-size:16px; }
.rb-btn.done .status{ display:inline-block; }

/* Accents per network */
.rb-steam{ box-shadow: inset 0 0 0 2px rgba(132,255,132,.25); }
.rb-discord{ box-shadow: inset 0 0 0 2px rgba(255,132,132,.25); }
.rb-group{ box-shadow: inset 0 0 0 2px rgba(255,132,132,.25); }

/* Compact on very small widths */
@media (max-width: 420px){
  .rb-btn{ padding:12px 14px; border-radius:12px; font-size:15px; }
  .link-app{ margin:12px auto; }
}
/* Ensure the embed is transparent and full-width */
body.embed, html { background: transparent !important; }
.container, .logo, nav, #logincontent, .card { background: transparent !important; box-shadow: none !important; border: none !important; }
.link-app { margin: 0 !important; padding: 0 !important; }
