/* scenes/difficultynight.css -- the same night at each difficulty (scenes/difficultynight.js) */
.gscene-difficultynight .gscene-stage {
  height: clamp(520px, 74vh, 660px);
  background: radial-gradient(ellipse 60% 55% at 35% 45%, #1b2a3f, #0b1222 70%, #070b16);
}
.dn-ui { position: absolute; z-index: 4; top: 14px; right: 14px; bottom: 14px; width: min(330px, 42%); display: flex; flex-direction: column; gap: 12px;
  padding: 16px; border-radius: 20px; background: rgba(8, 11, 22, 0.8); border: 1px solid var(--line); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); overflow: auto; }
.dn-head { display: flex; flex-direction: column; gap: 4px; }
.dn-name { font: 800 clamp(1.4rem, 3vw, 1.9rem)/1.1 var(--display); color: var(--grass); }
.dn-ui[data-level="3"] .dn-name, .dn-ui[data-level="4"] .dn-name, .dn-ui[data-level="5"] .dn-name { color: var(--red); }
.dn-line { font: 700 0.9rem/1.4 var(--display); color: var(--ink); quotes: "“" "”"; }
.dn-stats { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.dn-stats div { padding: 8px 10px; border-radius: 12px; background: var(--panel-2); }
.dn-stats dt { font: 700 0.72rem/1.25 var(--display); letter-spacing: 0.04em; color: var(--muted); }
.dn-stats dd { margin: 2px 0 0; font: 800 1.05rem/1.2 var(--display); color: #fff; font-variant-numeric: tabular-nums; }
.dn-stats small { display: block; font: 700 0.7rem/1.25 var(--display); color: var(--gold); }
.dn-range { width: 100%; accent-color: var(--red); margin: 2px 0 0; }
.dn-levels { display: flex; flex-wrap: wrap; gap: 6px; }
.dn-levels button { padding: 5px 10px; border-radius: 99px; cursor: pointer; font: 800 0.8rem var(--display); color: var(--ink);
  background: var(--panel-2); border: 1px solid var(--line); }
.dn-levels button[aria-pressed="true"] { background: var(--grass); color: #0d2a0f; border-color: transparent; }
.dn-levels button.is-hard[aria-pressed="true"] { background: var(--red); color: #2a0606; }
.dn-ring { position: absolute; left: 0; top: 0; z-index: 3; padding: 3px 9px; border-radius: 99px; pointer-events: none; white-space: nowrap;
  font: 800 0.75rem var(--display); color: #ffd6d2; background: rgba(60, 10, 10, 0.7); border: 1px solid rgba(255, 107, 107, 0.5); }
.dn-ring:empty, .dn-empty:empty { display: none; }
.dn-empty { position: absolute; z-index: 3; left: 18px; top: 50%; max-width: 46%; margin: 0; font: 800 clamp(1rem, 2.4vw, 1.3rem)/1.3 var(--display); color: var(--grass);
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8); pointer-events: none; }
.no-webgl > .dn-ring { display: none; }
@media (max-width: 760px) {
  .gscene-difficultynight .gscene-stage { height: clamp(640px, 94vh, 780px); }
  .dn-ui { top: auto; left: 10px; right: 10px; bottom: 10px; width: auto; max-height: 58%; padding: 12px; gap: 9px; }
  .dn-stats { grid-template-columns: 1fr 1fr; gap: 6px; }
  .dn-stats dd { font-size: 0.95rem; }
  .dn-empty { top: 18%; max-width: none; right: 18px; text-align: center; }
}