/* "What's new" window (shared/whats-new.js). Neutral light card; a game can override the --wn-* colours. */
.wn-modal { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
  background: rgba(10, 20, 26, .55); }
.wn-panel { width: min(560px, 100%); max-height: min(86vh, 900px); display: flex; flex-direction: column; overflow: hidden;
  background: var(--wn-bg, #fff8ea); color: var(--wn-ink, #1d2a2f); border: 3px solid var(--wn-edge, #1d2a2f); border-radius: 18px; box-shadow: 0 12px 40px rgba(0,0,0,.35); font: 15px/1.45 system-ui, sans-serif; }
.wn-head { display: flex; align-items: center; gap: 10px; padding: 12px 12px 10px 18px; border-bottom: 2px solid rgba(0,0,0,.08); }
.wn-head h2 { margin: 0; font-size: 20px; } .wn-sub { flex: 1; font-size: 13px; opacity: .7; }
.wn-x { width: 44px; height: 44px; border-radius: 50%; border: 2px solid currentColor; background: transparent; color: inherit; font-size: 22px; line-height: 1; cursor: pointer; }
.wn-list { overflow-y: auto; overscroll-behavior: contain; padding: 12px 16px 16px; display: flex; flex-direction: column; gap: 12px; }
.wn-entry { padding: 10px 12px; border-radius: 12px; border: 2px solid rgba(0,0,0,.1); background: rgba(255,255,255,.6); }
.wn-entry.new { border-color: var(--wn-accent, #f0a020); background: rgba(240, 160, 32, .1); }
.wn-entry header { display: flex; gap: 8px; align-items: center; font-size: 12.5px; opacity: .85; }
.wn-new { padding: 1px 8px; border-radius: 9px; background: var(--wn-accent, #f0a020); color: #2a1600; font-weight: 800; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
.wn-entry h3 { margin: 4px 0 6px; font-size: 16px; }
.wn-entry ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; }
.wn-empty { opacity: .7; }
.wn-foot { padding: 8px 16px 12px; border-top: 2px solid rgba(0,0,0,.08); font-size: 13px; }
.wn-open { position: relative; }
.wn-open.wn-has-new::after { content: ""; position: absolute; top: 2px; right: 2px; width: 10px; height: 10px; border-radius: 50%; background: #ffd24a; box-shadow: 0 0 0 2px #2a1600, 0 0 8px #ffd24a; }