.lp-dj-root {
	  position: fixed;
	  right: 12px;
	  top: 96px;
	  z-index: 1100;
	  display: grid;
	  justify-items: end;
	  gap: 10px;
	}
	.lp-dj-toggle {
	  border: 0;
	  border-radius: 14px 3px 3px 14px;
	  background: #22d3ee;
	  color: #030712;
	  padding: 10px 16px;
	  font-weight: 900;
	  cursor: pointer;
	  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.34);
	}
	.lp-dj-panel[hidden],
	.lp-beatai-panel[hidden] {
	  display: none !important;
	}
	.lp-dj-panel {
	  width: min(330px, calc(100vw - 24px));
	  border-radius: 20px;
	  border: 1px solid rgba(255, 255, 255, 0.14);
	  background: rgba(10, 10, 12, 0.98);
	  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.5);
	  padding: 16px;
	}
	.lp-floating-head {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  gap: 12px;
	  margin-bottom: 12px;
	}
	.lp-floating-title {
	  margin: 0;
	  color: #67e8f9;
	  font-size: 15px;
	  font-weight: 900;
	}
	.lp-floating-close {
	  width: 30px;
	  height: 30px;
	  border-radius: 999px;
	  border: 1px solid rgba(255, 255, 255, 0.18);
	  background: transparent;
	  color: #d4d4dc;
	  cursor: pointer;
	}
	.lp-floating-close:hover {
	  border-color: #fff;
	  color: #fff;
	}
	.lp-dj-form {
	  display: grid;
	  gap: 9px;
	}
	.lp-floating-input,
	.lp-floating-textarea {
	  width: 100%;
	  border-radius: 10px;
	  border: 1px solid rgba(255, 255, 255, 0.12);
	  background: rgba(255, 255, 255, 0.06);
	  color: #fff;
	  padding: 10px 11px;
	  font: inherit;
	  font-size: 13px;
	  outline: none;
	}
	.lp-floating-textarea {
	  min-height: 64px;
	  resize: vertical;
	}
	.lp-floating-status {
	  min-height: 16px;
	  color: #d8d8e0;
	  font-size: 12px;
	  line-height: 1.45;
	}
	.lp-dj-submit,
	.lp-beatai-send {
	  border: 0;
	  border-radius: 12px;
	  background: #22d3ee;
	  color: #030712;
	  padding: 10px 12px;
	  font: inherit;
	  font-size: 13px;
	  font-weight: 900;
	  cursor: pointer;
	}
	.lp-dj-submit:disabled,
	.lp-beatai-send:disabled {
	  opacity: 0.62;
	  cursor: wait;
	}
	.lp-beatai-toggle {
	  position: fixed;
	  right: 0;
	  bottom: 24px;
	  z-index: 1100;
	  border: 1px solid rgba(34, 211, 238, 0.45);
	  border-right: 0;
	  border-radius: 18px 0 0 18px;
	  background: linear-gradient(135deg, #062b34, #111827);
	  color: #e0fbff;
	  padding: 14px 22px 14px 18px;
	  font-weight: 900;
	  letter-spacing: 0.02em;
	  cursor: pointer;
	  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.42);
	  transform: translateX(42%);
	  transition: transform 0.22s ease, filter 0.22s ease;
	}
	.lp-beatai-toggle:hover,
	.lp-beatai-toggle:focus {
	  transform: translateX(0);
	  filter: brightness(1.08);
	}
	.lp-beatai-panel {
	  position: fixed;
	  right: 16px;
	  bottom: 20px;
	  z-index: 1101;
	  width: min(340px, calc(100vw - 32px));
	  border-radius: 20px;
	  border: 1px solid rgba(34, 211, 238, 0.35);
	  background: rgba(8, 10, 12, 0.98);
	  box-shadow: 0 28px 62px rgba(0, 0, 0, 0.56);
	  padding: 16px;
	}
	.lp-beatai-desc {
	  margin: -4px 0 12px;
	  color: #a8b5c2;
	  font-size: 12px;
	  line-height: 1.5;
	}
	.lp-beatai-messages {
	  display: grid;
	  gap: 8px;
	  max-height: 260px;
	  overflow: auto;
	  padding-right: 2px;
	}
	.lp-beatai-message {
	  border-radius: 14px;
	  padding: 9px 11px;
	  font-size: 12px;
	  line-height: 1.5;
	  white-space: pre-wrap;
	}
	.lp-beatai-message.user {
	  justify-self: end;
	  max-width: 88%;
	  background: rgba(191, 90, 242, 0.18);
	  color: #fff;
	}
	.lp-beatai-message.assistant {
	  justify-self: start;
	  max-width: 92%;
	  background: rgba(255, 255, 255, 0.07);
	  color: #e8f6fa;
	}
	.lp-beatai-form {
	  display: grid;
	  grid-template-columns: minmax(0, 1fr) auto;
	  gap: 8px;
	  margin-top: 12px;
	}

@media (max-width: 1100px) {
  .lp-dj-root {
    top: 86px;
    right: 8px;
  }

  .lp-beatai-toggle {
    bottom: 12px;
    padding: 12px 18px 12px 16px;
  }
}