/* V8 — landscape rotation auto-refresh notice */
.rpg-orientation-refresh {
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  display: grid;
  place-items: center;
  padding: calc(20px + env(safe-area-inset-top,0px)) calc(20px + env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) calc(20px + env(safe-area-inset-left,0px));
  background: radial-gradient(circle at 50% 35%, rgba(46, 125, 86, .42), rgba(5, 9, 19, .92) 58%, rgba(2, 5, 12, .98));
  color: #f4fff5;
  font-family: Inter, system-ui, -apple-system, Segoe UI, sans-serif;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .24s ease, visibility .24s ease;
}
.rpg-orientation-refresh.is-visible { opacity: 1; visibility: visible; }
.rpg-refresh-card {
  width: min(92vw, 420px);
  border: 1px solid rgba(130,255,180,.48);
  border-radius: 26px;
  padding: 24px 22px;
  text-align: center;
  background: linear-gradient(160deg, rgba(11,36,28,.95), rgba(5,11,22,.96));
  box-shadow: 0 26px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.1);
}
.rpg-refresh-orb {
  width: 72px;
  height: 72px;
  margin: 0 auto 14px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: radial-gradient(circle at 50% 50%, #ddffe8 0 18%, #67ff9d 19% 28%, #122b1d 29% 42%, #6cff9a 43% 46%, transparent 47%), radial-gradient(circle, rgba(98,255,157,.22), transparent 70%);
  border: 1px solid rgba(127,255,170,.55);
  box-shadow: 0 0 34px rgba(91,255,157,.4);
  animation: rpgRefreshSpin 1.1s linear infinite;
}
.rpg-refresh-card strong { display:block; font-size:clamp(20px,5.5vw,28px); line-height:1.05; margin-bottom:9px; }
.rpg-refresh-card p { margin:0; color:#ccefd8; font-size:14px; line-height:1.5; }
@keyframes rpgRefreshSpin { to { transform: rotate(360deg); } }