html { --load-bg: #f4f0e5; --load-ink: #283d35; --load-seal: #C84B31; background: var(--load-bg); }
html[data-theme='dark'] { --load-bg: #121e22; --load-ink: #e4e0cd; }
body { margin: 0; }
.page-skeleton, .page-skeleton * { box-sizing: border-box; }
.page-skeleton { position: fixed; z-index: 300; inset: 0; overflow: auto; background: var(--load-bg); color: var(--load-ink); }
.page-skeleton__layout { width: min(1200px, calc(100% - 112px)); min-height: 100vh; min-height: 100dvh; margin: auto; display: grid; grid-template-rows: 80px 1fr 58px; }
.page-skeleton__header, .page-skeleton__footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.page-skeleton__header { border-bottom: 1px solid color-mix(in srgb, currentColor 8%, transparent); }
.page-skeleton__brand { display: flex; align-items: center; gap: 16px; }
.page-skeleton__seal { width: 36px; height: 36px; border: 0; background: var(--load-seal); border-radius: 2px; opacity: 0.3; }
.page-skeleton__bar { display: block; height: 8px; border-radius: 1px; background: currentColor; opacity: 0.08; }
.page-skeleton__name { width: 80px; height: 6px; }
.page-skeleton__nav { width: 150px; height: 6px; opacity: 0.06; }
.page-skeleton__body { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 32px; min-height: 0; }
.page-skeleton__copy { padding-block: 32px; animation: skeleton-breathe 1.8s ease-in-out infinite; }
.page-skeleton__eyebrow { width: 160px; height: 7px; margin-bottom: 40px; }
.page-skeleton__title { width: 86%; height: clamp(30px, 4vw, 52px); margin-bottom: 24px; opacity: 0.065; }
.page-skeleton__title--short { width: 70%; }
.page-skeleton__source { width: 125px; height: 6px; margin-top: 30px; margin-bottom: 42px; opacity: 0.05; }
.page-skeleton__meta { width: 66%; height: 7px; margin-top: 19px; }
.page-skeleton__meta--long { width: 83%; }
.page-skeleton__orbit { width: 100%; height: 100%; max-height: 720px; min-height: 210px; display: grid; place-items: center; }
.page-skeleton__orbit svg { width: 85%; max-height: 100%; overflow: visible; opacity: 0.12; }
.page-skeleton__footer { border-top: 1px solid color-mix(in srgb, currentColor 8%, transparent); font: 10px/1.8 ui-monospace, monospace; letter-spacing: 0.08em; }
.page-skeleton__status { display: inline-flex; align-items: center; gap: 10px; opacity: 0.55; }
.page-skeleton__status::before { content: ''; width: 4px; height: 4px; background: var(--load-seal); }
.page-skeleton__footer .page-skeleton__bar { width: 74px; height: 6px; }
.skeleton-leave-active { transition: opacity 360ms ease; pointer-events: none; }
.skeleton-leave-to { opacity: 0; }
.boot-fallback { display: none; }
html[data-entry='error'] .page-skeleton { display: none; }
html[data-entry='error'] .boot-fallback { display: grid; min-height: 100vh; align-content: center; justify-content: center; gap: 18px; padding: 24px; color: var(--load-ink); font: 14px/2 system-ui, sans-serif; }
.boot-fallback p { margin: 0; }
.boot-fallback a { color: inherit; margin-right: 20px; }
@keyframes skeleton-breathe { 50% { opacity: 0.6; } }
@media (max-width: 1100px) { .page-skeleton__layout { width: calc(100% - 64px); } .page-skeleton__body { gap: 20px; } }
@media (max-width: 760px) {
  .page-skeleton__layout { width: calc(100% - 48px); min-height: max(700px, 100dvh); grid-template-rows: 65px 1fr 45px; }
  .page-skeleton__seal { width: 30px; height: 30px; }
  .page-skeleton__nav { width: 105px; }
  .page-skeleton__name { width: 58px; }
  .page-skeleton__body { grid-template-columns: 1fr; grid-template-rows: auto minmax(210px, 1fr); gap: 0; }
  .page-skeleton__copy { padding-block: 32px 8px; }
  .page-skeleton__eyebrow { width: 125px; margin-bottom: 30px; }
  .page-skeleton__title { height: 30px; margin-bottom: 18px; }
  .page-skeleton__source { margin-block: 24px 32px; }
  .page-skeleton__meta { height: 6px; }
  .page-skeleton__orbit svg { width: 75%; max-height: 280px; }
  .page-skeleton__footer { font-size: 9px; }
}
@media (max-height: 700px) and (min-width: 761px) { .page-skeleton__layout { grid-template-rows: 64px 1fr 45px; } .page-skeleton__copy { padding-block: 20px; } .page-skeleton__title { height: 32px; } }
@media (prefers-reduced-motion: reduce) { .page-skeleton__copy { animation: none; } .skeleton-leave-active { transition: none; } }
