/* The App link landing page (#567). The tokens are a subset of site/styles.css,
   which mirrors app/lib/src/core/design_tokens.dart; the two sites deploy as
   separate Hosting sites, so this one carries its own copy rather than reaching
   into site/. */

@font-face {
  font-family: "Playfair Display";
  src: url("fonts/PlayfairDisplay-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Work Sans";
  src: url("fonts/WorkSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}

:root {
  color-scheme: light;

  --champagne-100: #fdf9f1;
  --ink-900: #241f1a;
  --ink-700: #453d34;
  --ink-500: #6b6055;

  --serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --sans: "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-items: center;
  background: var(--champagne-100);
  color: var(--ink-700);
  font: 400 17px/1.6 var(--sans);
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}

main {
  max-width: 30rem;
  padding: 32px clamp(16px, 5vw, 40px);
  text-align: center;
}

.icon {
  border-radius: 16px;
}

h1 {
  margin: 20px 0 12px;
  font: 600 clamp(28px, 6vw, 36px)/1.15 var(--serif);
  color: var(--ink-900);
}

p {
  margin: 0 0 12px;
}

.note {
  color: var(--ink-500);
  font-size: 15px;
}