/* Patch notes: app.css banner + glass panel, one screen. */
html, body.pn-page { height: 100%; overflow: hidden; }
body.pn-page { display: flex; flex-direction: column; height: 100dvh; margin: 0; }
body.pn-page > header { flex: none; }
a.home { color: inherit; text-decoration: none; }
.pn-panel {
  flex: 1 1 auto; min-height: 0; width: min(760px, calc(100% - 24px)); margin: 12px auto;
  display: flex; flex-direction: column; padding: 18px 20px; border-radius: 18px;
  background: color-mix(in srgb, var(--card) 45%, transparent);
  border: 1px solid rgba(255,255,255,.1);
  backdrop-filter: blur(12px) saturate(1.15); -webkit-backdrop-filter: blur(12px) saturate(1.15);
  box-shadow: 0 10px 30px rgba(0,0,0,.3); color: var(--text);
}
html[data-scheme="light"] .pn-panel { border-color: rgba(255,255,255,.55); }
@media (prefers-reduced-transparency: reduce) { .pn-panel { background: var(--card); backdrop-filter: none; -webkit-backdrop-filter: none; } }
.pn-panel h1 { flex: none; margin: 0 0 4px; font-size: 22px; }
.pn-panel .lead { flex: none; margin: 0 0 10px; font-size: 13px; color: var(--muted); }
.notes-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: 6px; overscroll-behavior: contain; }
.notes-list h2 { font-size: 17px; margin: 14px 0 6px; }
.notes-list section:first-child h2 { margin-top: 0; }
.notes-list h2 span { font-size: 13px; font-weight: 400; color: var(--muted); margin-left: .4em; }
.notes-list h3 { font-size: 15px; margin: 10px 0 4px; }
.notes-list ul { margin: 0 0 6px; padding-left: 20px; color: var(--muted); }
.notes-list li { margin: 3px 0; }
.pn-panel a.btn { flex: none; align-self: center; margin-top: 14px; padding: 10px 20px; border-radius: 12px; text-decoration: none; text-align: center; background: var(--accent, var(--blue)); color: var(--accent-text, #07110c); font-weight: 600; }
@media (max-width: 800px) { .pn-panel { margin: 8px auto; padding: 14px; } }
/* About page and small links. */
.notes-list p { margin: 0 0 10px; color: var(--muted); }
.made-with-love { text-align: center; padding: 10px 0 4px; }
.made-with-love .about-icon { display: inline-flex; filter: drop-shadow(0 4px 10px rgba(0,0,0,.45)); }
.made-with-love .about-icon::after { display: none; }
.made-with-love .about-icon img { width: 112px; height: 112px; border-radius: 24px; object-fit: cover; filter: blur(.25px);
  -webkit-mask: linear-gradient(to right, transparent, #000 6px, #000 calc(100% - 6px), transparent), linear-gradient(to bottom, transparent, #000 6px, #000 calc(100% - 6px), transparent);
  -webkit-mask-composite: source-in; mask-composite: intersect; }
html[data-scheme="light"] .made-with-love .about-icon { filter: drop-shadow(0 4px 10px rgba(0,0,0,.18)); }
.made-with-love .caption { margin: 8px 0 4px; font-size: 13px; font-style: italic; }
.made-with-love .thanks { color: var(--text); }
.small-links, .pn-links { font-size: 13px; text-align: center; color: var(--muted); }
.small-links a, .pn-links a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.pn-links { flex: none; margin: 8px 0 0; }
/* 26.10.3 (tester feedback): the About and patch-notes text sat on a nearly clear panel and was hard to read over the
   forest, especially on phones. The panel is now a mostly solid frosted card in both themes (the forest still shows
   softly around and through it), so the text has steady contrast. */
.pn-panel { background: rgba(18, 24, 32, .82); }
html[data-scheme="light"] .pn-panel { background: rgba(250, 251, 248, .86); }