/* 역감사 배드엔딩 연출 (js/reverse-audit.js). 아래 창들은 그대로 보이고, 막과 패널만 위에 얹는다 */
.ra-overlay { position: fixed; inset: 0; z-index: 9000; pointer-events: none; }
.ra-overlay button { pointer-events: auto; }
.ra-bar {
  position: absolute; top: 0; left: 0; right: 0; padding: 8px 16px; background: #8b1d1d; color: #fff;
  font-size: 13px; font-weight: 600; display: flex; align-items: center; gap: 8px; pointer-events: auto;
}
.ra-dot { width: 8px; height: 8px; border-radius: 50%; background: #ff6b6b; animation: ra-blink 1s infinite; flex: none; }
@keyframes ra-blink { 50% { opacity: .2; } }
.ra-caption {
  position: absolute; left: 50%; bottom: 72px; transform: translateX(-50%); max-width: min(640px, calc(100% - 32px));
  background: rgba(20, 20, 24, .88); color: #fff; padding: 10px 16px; border-radius: 8px; font-size: 14px; text-align: center;
}
.ra-panel {
  position: absolute; top: 48px; right: 16px; width: min(320px, calc(100% - 32px)); max-height: calc(100% - 160px); overflow: auto;
  background: #fffdf6; border: 1px solid #d9cfa8; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.25); pointer-events: auto;
}
.ra-panel-head { padding: 8px 12px; font-size: 12px; font-weight: 700; border-bottom: 1px solid #e8dfbe; }
.ra-card { padding: 8px 12px; border-bottom: 1px dashed #e8dfbe; animation: ra-in .4s ease both; }
.ra-card-title { font-size: 12px; font-weight: 700; margin-bottom: 2px; }
.ra-card-line { font-size: 12px; color: #444; }
@keyframes ra-in { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: none; } }
.ra-controls { display: flex; gap: 8px; justify-content: center; }
.ra-controls-float { position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); }
.ra-controls button {
  border: 1px solid rgba(255,255,255,.5); background: rgba(20,20,24,.85); color: #fff; padding: 6px 14px;
  border-radius: 6px; font-size: 13px; cursor: pointer; white-space: nowrap;
}
.ra-ending {
  position: absolute; inset: 0; background: #0d0d10; color: #eee; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 14px; padding: 16px; text-align: center; pointer-events: auto;
}
.ra-ending-tag { font-size: 12px; letter-spacing: .1em; color: #ff8080; border: 1px solid #ff8080; padding: 3px 10px; border-radius: 4px; }
.ra-ending-title { font-size: 26px; font-weight: 800; }
.ra-ending-text { font-size: 16px; color: #ccc; }
.ra-ending-note { font-size: 12px; color: #888; }