/* MMN mascot help — dark shell, accent #ef2b2d, clear of BottomNav/PlayerChrome */
.mmn-mascot-root {
  position: fixed;
  right: 16px;
  bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  z-index: 55;
  font-family: Inter, system-ui, sans-serif;
  color: #f5f5f7;
}
@media (min-width: 900px) {
  .mmn-mascot-root { bottom: 110px; right: 24px; }
}
.mmn-mascot-btn {
  width: 72px; height: 72px; border: 0; border-radius: 50%; padding: 0; cursor: pointer;
  background: radial-gradient(circle at 30% 25%, #2a2a36, #121218 70%);
  box-shadow: 0 8px 24px rgba(0,0,0,.45), 0 0 0 2px rgba(239,43,45,.35);
  overflow: visible; position: relative;
}
.mmn-mascot-btn:hover { box-shadow: 0 10px 28px rgba(0,0,0,.5), 0 0 0 2px #ef2b2d; }
.mmn-mascot-btn img { width: 64px; height: 64px; margin: 4px; display: block; object-fit: contain; border-radius: 50%; }
.mmn-mascot-bubble {
  position: absolute; right: 84px; bottom: 16px; max-width: 220px;
  background: #1a1a24; color: #f5f5f7; padding: 10px 12px; border-radius: 14px;
  border: 1px solid rgba(239,43,45,.35); box-shadow: 0 6px 20px rgba(0,0,0,.35);
  font-size: 13px; line-height: 1.35;
}
.mmn-mascot-bubble::after {
  content: ""; position: absolute; right: -6px; bottom: 18px;
  border: 6px solid transparent; border-left-color: #1a1a24;
}
.mmn-mascot-panel {
  position: absolute; right: 0; bottom: 88px; width: min(360px, calc(100vw - 24px)); height: 420px;
  background: #0f0f14; color: #f5f5f7; border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 16px 40px rgba(0,0,0,.5); display: flex; flex-direction: column; overflow: hidden;
}
.mmn-mascot-panel[hidden] { display: none; }
.mmn-mascot-panel header {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  background: #1a1a24; border-bottom: 1px solid rgba(239,43,45,.25);
}
.mmn-mascot-panel header img { width: 36px; height: 36px; border-radius: 50%; object-fit: contain; background: #121218; }
.mmn-mascot-panel header strong { flex: 1; font-size: 14px; }
.mmn-mascot-panel header button { background: transparent; border: 0; color: #aaa; font-size: 18px; cursor: pointer; }
.mmn-mascot-msgs { flex: 1; overflow: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.mmn-mascot-msg { max-width: 85%; padding: 8px 10px; border-radius: 12px; font-size: 13px; line-height: 1.4; }
.mmn-mascot-msg.bot { align-self: flex-start; background: #252533; }
.mmn-mascot-msg.user { align-self: flex-end; background: #ef2b2d; color: #fff; }
.mmn-mascot-form { display: flex; gap: 8px; padding: 10px; border-top: 1px solid #2a2a36; }
.mmn-mascot-form input {
  flex: 1; border-radius: 10px; border: 1px solid #333; background: #181822; color: #fff; padding: 10px;
}
.mmn-mascot-form button {
  border: 0; border-radius: 10px; background: #ef2b2d; color: #fff; padding: 0 14px; cursor: pointer; font-weight: 650;
}
.mmn-mascot-profile {
  padding: 0 12px 12px; font-size: 12px; color: #bbb; display: flex; align-items: center; gap: 8px;
}
.mmn-mascot-profile select {
  background: #181822; color: #f5f5f7; border: 1px solid #333; border-radius: 8px; padding: 4px 8px;
}