/* ═══════════════════════════════════════════════════════════
   EFFECTS — Riss World & Environmental
   ═══════════════════════════════════════════════════════════ */

/* ── RISS WORLD CANVAS TINT ── */
.riss-active #game-canvas {
  filter:
    hue-rotate(165deg)
    saturate(1.3)
    brightness(0.82)
    contrast(1.05);
  transition: filter 0.8s ease;
}

/* Location badge glows teal */
.riss-active #hud-location {
  color: var(--riss-teal, #4af0c0);
  border-top-color:    rgba(74,240,192,0.35);
  border-left-color:   rgba(74,240,192,0.35);
  text-shadow:
    0 0 10px rgba(74,240,192,0.7),
    0 1px 0 rgba(0,0,0,0.8);
  background:
    linear-gradient(160deg, rgba(7,26,18,0.95) 0%, rgba(3,15,11,0.98) 100%);
}


/* Portrait border glows */
.riss-active #dialogue-portrait {
  box-shadow:
    0 0 0 2px rgba(0,0,0,0.5),
    0 0 0 3px rgba(74,240,192,0.2),
    0 0 12px rgba(74,240,192,0.25),
    inset 0 2px 4px rgba(74,240,192,0.06);
}

/* Speaker name turns teal in riss */
.riss-active #dialogue-speaker {
  color: var(--riss-teal, #4af0c0);
  text-shadow: 0 0 12px rgba(74,240,192,0.5);
}
.riss-active #dialogue-speaker::after {
  background: linear-gradient(to right, rgba(74,240,192,0.35), transparent);
}

/* ── TRANSITION FLASH ── */
@keyframes riss-crack-in {
  0%   { opacity: 0; clip-path: polygon(49% 0%, 51% 0%, 51% 100%, 49% 100%); }
  30%  { opacity: 1; clip-path: polygon(20% 0%, 80% 0%, 80% 100%, 20% 100%); }
  100% { opacity: 0; clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); }
}

.riss-flash::after {
  content: '';
  position: fixed;
  inset: 0;
  background: radial-gradient(ellipse at 50% 40%,
    rgba(74,240,192,0.45) 0%,
    rgba(74,240,192,0.1)  40%,
    transparent 70%);
  pointer-events: none;
  animation: riss-crack-in 0.7s cubic-bezier(0.25,0,0.2,1) forwards;
}

/* ── SCANLINE SHIMMER (riss world) ── */
.riss-active #ui-layer::after {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 3px,
    rgba(0,0,0,0.04) 3px,
    rgba(0,0,0,0.04) 4px
  );
  pointer-events: none;
  animation: scanline-drift 8s linear infinite;
}

@keyframes scanline-drift {
  from { background-position: 0 0; }
  to   { background-position: 0 -80px; }
}

/* ── INTERACTION PROMPT (world-space, drawn by HUD) ── */
.interact-prompt {
  position: absolute;
  font-family: 'Share Tech Mono', 'Courier New', monospace;
  font-size: 10px;
  letter-spacing: 0.1em;
  white-space: nowrap;
  transform: translateX(-50%);
  pointer-events: none;

  color: #c8a040;
  background: rgba(14,12,8,0.82);
  border-top:   1px solid rgba(200,175,130,0.22);
  border-left:  1px solid rgba(200,175,130,0.22);
  border-right: 1px solid rgba(0,0,0,0.55);
  border-bottom:1px solid rgba(0,0,0,0.55);
  padding: 3px 10px 2px;
  clip-path: polygon(6px 0%, 100% 0%, calc(100% - 6px) 100%, 0% 100%);

  text-shadow: 0 0 8px rgba(200,160,60,0.35);
  box-shadow: 0 2px 8px rgba(0,0,0,0.5);

  animation: prompt-rise 0.25s cubic-bezier(0.22,1,0.36,1) both;
}

@keyframes prompt-rise {
  from { opacity: 0; transform: translateX(-50%) translateY(6px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0);   }
}

/* Riss zone: prompt turns teal */
.riss-active .interact-prompt {
  color: #4af0c0;
  background: rgba(3,15,11,0.88);
  border-top-color:    rgba(74,240,192,0.3);
  border-left-color:   rgba(74,240,192,0.3);
  text-shadow: 0 0 8px rgba(74,240,192,0.5);
}

/* ── PARTICLE CANVAS ── */
#particle-canvas {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.6s;
}
.riss-active #particle-canvas { opacity: 1; }
