.notes-scrim-hit { position: absolute; inset: 0; cursor: default; }
.modal.patch-notes { position: relative; width: min(40rem, 100%); background: linear-gradient(180deg, rgba(22, 36, 60, .985), rgba(9, 15, 27, .99)); }
.patch-notes h2 { margin-bottom: .5rem; font-size: 1.9rem; }
.modal.patch-notes .notes-scroll { display: grid; align-content: start; gap: 1.25rem; min-height: 0; overflow-y: auto; overscroll-behavior: contain; margin: 0 -.5rem .6rem; padding: .7rem .5rem 1.5rem; text-align: left;
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 .7rem, #000 calc(100% - 1.5rem), transparent); mask-image: linear-gradient(180deg, transparent, #000 .7rem, #000 calc(100% - 1.5rem), transparent); }
.patch-notes .notes-scroll:focus, .patch-notes .notes-scroll:focus-visible { outline: none; }
.notes-section { display: grid; gap: .6rem; }
.notes-section h3 { margin: 0; font: 600 1.25rem/1.2 var(--font-display); color: var(--gold-1); }
.notes-list { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.notes-list li { position: relative; padding-left: 1.05rem; font-size: .95rem; line-height: 1.45; color: var(--text-2); text-wrap: pretty; }
.notes-list li::before { content: ""; position: absolute; left: .2rem; top: .62em; width: .34rem; height: .34rem; border-radius: 50%; background: var(--gold-3); }
.notes-list b { font-weight: 600; color: var(--text-1); }
.modal.patch-notes.is-big { width: min(52rem, 100%); }
.patch-notes.is-big h2 { font-size: 2.3rem; }
.notes-hero { display: grid; gap: .7rem; margin: 0; }
.notes-hero img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; border: 1px solid rgba(240, 200, 120, .35); background: #0b1220; }
.notes-hero figcaption { font-size: 1.05rem; line-height: 1.45; color: var(--text-1); text-wrap: pretty; }
.notes-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.notes-pages { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .9rem; }
.modal.patch-notes.is-paged { height: min(66rem, calc(100% - 2rem)); }
.notes-page { padding: .32rem .8rem; border-radius: 999px; border: 1px solid rgba(240, 200, 120, .22); background: rgba(255, 255, 255, .04); color: var(--text-2); font: 600 .86rem/1.2 var(--font-ui); cursor: pointer; }
.notes-page:hover { color: var(--text-1); border-color: rgba(240, 200, 120, .45); }
.notes-page.is-active { color: var(--gold-1); background: rgba(240, 200, 120, .14); border-color: rgba(240, 200, 120, .7); }
.notes-page:focus-visible { outline: 2px solid var(--gold-2, #f0c878); outline-offset: 2px; }

.settings-popover .notes-row .btn { flex: none; }
.notes-panel-copy .btn { justify-self: start; }

@media (max-width: 760px), (max-height: 500px) and (pointer: coarse) {
  .modal.patch-notes { padding: 1.9rem 1rem 1rem; }
  .patch-notes h2 { font-size: 1.6rem; margin-bottom: .3rem; }
  .modal.patch-notes .notes-scroll { overscroll-behavior: contain; }
  .notes-section h3 { font-size: 1.2rem; }
  .notes-list li { font-size: .92rem; }
  .patch-notes.is-big h2 { font-size: 1.75rem; }
  .notes-hero figcaption { font-size: .98rem; }
  .notes-actions { grid-template-columns: 1fr; }
  .notes-actions.notes-step { grid-template-columns: 1fr 1fr; }
  .notes-pages { gap: .3rem; margin-bottom: .6rem; }
  .notes-page { display: inline-flex; align-items: center; min-height: 3.3rem; padding: 0 1rem; font-size: .9rem; }
  .modal.patch-notes .btn { min-height: 3.3rem; }
}
@media (max-height: 500px) and (pointer: coarse) {
  .modal-scrim.notes-scrim { padding: .45rem calc(.6rem + env(safe-area-inset-right)) calc(.45rem + env(safe-area-inset-bottom)) calc(.6rem + env(safe-area-inset-left)); }
  .modal.patch-notes { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); align-items: center; column-gap: 1rem; max-height: 100%; padding: 1.3rem .9rem .7rem; }
  .modal.patch-notes.is-paged { height: 100%; }
  .modal.patch-notes > :not(h2, .notes-pages, .plaque) { grid-column: 1 / -1; }
  .modal.patch-notes > .notes-scroll { align-self: stretch; margin-bottom: .45rem; }
  .patch-notes h2, .patch-notes.is-big h2 { margin: 0; font-size: 1.35rem; text-align: left; }
  .patch-notes .notes-pages { justify-content: flex-end; margin: 0; }
  .patch-notes h2:not(:has(+ .notes-pages)) { grid-column: 1 / -1; text-align: center; }
  .notes-hero { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); align-items: start; gap: .9rem; }
}