/* ABOUTME: The zen reader's look - large calm type in the user's Telegram theme colors,
   with fallbacks for a plain browser.

   telegram-web-app.js publishes the theme and the fullscreen safe areas as --tg-* vars. */

:root {
  --bg: var(--tg-theme-bg-color, #fbf9f4);
  --fg: var(--tg-theme-text-color, #1f1d1a);
  --muted: var(--tg-theme-hint-color, #8a857c);
  /* Fullscreen draws Telegram's own close/menu over the top of the page. */
  --top: calc(
    var(--tg-safe-area-inset-top, 0px) + var(--tg-content-safe-area-inset-top, 0px)
  );
  --bottom: var(--tg-safe-area-inset-bottom, 0px);
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: var(--tg-theme-bg-color, #15140f);
    --fg: var(--tg-theme-text-color, #ece8df);
    --muted: var(--tg-theme-hint-color, #8f8a80);
  }
}

html,
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
}

body {
  /* No selecting, no long-press copy menu: the chat forbids forwarding, so does this. */
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-text-size-adjust: 100%;
}

main {
  box-sizing: border-box;
  max-width: 38rem;
  margin: 0 auto;
  padding: calc(var(--top) + 2rem) 1.5rem calc(var(--bottom) + 4rem);
  font-family: Georgia, "Noto Serif", "Times New Roman", serif;
  font-size: clamp(1.3rem, 5.4vw, 1.6rem);
  line-height: 1.65;
  white-space: pre-wrap; /* the texts keep Telegram's line breaks */
  overflow-wrap: break-word;
}

main a {
  color: inherit;
}

main.notice {
  color: var(--muted);
  text-align: center;
  padding-top: 40vh;
  font-size: 1.1rem;
}