/* Auto Load Next Post */
:root {
  --alnp-accent: #2563eb;
  --alnp-border: #e5e7eb;
  --alnp-muted: #6b7280;
  --alnp-sk: #eceff3;
  --alnp-sk-hi: #f7f8fa;
}
@media (prefers-color-scheme: dark) {
  :root { --alnp-border: #2d3340; --alnp-muted: #9ca3af; --alnp-sk: #232833; --alnp-sk-hi: #2c3240; }
}

#alnp-loading[hidden], #alnp-retry[hidden], #alnp-endcap[hidden] { display: none !important; }
.alnp-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.alnp-item { opacity: 1; transform: none; transition: opacity .4s ease, transform .4s ease; }
.alnp-item.alnp-entering { opacity: 0; transform: translateY(12px); }

.alnp-separator { display: flex; align-items: center; gap: 1rem; margin: 3rem 0 2rem; color: var(--alnp-muted); font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; }
.alnp-separator::before, .alnp-separator::after { content: ""; flex: 1; height: 1px; background: var(--alnp-border); }

.alnp-header { margin-bottom: 1rem; }
.alnp-category { display: block; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--alnp-accent); }
.alnp-date { display: block; font-size: .85rem; color: var(--alnp-muted); }

#alnp-sentinel { height: 1px; width: 100%; pointer-events: none; }

.alnp-loading { display: flex; flex-direction: column; align-items: center; gap: 1.25rem; padding: 2rem 0; }
.alnp-spinner { width: 28px; height: 28px; border: 3px solid var(--alnp-border); border-top-color: var(--alnp-accent); border-radius: 50%; animation: alnp-spin .8s linear infinite; }
@keyframes alnp-spin { to { transform: rotate(360deg); } }

.alnp-skeleton { width: 100%; max-width: 720px; }
.alnp-line { height: 14px; margin-bottom: 12px; border-radius: 6px; background: linear-gradient(90deg, var(--alnp-sk) 25%, var(--alnp-sk-hi) 50%, var(--alnp-sk) 75%); background-size: 200% 100%; animation: alnp-pulse 1.4s ease-in-out infinite; }
.alnp-line--title { height: 26px; width: 70%; margin-bottom: 20px; }
.alnp-line--short { width: 55%; }
@keyframes alnp-pulse { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

.alnp-retry { margin: 2rem auto; max-width: 720px; padding: 1.25rem 1.5rem; text-align: center; border: 1px solid #f5c2c7; background: #fdf0f1; color: #842029; border-radius: 10px; }
.alnp-retry p { margin: 0 0 .75rem; }
.alnp-retry button { padding: .65rem 1.25rem; border: 0; border-radius: 8px; background: var(--alnp-accent); color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.alnp-retry button:hover { filter: brightness(1.1); }

.alnp-endcap { margin: 3rem auto 2rem; max-width: 720px; padding: 2rem 1.5rem; text-align: center; border-top: 1px solid var(--alnp-border); }
.alnp-endcap h2 { margin: 0 0 1rem; font-size: 1.15rem; }
.alnp-endcap ul { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin: 0; padding: 0; list-style: none; }
.alnp-endcap a { display: inline-block; padding: .6rem 1rem; border: 1px solid var(--alnp-border); border-radius: 999px; text-decoration: none; color: inherit; }
.alnp-endcap a:hover { border-color: var(--alnp-accent); color: var(--alnp-accent); }

@media (prefers-reduced-motion: reduce) {
  .alnp-item, .alnp-spinner, .alnp-line { animation: none; transition: none; }
}