.s2047-chatbot{font-family:Arial,Helvetica,sans-serif;z-index:2147483647}.s2047-floating{position:fixed;left:16px;bottom:16px}.s2047-inline{position:relative}.s2047-launcher{display:flex;align-items:center;gap:8px;border:2px solid #ffe66d;background:#111827;color:#fff;border-radius:999px;padding:10px 14px;cursor:pointer;box-shadow:0 0 20px rgba(255,230,109,.35);font-weight:700}.s2047-launcher *{pointer-events:none}.s2047-launcher-robot{font-size:26px}.s2047-panel{display:none;width:min(360px,calc(100vw - 24px));height:min(560px,calc(100vh - 90px));background:radial-gradient(circle at top,#1e3a8a,#050816 55%,#020617);color:#fff;border:2px solid #7dd3fc;border-radius:18px;overflow:hidden;box-shadow:0 0 40px rgba(125,211,252,.45)}.s2047-panel.s2047-open{display:flex;flex-direction:column}.s2047-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:rgba(2,6,23,.88);border-bottom:1px solid rgba(125,211,252,.4)}.s2047-header strong{display:block;font-size:16px}.s2047-header small{display:block;color:#bae6fd;font-size:11px;margin-top:2px;text-transform:uppercase;letter-spacing:.05em}.s2047-close{background:#ef4444;color:#fff;border:0;border-radius:50%;width:30px;height:30px;font-size:24px;line-height:24px;cursor:pointer}.s2047-label{padding:10px 14px 4px;color:#fde68a;font-weight:700;font-size:13px}.s2047-character-select{margin:0 14px 10px;padding:10px;border-radius:10px;border:1px solid #7dd3fc;background:#020617;color:#fff;font-weight:700}.s2047-messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}.s2047-msg{max-width:88%;padding:10px 12px;border-radius:14px;font-size:14px;line-height:1.35;word-wrap:break-word}.s2047-bot{align-self:flex-start;background:rgba(14,165,233,.22);border:1px solid rgba(125,211,252,.45)}.s2047-user{align-self:flex-end;background:rgba(250,204,21,.22);border:1px solid rgba(253,230,138,.65)}.s2047-name{display:block;font-size:11px;font-weight:800;color:#fde68a;margin-bottom:3px;text-transform:uppercase;letter-spacing:.04em}.s2047-form{display:flex;gap:8px;padding:12px;background:rgba(2,6,23,.9);border-top:1px solid rgba(125,211,252,.35)}.s2047-input{flex:1;min-width:0;border-radius:12px;border:1px solid #7dd3fc;background:#fff;color:#020617;padding:11px;font-size:16px}.s2047-send{border:0;border-radius:12px;background:#facc15;color:#111827;font-weight:900;padding:0 14px;cursor:pointer}.s2047-send:hover,.s2047-launcher:hover{filter:brightness(1.08)}@media(max-width:480px){.s2047-floating{left:8px;right:8px;bottom:8px}.s2047-panel{width:100%;height:70vh}.s2047-launcher{padding:9px 12px}.s2047-input{font-size:16px}}


/* Red lipstick kiss marks for the chatbot command: "kiss me" */
.s2047-panel{
  position:relative;
}

.s2047-kiss-layer{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:1000000;
  opacity:1;
  transition:opacity 1.45s ease;
}

.s2047-kiss-layer.s2047-kiss-fade{
  opacity:0;
}

.s2047-kiss-mark{
  position:absolute;
  width:72px;
  height:42px;
  opacity:0;
  animation:s2047KissPop 4.2s ease-out forwards;
  filter:drop-shadow(0 0 8px rgba(255,0,44,.7));
}

.s2047-kiss-mark:before,
.s2047-kiss-mark:after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:38px;
  height:18px;
  background:#e0002d;
  border-radius:50% 50% 42% 42%;
  box-shadow:inset 0 -3px 0 rgba(120,0,20,.28), 0 0 1px rgba(255,255,255,.5);
}

.s2047-kiss-mark:before{
  transform:translate(-88%,-56%) rotate(-16deg);
}

.s2047-kiss-mark:after{
  transform:translate(-12%,-56%) rotate(16deg);
}

@keyframes s2047KissPop{
  0%{opacity:0; transform:translate(-50%,-50%) scale(.25) rotate(-14deg);}
  12%{opacity:1;}
  22%{transform:translate(-50%,-50%) scale(1.08) rotate(8deg);}
  76%{opacity:1;}
  100%{opacity:0; transform:translate(-50%,-60%) scale(1.2) rotate(18deg);}
}


/* Gerald the Intergalactic Giraffe guitar animation */
.s2047-gerald-layer{
  position:absolute;
  inset:0;
  z-index:999998;
  pointer-events:none;
  display:flex;
  align-items:center;
  justify-content:center;
  background:radial-gradient(circle, rgba(20,255,255,.16), rgba(5,5,30,.75));
  opacity:1;
  transition:opacity 1.6s ease;
}

.s2047-gerald-layer.s2047-gerald-fade{
  opacity:0;
}

.s2047-gerald-stage{
  position:relative;
  width:min(82%, 420px);
  height:360px;
  border:2px solid #67f7ff;
  border-radius:24px;
  background:linear-gradient(135deg, rgba(3,12,34,.92), rgba(70,12,90,.86));
  box-shadow:0 0 25px rgba(103,247,255,.7), inset 0 0 20px rgba(255,95,215,.25);
  animation:s2047GeraldBounce 1.2s ease-in-out infinite alternate;
  overflow:hidden;
}

.s2047-gerald-neck{
  position:absolute;
  left:48%;
  top:42px;
  width:34px;
  height:145px;
  background:linear-gradient(#d89a42,#f3c46d);
  border-radius:22px;
  transform:rotate(-6deg);
  box-shadow:0 0 12px rgba(255,218,120,.7);
}

.s2047-gerald-head{
  position:absolute;
  left:42%;
  top:8px;
  font-size:78px;
  filter:drop-shadow(0 0 10px #ffe066);
  animation:s2047GeraldHead 0.6s ease-in-out infinite alternate;
}

.s2047-gerald-body{
  position:absolute;
  left:38%;
  top:155px;
  font-size:116px;
  filter:drop-shadow(0 0 14px #ff5fd7);
  animation:s2047GuitarStrum .28s ease-in-out infinite alternate;
}

.s2047-gerald-caption{
  position:absolute;
  left:0;
  right:0;
  bottom:18px;
  text-align:center;
  color:#fff;
  font-weight:900;
  font-size:20px;
  text-shadow:0 0 10px #67f7ff;
  padding:0 14px;
}

.s2047-music-notes{
  position:absolute;
  left:0;
  right:0;
  top:90px;
  text-align:center;
  color:#ffe66d;
  font-size:34px;
  letter-spacing:10px;
  animation:s2047Notes 1.1s linear infinite;
  text-shadow:0 0 12px #ffe66d;
}

@keyframes s2047GeraldBounce{
  from{transform:translateY(8px) rotate(-1deg);}
  to{transform:translateY(-10px) rotate(1deg);}
}

@keyframes s2047GeraldHead{
  from{transform:rotate(-8deg);}
  to{transform:rotate(8deg);}
}

@keyframes s2047GuitarStrum{
  from{transform:translateX(-5px) rotate(-4deg);}
  to{transform:translateX(5px) rotate(4deg);}
}

@keyframes s2047Notes{
  0%{transform:translateY(20px);opacity:.2;}
  40%{opacity:1;}
  100%{transform:translateY(-70px);opacity:0;}
}


/* Space 2047 independent audio player button to the left of the chatbot */
#s2047-left-audio-button {
  position: fixed !important;
  right: 320px !important;
  bottom: 28px !important;
  width: 82px !important;
  min-height: 58px !important;
  padding: 8px 7px !important;
  border: 2px solid #00eaff !important;
  border-radius: 18px !important;
  background: radial-gradient(circle at top, #173f86, #061326) !important;
  color: #ffffff !important;
  font-size: 24px !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  text-align: center !important;
  cursor: pointer !important;
  box-shadow: 0 0 20px rgba(0,234,255,.65) !important;
  z-index: 2147483000 !important;
}

#s2047-left-audio-button span {
  display: block !important;
  font-size: 12px !important;
  margin-top: 3px !important;
}

#s2047-left-audio-button:hover {
  transform: scale(1.04) !important;
}

#s2047-audio-popup {
  display: none;
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,.72) !important;
  z-index: 2147483647 !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  box-sizing: border-box !important;
}

#s2047-audio-popup.open {
  display: flex !important;
}

.s2047-audio-card {
  width: min(94vw, 760px) !important;
  max-height: 92vh !important;
  overflow-y: auto !important;
  display: grid !important;
  grid-template-columns: 190px 1fr !important;
  gap: 16px !important;
  background: radial-gradient(circle at top, #241054, #020714 72%) !important;
  border: 3px solid #00eaff !important;
  border-radius: 24px !important;
  padding: 18px !important;
  color: #ffffff !important;
  position: relative !important;
  box-shadow: 0 0 35px rgba(0,234,255,.65) !important;
}

.s2047-audio-close {
  position: absolute !important;
  top: 10px !important;
  right: 12px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  border: none !important;
  background: #ff4242 !important;
  color: #ffffff !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.s2047-audio-art {
  min-height: 240px !important;
  border-radius: 18px !important;
  background: radial-gradient(circle, #6f39c8, #071530) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 92px !important;
  animation: s2047AudioPulse 1.15s ease-in-out infinite !important;
}

.s2047-audio-panel h2 {
  margin: 6px 48px 10px 0 !important;
  color: #ffe000 !important;
  font-size: 25px !important;
}

.s2047-audio-status {
  padding: 10px !important;
  border-radius: 10px !important;
  background: rgba(0,0,0,.38) !important;
  border: 1px solid rgba(0,234,255,.48) !important;
  margin-bottom: 10px !important;
}

.s2047-audio-element {
  width: 100% !important;
  display: block !important;
  margin: 10px 0 !important;
}

.s2047-audio-controls {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 10px 0 !important;
}

.s2047-audio-controls button {
  border: none !important;
  border-radius: 999px !important;
  padding: 9px 12px !important;
  background: #ffe000 !important;
  color: #111111 !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.s2047-audio-list {
  max-height: 260px !important;
  overflow-y: auto !important;
  margin-left: 20px !important;
}

.s2047-audio-list li {
  padding: 8px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
}

.s2047-audio-list li.active {
  background: rgba(255,224,0,.23) !important;
  box-shadow: inset 4px 0 0 #ffe000 !important;
}

@media (max-width: 650px) {
  #s2047-left-audio-button {
    right: 260px !important;
    bottom: 8px !important;
    width: 72px !important;
  }
  .s2047-audio-card {
    grid-template-columns: 1fr !important;
  }
  .s2047-audio-art {
    min-height: 160px !important;
    font-size: 74px !important;
  }
}

@keyframes s2047AudioPulse {
  0%,100% { transform: scale(1); }
  50% { transform: scale(1.04); }
}
