/* =====================================================================
   🏝️ MONKEY ISLAND TAKEOVER — SCUMM-style adventure scene
   Loaded on demand via <link> in index.html / cheats.html / achievements.html
   ===================================================================== */

/* Glitch transition (in & out) */
.mrv-mi-glitch {
  position: fixed; inset: 0; z-index: 99998;
  background:
    repeating-linear-gradient(0deg, rgba(0,255,0,0.08) 0 2px, transparent 2px 4px),
    repeating-linear-gradient(90deg, rgba(255,0,200,0.08) 0 3px, transparent 3px 6px),
    #000;
  animation: mrv-mi-glitch-in 0.6s steps(8) both;
  pointer-events: all;
}
.mrv-mi-glitch.to-black { background: #000; transition: background 0.6s; }
.mrv-mi-glitch.out { animation: mrv-mi-glitch-out 0.9s steps(8) both; }
@keyframes mrv-mi-glitch-in {
  0%   { opacity: 0; filter: hue-rotate(0deg); transform: translateX(0); }
  20%  { opacity: 1; transform: translateX(-6px); filter: hue-rotate(60deg); }
  40%  { transform: translateX(8px); filter: hue-rotate(180deg); }
  60%  { transform: translateX(-4px); filter: hue-rotate(280deg); }
  100% { opacity: 1; transform: translateX(0); filter: hue-rotate(0deg); }
}
@keyframes mrv-mi-glitch-out {
  0%   { opacity: 0; }
  20%  { opacity: 1; transform: translateX(4px); filter: hue-rotate(120deg); }
  60%  { transform: translateX(-6px); filter: hue-rotate(300deg); }
  100% { opacity: 0; }
}

/* Scene root */
.mrv-mi-scene {
  position: fixed; inset: 0; z-index: 99997;
  overflow: hidden;
  font-family: 'Press Start 2P', monospace;
  color: #e7ffe7;
  opacity: 0;
  transition: opacity 0.5s ease;
  cursor: crosshair;
  image-rendering: pixelated;
}
.mrv-mi-scene.on  { opacity: 1; }
.mrv-mi-scene.off { opacity: 0; }

/* Sky — moonlit pirate night with sunset hues */
.mrv-mi-sky {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    #08081e 0%,
    #1a0f3a 18%,
    #3d1e5e 35%,
    #6b1f6f 55%,
    #b73a4a 72%,
    #ff8c42 84%,
    #ffc870 92%,
    #2a1a3a 100%);
}

/* Pixel star field */
.mrv-mi-stars {
  position: absolute; inset: 0;
  background-image:
    radial-gradient(2px 2px at 8% 12%,  #fff, transparent 60%),
    radial-gradient(1px 1px at 16% 6%,  #fff, transparent 60%),
    radial-gradient(2px 2px at 28% 18%, #fff8, transparent 60%),
    radial-gradient(1px 1px at 42% 9%,  #fff, transparent 60%),
    radial-gradient(2px 2px at 58% 14%, #fff, transparent 60%),
    radial-gradient(1px 1px at 71% 4%,  #fff, transparent 60%),
    radial-gradient(2px 2px at 84% 17%, #fffa, transparent 60%),
    radial-gradient(1px 1px at 92% 8%,  #fff, transparent 60%);
  opacity: 0.85;
  animation: mrv-mi-twinkle 4s ease-in-out infinite;
}
@keyframes mrv-mi-twinkle {
  0%, 100% { opacity: 0.85; }
  50%      { opacity: 0.55; }
}

/* Moon (replacing sun for night-pirate vibe) */
.mrv-mi-moon {
  position: absolute;
  left: 70%; top: 14%;
  width: 110px; height: 110px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #fff8d4 0%, #ffe49a 50%, #c89a3a 90%, transparent 95%);
  box-shadow:
    0 0 60px 14px rgba(255, 220, 130, 0.45),
    inset -8px -10px 0 rgba(120, 90, 30, 0.35);
  cursor: pointer;
}

/* Monkey head — glowing eyes + skull-like face markings */
.mrv-mi-monkey-head {
  position: absolute;
  left: 38%; bottom: 36%;
  width: 110px; height: 95px;
  background: #1a0a2a;
  clip-path: polygon(
    8% 50%, 4% 30%, 14% 18%, 30% 12%,
    36% 4%, 64% 4%, 70% 12%, 86% 18%,
    96% 30%, 92% 50%, 92% 70%, 80% 86%,
    65% 94%, 35% 94%, 20% 86%, 8% 70%
  );
  cursor: pointer;
  filter: drop-shadow(0 0 8px rgba(80,0,80,0.7));
}
.mrv-mi-monkey-head::before,
.mrv-mi-monkey-head::after {
  /* glowing eyes */
  content: '';
  position: absolute;
  top: 38%; width: 13px; height: 13px;
  background: radial-gradient(circle at 40% 40%, #ffcc44, #ff8c42 60%, #c04000 100%);
  box-shadow: 0 0 10px 3px #ff8c42, 0 0 20px #c06000;
  border-radius: 50%;
  animation: mrv-mi-eye-glow 2.5s ease-in-out infinite alternate;
}
.mrv-mi-monkey-head::before { left: 23%; }
.mrv-mi-monkey-head::after  { right: 23%; }
@keyframes mrv-mi-eye-glow {
  0%   { opacity: 0.7; box-shadow: 0 0 8px 2px #ff8c42; }
  100% { opacity: 1;   box-shadow: 0 0 16px 5px #ff6000, 0 0 30px #ff4000; }
}

/* Distant island silhouette */
.mrv-mi-island {
  position: absolute;
  left: 8%; bottom: 32%;
  width: 280px; height: 90px;
  background: #0f061a;
  clip-path: polygon(0% 100%, 6% 65%, 18% 50%, 30% 35%, 42% 28%, 55% 32%, 70% 45%, 84% 58%, 95% 75%, 100% 100%);
  filter: drop-shadow(0 0 4px rgba(0,0,0,0.5));
}
.mrv-mi-palm {
  position: absolute;
  right: 25%; top: -52px;
  width: 24px; height: 60px;
  cursor: pointer;
}
.mrv-mi-palm-trunk {
  position: absolute;
  left: 50%; bottom: 0;
  width: 6px; height: 56px;
  margin-left: -3px;
  background: #2a1004;
  transform: rotate(-4deg);
}
.mrv-mi-palm-leaves {
  position: absolute;
  top: -18px; left: -14px;
  font-size: 36px;
  text-shadow: 0 0 6px rgba(0,0,0,0.6);
  animation: mrv-mi-sway 3s ease-in-out infinite;
  transform-origin: bottom center;
}
@keyframes mrv-mi-sway {
  0%, 100% { transform: rotate(-3deg); }
  50%      { transform: rotate(3deg); }
}

/* Ghost ship in the distance — proper sails + skull flag */
.mrv-mi-ghostship {
  position: absolute;
  left: 5%; bottom: 31%;
  width: 90px; height: 70px;
  cursor: pointer;
  animation: mrv-mi-bob 5s ease-in-out infinite;
  filter: drop-shadow(0 0 10px rgba(150, 210, 255, 0.4));
}
/* Hull */
.mrv-mi-ghostship::before {
  content: '';
  position: absolute;
  bottom: 0; left: 10%; width: 80%; height: 30%;
  background: linear-gradient(180deg, #0d0d1a 0%, #050510 100%);
  clip-path: polygon(0% 0%, 100% 0%, 88% 100%, 12% 100%);
  border-top: 2px solid #1a1a3a;
}
/* Mast + sails via box-shadow trick */
.mrv-mi-ghostship::after {
  content: '⚡';
  position: absolute;
  top: -4px; left: 50%;
  transform: translateX(-50%);
  font-size: 11px;
  color: rgba(200,230,255,0.7);
  text-shadow: 0 0 6px rgba(150,200,255,0.9);
}
/* Sails drawn as pseudo-children via background */
.mrv-mi-ghostship-sail {
  position: absolute;
  background: rgba(180, 210, 255, 0.18);
  border: 1px solid rgba(150,200,255,0.35);
}
.mrv-mi-ghostship-sail.main {
  left: 30%; bottom: 28%; width: 32px; height: 38px;
  clip-path: polygon(0% 0%, 100% 15%, 100% 100%, 0% 100%);
}
.mrv-mi-ghostship-sail.fore {
  left: 56%; bottom: 28%; width: 20px; height: 26px;
  clip-path: polygon(0% 8%, 100% 0%, 100% 100%, 0% 100%);
}
.mrv-mi-ghostship-mast {
  position: absolute;
  left: 35%; bottom: 27%; width: 2px; height: 42px;
  background: linear-gradient(180deg, #2a2a4a, #10101e);
}
.mrv-mi-ghostship-flag {
  position: absolute;
  left: 36%; top: 0; font-size: 12px;
  animation: mrv-mi-flag-wave 1.2s ease-in-out infinite alternate;
  filter: drop-shadow(0 0 4px rgba(150,200,255,0.6));
}
@keyframes mrv-mi-flag-wave {
  0%   { transform: skewX(0deg); }
  100% { transform: skewX(10deg); }
}

/* Sea with moon reflection shimmer */
.mrv-mi-sea {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 32%;
  background: linear-gradient(180deg, #1d3b6e 0%, #0a1a3a 60%, #050a1a 100%);
  cursor: pointer;
  overflow: hidden;
}
/* Moon reflection column */
.mrv-mi-sea::before {
  content: '';
  position: absolute;
  top: 0; left: 68%; width: 6%; height: 100%;
  background: linear-gradient(180deg,
    rgba(255,220,130,0.22) 0%,
    rgba(255,220,130,0.10) 50%,
    transparent 100%);
  animation: mrv-mi-reflection 3s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes mrv-mi-reflection {
  0%   { opacity: 0.6; transform: scaleX(1); }
  100% { opacity: 1;   transform: scaleX(1.4); }
}
.mrv-mi-wave {
  position: absolute;
  left: -50%; right: -50%;
  height: 14px;
  background: repeating-linear-gradient(90deg,
    rgba(255,255,255,0.18) 0 8px,
    transparent 8px 24px);
  animation: mrv-mi-wave-slide linear infinite;
}
.mrv-mi-wave.w1 { top: 8%;  animation-duration: 7s;  opacity: 0.9; }
.mrv-mi-wave.w2 { top: 22%; animation-duration: 11s; opacity: 0.6; transform: scaleY(0.8); }
.mrv-mi-wave.w3 { top: 40%; animation-duration: 15s; opacity: 0.4; transform: scaleY(0.6); }
@keyframes mrv-mi-wave-slide {
  0%   { transform: translateX(0)    scaleY(var(--sy, 1)); }
  100% { transform: translateX(-25%) scaleY(var(--sy, 1)); }
}

/* Wooden dock jutting into the sea */
.mrv-mi-dock {
  position: absolute;
  left: 38%; bottom: 12%;
  width: 220px; height: 22px;
  background:
    repeating-linear-gradient(90deg,
      #5a2a08 0 18px,
      #2a1004 18px 22px),
    #5a2a08;
  border: 2px solid #2a1004;
  cursor: pointer;
  filter: drop-shadow(0 4px 0 rgba(0,0,0,0.5));
}
.mrv-mi-dock::before, .mrv-mi-dock::after {
  content: ''; position: absolute; bottom: -16px;
  width: 6px; height: 18px; background: #2a1004;
}
.mrv-mi-dock::before { left: 30px; }
.mrv-mi-dock::after  { right: 30px; }

/* Signpost */
.mrv-mi-signpost {
  position: absolute;
  left: 28%; bottom: 22%;
  width: 130px; height: 90px;
  cursor: pointer;
  font-family: 'VT323', monospace;
}
.mrv-mi-sign-arm {
  background: #c89a4a;
  color: #2a1004;
  border: 2px solid #2a1004;
  font-size: 14px;
  padding: 2px 6px;
  margin-bottom: 4px;
  display: inline-block;
  box-shadow: 2px 2px 0 #000;
  letter-spacing: 1px;
}
.mrv-mi-sign-post {
  position: absolute;
  left: 50%; bottom: 0;
  width: 6px; height: 36px;
  margin-left: -3px;
  background: #2a1004;
}

/* Torches flanking the dock */
.mrv-mi-torch {
  position: absolute;
  font-size: 28px;
  cursor: pointer;
  filter: drop-shadow(0 0 12px rgba(255, 140, 40, 0.8));
  animation: mrv-mi-flicker 0.5s ease-in-out infinite alternate;
}
.mrv-mi-torch.t1 { left: 36%; bottom: 17%; }
.mrv-mi-torch.t2 { right: 28%; bottom: 17%; animation-delay: 0.2s; }
@keyframes mrv-mi-flicker {
  0%   { transform: scale(1)    rotate(-2deg); opacity: 0.9; }
  100% { transform: scale(1.1)  rotate(2deg);  opacity: 1;   }
}

/* Rubber chicken (clickable item on the dock) */
.mrv-mi-rooster {
  position: absolute;
  left: 44%; bottom: 17%;
  font-size: 22px;
  cursor: pointer;
  filter: drop-shadow(0 0 4px #000);
  animation: mrv-mi-bob 1.8s ease-in-out infinite;
}

/* Mug of grog */
.mrv-mi-grog {
  position: absolute;
  left: 50%; bottom: 17%;
  font-size: 22px;
  cursor: pointer;
  filter: drop-shadow(0 0 4px #000);
}

/* Guybrush — better silhouette with ponytail + coat */
.mrv-mi-guybrush {
  position: absolute;
  right: 16%; bottom: 22%;
  width: 70px; height: 130px;
  background: #050505;
  /* ponytail bump at top-right, wide coat at bottom */
  clip-path: polygon(
    38% 0%, 55% 0%, 62% 4%, 68% 0%, 72% 8%, 65% 14%,
    70% 18%, 76% 28%, 80% 50%, 72% 62%,
    85% 75%, 82% 90%, 75% 100%,
    52% 100%, 50% 88%, 46% 100%,
    18% 100%, 15% 90%, 25% 75%,
    20% 62%, 24% 50%, 28% 28%, 34% 18%, 30% 14%, 24% 8%, 28% 0%
  );
  cursor: pointer;
  animation: mrv-mi-bob 2.4s ease-in-out infinite;
  filter: drop-shadow(2px 0 0 #1a0a2a);
}
@keyframes mrv-mi-bob {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-4px); }
}
.mrv-mi-bubble {
  position: absolute;
  bottom: 110%; left: 50%;
  transform: translateX(-50%);
  background: #fffbe6; color: #111;
  border: 3px solid #111;
  padding: 10px 14px;
  font-family: 'VT323', monospace;
  font-size: 18px;
  white-space: nowrap;
  border-radius: 4px;
  animation: mrv-mi-bubble-pop 0.6s 0.4s both, mrv-mi-bubble-fade 6s 5s forwards;
  pointer-events: none;
}
.mrv-mi-bubble::after {
  content: '';
  position: absolute;
  bottom: -10px; left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top-color: #111;
}
@keyframes mrv-mi-bubble-pop {
  0%   { opacity: 0; transform: translateX(-50%) scale(0.6); }
  60%  { opacity: 1; transform: translateX(-50%) scale(1.1); }
  100% { opacity: 1; transform: translateX(-50%) scale(1); }
}
@keyframes mrv-mi-bubble-fade {
  0%   { opacity: 1; }
  100% { opacity: 0; visibility: hidden; }
}

/* Treasure chest */
.mrv-mi-chest {
  position: absolute;
  left: 22%; bottom: 16%;
  width: 80px; height: 60px;
  cursor: pointer;
  filter: drop-shadow(0 4px 0 rgba(0,0,0,0.5));
  transition: transform 0.2s;
}
.mrv-mi-chest:hover { transform: scale(1.08); }
.mrv-mi-chest-body {
  position: absolute;
  left: 0; bottom: 0;
  width: 100%; height: 60%;
  background: linear-gradient(180deg, #8b4a16 0%, #5a2a08 100%);
  border: 3px solid #2a1004;
  border-bottom: 0;
}
.mrv-mi-chest-lid {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 50%;
  background: linear-gradient(180deg, #a86028 0%, #6a3010 100%);
  border: 3px solid #2a1004;
  border-radius: 40% 40% 0 0 / 80% 80% 0 0;
  transform-origin: bottom center;
  transition: transform 0.5s ease;
}
.mrv-mi-chest.open .mrv-mi-chest-lid {
  transform: rotateX(110deg) translateY(-4px);
}
.mrv-mi-chest.treasure::before {
  content: '✨💰✨';
  position: absolute;
  left: 50%; top: -10px;
  transform: translateX(-50%);
  font-size: 22px;
  animation: mrv-mi-treasure-glow 1.2s ease-in-out infinite alternate;
  pointer-events: none;
}
@keyframes mrv-mi-treasure-glow {
  0%   { opacity: 0.7; transform: translateX(-50%) translateY(0) scale(1); }
  100% { opacity: 1;   transform: translateX(-50%) translateY(-6px) scale(1.15); }
}

/* ─── SCUMM UI: sentence + verbs + inventory ─────────────────── */
.mrv-mi-ui {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  background: linear-gradient(180deg, transparent 0%, #050a05 25%, #050a05 100%);
  padding: 12px 16px 14px;
  z-index: 5;
}

/* Sentence line — "› Look at giant monkey head" */
.mrv-mi-sentence {
  text-align: center;
  font-family: 'VT323', monospace;
  font-size: 22px;
  color: #fff3a8;
  text-shadow: 2px 2px 0 #000;
  margin-bottom: 10px;
  min-height: 28px;
}
.mrv-mi-target {
  color: #fff;
  text-shadow: 0 0 8px #ffb000;
}
.mrv-mi-target.speak {
  color: #fffbe6;
  animation: mrv-mi-speak 0.4s steps(2) infinite;
}
@keyframes mrv-mi-speak {
  0%, 100% { text-shadow: 0 0 8px #ffb000; }
  50%      { text-shadow: 0 0 16px #ffd24a; }
}

/* Bottom row: verb grid + inventory */
.mrv-mi-bottom {
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 14px;
  max-width: 920px;
  margin: 0 auto;
}

.mrv-mi-verbs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
}
.mrv-mi-verbs button {
  font-family: 'Press Start 2P', monospace;
  font-size: 10px;
  padding: 10px 8px;
  background: #1a0a2a;
  color: #ffb000;
  border: 2px solid #ffb000;
  cursor: pointer;
  text-shadow: 1px 1px 0 #000;
  transition: all 0.12s;
  letter-spacing: 1px;
}
.mrv-mi-verbs button:hover,
.mrv-mi-verbs button.active {
  background: #ffb000;
  color: #1a0a2a;
}

.mrv-mi-inventory {
  background: #1a0a2a;
  border: 2px solid #ffb000;
  padding: 6px 8px;
  min-height: 92px;
  display: flex;
  flex-direction: column;
}
.mrv-mi-inv-title {
  font-family: 'Press Start 2P', monospace;
  font-size: 8px;
  color: #ffb000;
  letter-spacing: 1px;
  margin-bottom: 4px;
  text-align: center;
}
.mrv-mi-inv-items {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: 'VT323', monospace;
  font-size: 14px;
  color: #fff3a8;
  overflow-y: auto;
}
.mrv-mi-inv-item {
  cursor: pointer;
  padding: 2px 4px;
}
.mrv-mi-inv-item:hover {
  background: rgba(255, 176, 0, 0.15);
}

/* Music toggle button */
.mrv-mi-music-btn {
  position: absolute;
  left: 12px; top: 48px;
  font-family: 'Press Start 2P', monospace;
  font-size: 8px;
  letter-spacing: 1px;
  padding: 6px 10px;
  background: #0a1a0a;
  color: #39ff14;
  border: 2px solid #39ff14;
  cursor: pointer;
  z-index: 10;
  animation: mrv-mi-music-pulse 2s ease-in-out infinite alternate;
}
.mrv-mi-music-btn:hover { background: #39ff14; color: #050a05; animation: none; }
@keyframes mrv-mi-music-pulse {
  0%   { box-shadow: 0 0 4px rgba(57,255,20,0.3); }
  100% { box-shadow: 0 0 12px rgba(57,255,20,0.7); }
}

/* Fireflies floating over the sea */
.mrv-mi-firefly {
  position: absolute;
  width: 4px; height: 4px;
  background: #ffe066;
  border-radius: 50%;
  pointer-events: none;
  animation: mrv-mi-firefly-float var(--dur, 6s) ease-in-out infinite var(--delay, 0s);
  box-shadow: 0 0 6px 2px rgba(255,220,80,0.7);
}
@keyframes mrv-mi-firefly-float {
  0%   { transform: translate(0, 0) scale(1);   opacity: 0; }
  20%  { opacity: 1; }
  50%  { transform: translate(var(--dx, 20px), var(--dy, -18px)) scale(1.3); opacity: 0.9; }
  80%  { opacity: 0.6; }
  100% { transform: translate(0, 0) scale(1);   opacity: 0; }
}

/* Credit footer */
.mrv-mi-credit {
  position: absolute;
  right: 12px; top: 12px;
  font-family: 'Press Start 2P', monospace;
  font-size: 8px;
  color: rgba(255,255,255,0.5);
  letter-spacing: 1px;
  text-shadow: 1px 1px 0 #000;
  pointer-events: none;
}

/* Exit button */
.mrv-mi-exit {
  position: absolute;
  left: 12px; top: 12px;
  font-family: 'Press Start 2P', monospace;
  font-size: 9px;
  letter-spacing: 1px;
  padding: 8px 12px;
  background: #1a0a2a;
  color: #ff8c42;
  border: 2px solid #ff8c42;
  cursor: pointer;
  z-index: 10;
}
.mrv-mi-exit:hover { background: #ff8c42; color: #1a0a2a; }

/* ─── Insult Swordfight ─────────────────────────────────────── */
.mrv-mi-duel {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -45%) scale(0.9);
  width: min(560px, 92vw);
  background: #050a05;
  border: 4px solid #ffb000;
  box-shadow: 0 0 40px rgba(255,176,0,0.45), 6px 6px 0 #000;
  padding: 20px;
  z-index: 12;
  opacity: 0;
  transition: opacity 0.35s, transform 0.35s;
  font-family: 'VT323', monospace;
  color: #fff3a8;
}
.mrv-mi-duel.on { opacity: 1; transform: translate(-50%, -50%) scale(1); }

.mrv-mi-duel-stage {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: 'Press Start 2P', monospace;
  font-size: 11px;
  color: #ffb000;
  margin-bottom: 14px;
  letter-spacing: 1px;
}
.mrv-mi-duel-vs {
  font-size: 13px;
  color: #ff2a2a;
  text-shadow: 0 0 8px #ff2a2a;
}

.mrv-mi-duel-insult {
  font-size: 18px;
  line-height: 1.4;
  padding: 14px;
  background: #1a0a2a;
  border: 2px solid #6fa56f;
  margin-bottom: 12px;
  min-height: 54px;
  text-shadow: 1px 1px 0 #000;
  transition: background 0.3s, border-color 0.3s;
}
.mrv-mi-duel-insult.hit  { background: #143b1d; border-color: #39ff14; }
.mrv-mi-duel-insult.miss { background: #3b1414; border-color: #ff2a2a; }

.mrv-mi-duel-options {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 12px;
}
.mrv-mi-duel-options button {
  font-family: 'VT323', monospace;
  font-size: 16px;
  padding: 8px 12px;
  background: #1a0a2a;
  color: #fff3a8;
  border: 2px solid #ffb000;
  cursor: pointer;
  text-align: left;
  line-height: 1.3;
  transition: all 0.12s;
}
.mrv-mi-duel-options button:hover:not(:disabled) {
  background: #ffb000;
  color: #1a0a2a;
}
.mrv-mi-duel-options button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.mrv-mi-duel-score {
  font-family: 'Press Start 2P', monospace;
  font-size: 9px;
  color: #6fa56f;
  letter-spacing: 1px;
  text-align: center;
}

.mrv-mi-duel-result {
  font-family: 'Press Start 2P', monospace;
  font-size: 11px;
  letter-spacing: 1px;
  padding: 12px;
  border: 2px solid currentColor;
  text-align: center;
  line-height: 1.5;
  margin-bottom: 10px;
}
.mrv-mi-duel-result.win  { color: #39ff14; }
.mrv-mi-duel-result.lose { color: #ff2a2a; }

.mrv-mi-duel-close {
  display: block;
  width: 100%;
  font-family: 'Press Start 2P', monospace;
  font-size: 10px;
  padding: 10px;
  background: #ffb000;
  color: #1a0a2a;
  border: 2px solid #1a0a2a;
  cursor: pointer;
  letter-spacing: 1px;
}
.mrv-mi-duel-close:hover { background: #fff3a8; }

/* ─── Pirate Day banner ───────────────────────────────────── */
.mrv-mi-pirate-banner {
  position: fixed;
  left: 50%; bottom: 24px;
  transform: translate(-50%, 40px);
  z-index: 9000;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  background: #1a0a2a;
  border: 3px solid #ffb000;
  box-shadow: 0 0 24px rgba(255, 176, 0, 0.4), 4px 4px 0 #000;
  font-family: 'VT323', monospace;
  color: #e7ffe7;
  opacity: 0;
  transition: opacity 0.4s, transform 0.4s;
  max-width: calc(100vw - 32px);
}
.mrv-mi-pirate-banner.on { opacity: 1; transform: translate(-50%, 0); }
.mrv-mi-pb-flag { font-size: 32px; }
.mrv-mi-pb-text { font-size: 18px; line-height: 1.3; }
.mrv-mi-pb-text b {
  font-family: 'Press Start 2P', monospace;
  font-size: 11px;
  color: #ffb000;
  display: block;
  margin-bottom: 4px;
  letter-spacing: 1px;
}
.mrv-mi-pb-go {
  font-family: 'Press Start 2P', monospace;
  font-size: 10px;
  padding: 10px 14px;
  background: #ffb000;
  color: #1a0a2a;
  border: 2px solid #1a0a2a;
  cursor: pointer;
  letter-spacing: 1px;
}
.mrv-mi-pb-go:hover { background: #fff3a8; }
.mrv-mi-pb-no {
  background: transparent;
  border: 0;
  color: #6fa56f;
  font-size: 18px;
  cursor: pointer;
  padding: 4px 8px;
}
.mrv-mi-pb-no:hover { color: #ff2a2a; }

/* Mobile tweaks */
@media (max-width: 720px) {
  .mrv-mi-island       { left: 4%; width: 70%; }
  .mrv-mi-guybrush     { right: 8%; width: 50px; height: 95px; }
  .mrv-mi-bubble       { font-size: 13px; padding: 6px 10px; white-space: normal; max-width: 200px; }
  .mrv-mi-chest        { left: 8%; width: 60px; height: 46px; }
  .mrv-mi-moon         { width: 80px; height: 80px; }
  .mrv-mi-monkey-head  { width: 70px; height: 60px; left: 50%; }
  .mrv-mi-ghostship    { width: 64px; height: 50px; }
  .mrv-mi-dock         { left: 30%; width: 150px; }
  .mrv-mi-signpost     { left: 18%; bottom: 26%; }
  .mrv-mi-sentence     { font-size: 16px; }
  .mrv-mi-bottom       { grid-template-columns: 1fr; }
  .mrv-mi-inventory    { min-height: 60px; }
  .mrv-mi-verbs button { font-size: 8px; padding: 8px 4px; }
  .mrv-mi-credit       { font-size: 7px; }
  .mrv-mi-exit         { font-size: 8px; padding: 6px 10px; }
  .mrv-mi-music-btn    { font-size: 7px; padding: 5px 8px; top: 42px; }
  .mrv-mi-duel-insult  { font-size: 16px; }
  .mrv-mi-duel-options button { font-size: 14px; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .mrv-mi-glitch,
  .mrv-mi-stars,
  .mrv-mi-palm-leaves,
  .mrv-mi-wave,
  .mrv-mi-guybrush,
  .mrv-mi-rooster,
  .mrv-mi-ghostship,
  .mrv-mi-torch,
  .mrv-mi-target.speak,
  .mrv-mi-bubble,
  .mrv-mi-firefly,
  .mrv-mi-music-btn {
    animation: none !important;
  }
}