/* ============================================================
   mssgs mail - core.css
   Reset, document rhythm and the primitives every page uses.
   Loaded first; fancy.css defines the palette on top of it.
   ============================================================ */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  min-height: 100svh;
  line-height: 1.5;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

img, svg, video { max-width: 100%; height: auto; display: block; }

a { text-decoration: none; }
a:hover { text-decoration: none; }

button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: none; cursor: pointer; }

ul, ol { list-style: none; }

code, pre { font-family: var(--font-mono); }

h1, h2, h3, h4 { line-height: 1.15; font-weight: 600; }

hr { border: none; border-top: 1px solid var(--w-line); }

/* Entrance for above-the-fold content. .reveal (fancy.css) handles the rest,
   which needs the viewport before it plays. */
.fadein { opacity: 0; animation: softIn .8s var(--ease-standard) var(--d, 0s) forwards; }
.d1 { --d: .09s; } .d2 { --d: .18s; } .d3 { --d: .3s; } .d4 { --d: .42s; } .d5 { --d: .58s; }
@keyframes softIn { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .fadein { animation: none; opacity: 1; }
}