body.public-presentation {
  --public-presentation-background: var(--color-bg, var(--color-paper, #fafafa));
  --public-presentation-mark-size: 4rem;
}

:root[data-initial-presentation="loading"] body.public-presentation {
  overflow: hidden;
}

:root[data-initial-presentation="loading"] body.public-presentation
  > :not(script):not(.font-load-error) {
  visibility: hidden;
}

body.public-presentation::before,
body.public-presentation::after {
  position: fixed;
  z-index: 2147483000;
  pointer-events: none;
}

body.public-presentation::before {
  content: "";
  inset: 0;
  background: var(--public-presentation-background);
}

body.public-presentation::after {
  content: "";
  inset-block-start: 50%;
  inset-inline-start: 50%;
  inline-size: var(--public-presentation-mark-size);
  block-size: var(--public-presentation-mark-size);
  background: url("/assets/deltanotes-mark.png") center / contain no-repeat;
  translate: -50% -50%;
  animation: public-presentation-pulse 900ms ease-in-out infinite alternate;
}

:root[data-initial-presentation="ready"] body.public-presentation::before,
:root[data-initial-presentation="ready"] body.public-presentation::after,
:root[data-font-status="error"] body.public-presentation::before,
:root[data-font-status="error"] body.public-presentation::after {
  display: none;
}

body.public-presentation > .font-load-error {
  display: none;
}

:root[data-font-status="error"] body.public-presentation
  > :not(script):not(.font-load-error) {
  display: none !important;
}

:root[data-font-status="error"] body.public-presentation > .font-load-error {
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 2rem;
  color: var(--color-text, var(--color-ink, #171717));
  background: var(--public-presentation-background);
  font-family: "Gen Interface JP", "Yu Gothic UI", sans-serif;
  font-size: 0.875rem;
  line-height: 1.6;
  text-align: center;
}

@keyframes public-presentation-pulse {
  from { opacity: 0.42; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  body.public-presentation::after { animation: none; }
}