/* Libera Space's own look: the app's blue, its paper and ink, and Lato, served from here. */

@font-face { font-family: "Lato"; font-weight: 400; font-display: swap; src: url("../assets/fonts/Lato-Regular.woff2") format("woff2"); }
@font-face { font-family: "Lato"; font-weight: 700; font-display: swap; src: url("../assets/fonts/Lato-Bold.woff2") format("woff2"); }

:root {
  --md-text-font: "Lato";
  --md-text-font-family: "Lato", system-ui, sans-serif;
  --md-code-font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --ls-blue: #005A81;
  --ls-paper: #F6F1E9;
  --ls-ink: #1E1A17;
  --ls-stone: #8A7F76;
}

[data-md-color-primary="custom"] {
  --md-primary-fg-color: var(--ls-blue);
  --md-primary-fg-color--light: #2E7FA3;
  --md-primary-fg-color--dark: #004463;
  --md-primary-bg-color: var(--ls-paper);
}

[data-md-color-accent="custom"] {
  --md-accent-fg-color: #00759F;
}

[data-md-color-scheme="default"] {
  --md-default-bg-color: #FFFDF9;
  --md-default-fg-color: var(--ls-ink);
  --md-typeset-a-color: var(--ls-blue);
}

[data-md-color-scheme="slate"] {
  --md-typeset-a-color: #7FC4E3;
}

.md-typeset h1,
.md-typeset h2 {
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Read out, not shown: the wordmark below says it. */
.md-typeset .ls-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* The wordmark on the home page: ink on paper, or paper on ink. */
.ls-hero {
  margin: 1.5rem 0 2rem;
}

.ls-hero img {
  width: 300px;
  max-width: 70%;
  height: auto;
}

.ls-hero p {
  font-size: 1.35rem;
  line-height: 1.45;
  max-width: 36rem;
  margin: 1rem 0 0;
}

.only-dark { display: none; }
[data-md-color-scheme="slate"] .only-light { display: none; }
[data-md-color-scheme="slate"] .only-dark { display: inline; }

/* Screens of the application: a frame, so that a white page doesn't melt into the site. */
.md-typeset img.screen {
  border: 1px solid #E4DCCF;
  border-radius: 10px;
  box-shadow: 0 2px 14px rgba(30, 26, 23, 0.08);
}

[data-md-color-scheme="slate"] .md-typeset img.screen {
  border-color: #3A3631;
}

/* The deck, at the size of the column, in the proportions of its slides. */
.ls-deck {
  aspect-ratio: 16 / 9;
  width: 100%;
  border: 1px solid #E4DCCF;
  border-radius: 10px;
  overflow: hidden;
  background: var(--ls-paper);
}

.ls-deck iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}