:root {
    --navy-950: #050b18;
    --navy-900: #0a1730;
    --navy-800: #0f2140;
    --navy-700: #16305c;
    --blue-500: #3b7dfb;
    --blue-400: #5e97ff;
    --violet-400: #8b7cf6;
    --cyan-300: #6fe3d9;
    --green-500: #16a34a;
    --green-400: #3dd68c;
    --green-50: #e9f9f0;
    --amber-500: #e28f0e;
    --amber-400: #f5a623;
    --amber-50: #fdf3e2;
    --red-500: #e5484d;
    --red-400: #f0696d;
    --red-50: #fdeaea;
    --ink-900: #0d1526;
    --ink-700: #333d4d;
    --ink-600: #5b6472;
    --ink-400: #94a0b2;
    --line: #e6e9ef;
    --surface: #f6f8fb;
    --white: #ffffff;
    --font-display: 'Manrope', sans-serif; /* section headers, e.g. "Live Asset Network" */
    --font-body: "Bookman Old Style", "URW Bookman", serif; /* body copy */
    --font-title: 'Playfair Display', serif; /* main/hero title, e.g. "Welcome back" */
}

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

html, body {
    height: 100%;
}

body {
    font-family: var(--font-body);
    color: var(--ink-900);
    background: var(--white);
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
}

a {
    color: inherit;
    text-decoration: none;
}

svg {
    display: block;
}

button {
    font-family: inherit;
}

input {
    font-family: inherit;
}

/* apply new title font where the hero/greeting heading lives */
.welcome-title, h1.hero-title {
    font-family: var(--font-title);
}