/* Numbered update log: the "What's new" popup (views/_updates_popup.php) and /updates.
   The panel, header, close and "Got it" reuse the .wn__* styles in app.css. */

.upd-pop { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 16px; background: rgb(20 16 14 / .55); backdrop-filter: blur(3px); font-family: Inter, system-ui, sans-serif; animation: wn-fade .2s ease; }
.upd-pop[hidden] { display: none; }
.upd-wrap { display: flex; align-items: center; justify-content: center; gap: 22px; max-width: 100%; }
.upd-promo { flex: none; display: block; border-radius: 16px; overflow: hidden; box-shadow: 0 30px 80px rgb(0 0 0 / .4); animation: wn-rise .25s cubic-bezier(.23, 1, .32, 1); }
.upd-promo img { display: block; height: min(560px, calc(100dvh - 48px)); width: auto; }
.upd-promo:focus-visible { outline: 3px solid #ffc83a; outline-offset: 3px; }
@media (max-width: 960px) { .upd-promo img { height: min(440px, calc(100dvh - 48px)); } }
@media (max-width: 760px) { .upd-promo { display: none; } }
.upd-pop .wn__panel { max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
.upd-pop .wn__head { position: sticky; top: 0; z-index: 1; padding: 20px 22px 12px; background: #fff; }
.upd-pop h2 { margin: 0; font: 800 21px/1.25 Inter, sans-serif; color: #1d1b18; letter-spacing: -.01em; text-transform: none; }
.upd-pop .wn__foot { position: sticky; bottom: 0; margin-top: 0; background: #fff; }
.upd-pop :focus-visible { outline: 3px solid #831d32; outline-offset: 2px; }
.upd-pop .upd-list { margin: 0; padding: 0 22px 8px; }


.upd-list { list-style: none; display: grid; gap: 0; }
.upd-item { padding: 14px 0; border-top: 1px solid #f0ece5; }
.upd-item:first-child { border-top: 0; padding-top: 4px; }
.upd-meta { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .02em; color: #831d32; font-variant-numeric: normal; }
.upd-title { margin: 3px 0 0; font: 700 15.5px/1.35 Inter, sans-serif; color: #1d1b18; text-transform: none; letter-spacing: 0; }
.upd-body { margin: 4px 0 0; font-size: 14px; line-height: 1.5; color: #4f4a42; }
.upd-img { display: block; margin: 8px 0 2px; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 14px rgb(0 0 0 / .14); }
.upd-img img { display: block; width: 100%; height: auto; }
.upd-pop .upd-img { max-width: 360px; }
.upd-page .upd-img { max-width: 480px; }
.upd-link { display: inline-block; margin-top: 6px; font-size: 14px; font-weight: 700; color: #831d32; text-decoration: none; }
.upd-link:hover { text-decoration: underline; }
.upd-all { font-size: 14px; font-weight: 700; color: #831d32; text-decoration: none; padding: 10px 0; }
.upd-all:hover { text-decoration: underline; }
.upd-links { display: inline-flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.upd-sm { display: inline-block; font-size: 14px; font-weight: 800; color: #fff; background: #831d32; text-decoration: none; padding: 9px 14px; border-radius: 10px; }
.upd-sm:hover { background: #6d1428; }

@media (max-width: 520px) {
	.upd-pop { padding: 10px; }
	.upd-pop .wn__panel { max-height: calc(100vh - 20px); max-height: calc(100dvh - 20px); }
	.upd-pop .wn__head { padding: 16px 16px 10px; }
	.upd-pop h2 { font-size: 18px; }
	.upd-pop .upd-list { padding: 0 16px 6px; }
	.upd-pop .wn__ok { flex: 1; }
}
@media (prefers-reduced-motion: reduce) { .upd-pop { animation: none; } }

/* /updates page */
.upd-page { max-width: 760px; margin: 0 auto; padding: 40px 16px 64px; }
.upd-page h1 { margin: 0 0 20px; font: 800 30px/1.2 Inter, sans-serif; color: #1d1b18; letter-spacing: -.015em; }
.upd-page .upd-list { margin: 0; padding: 0; }
.upd-page .upd-item { padding: 20px 0; }
.upd-page .upd-item:first-child { padding-top: 0; }
.upd-page .upd-title { font-size: 18px; }
.upd-page .upd-body { font-size: 15px; }
.upd-empty { color: #6b6557; }