:root { color-scheme: light dark; }

@media (prefers-color-scheme: dark) { :root { color: white; background-color: #1e1e1e; } }

body { font-family: system-ui, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; font-weight: 300; font-size: 1.1rem; margin: 0; }

main { margin-top: 60px; }

a { color: #0068da; text-decoration: none; }

@media (prefers-color-scheme: dark) { a { color: #419cff; } }

h1, h2, h3, h4, h5, h6 { margin-top: 0; }

h1 { line-height: 1; font-size: 2.4rem; font-weight: 500; letter-spacing: -0.015em; }

h1.hero { font-size: 3rem; }

h2 { font-size: 1.8rem; font-weight: 500; margin-bottom: 0.5rem; }

h3 { margin-top: 0; margin-bottom: 0.5rem; font-weight: 500; }

img.icon { width: 32px; height: 32px; filter: invert(0.33) sepia(1) saturate(11) hue-rotate(185deg); }

@media (prefers-color-scheme: dark) { img.icon { filter: invert(0.42) sepia(2) saturate(5) hue-rotate(180deg); } }

img.large-icon { width: 64px; height: 64px; }

input { font-size: 1rem; }

@media (prefers-color-scheme: dark) { input { color: white; } }

input:focus { outline: none; }

input[type="email"] { background: none; border: none; border-radius: 0; border-bottom: 1px solid gray; padding: 13px 0; }

input[type="submit"], a.button { -webkit-appearance: none; appearance: none; background-color: #007aff; border: none; border-radius: 10px; padding: 14px 24px; color: white; cursor: pointer; }

.page-content { max-width: 800px; padding: 75px; margin: 0 auto; }

@media (max-width: 750px) { .page-content { padding: 25px; } }

.page-content.main-page { text-align: center; }

.page-content.main-page hr { width: 175px; height: 3px; border: none; background-color: black; margin-top: 2rem; }

@media (prefers-color-scheme: dark) { .page-content.main-page hr { background-color: white; } }

.narrow-width { max-width: 600px; margin-left: auto; margin-right: auto; }

.site-width { max-width: 1200px; padding: 0 75px; margin: 0 auto; }

@media (max-width: 750px) { .site-width { padding: 0 25px; } }

.centered { text-align: center; }

.flex-container { display: flex; align-items: center; justify-content: center; }

@media (max-width: 750px) { .flex-container { flex-direction: column; } }

section.row { padding-top: 100px; padding-bottom: 100px; }

@media (max-width: 750px) { section.row { padding-top: 75px; padding-bottom: 75px; } }

@media (min-width: 751px) { section.hero-row { padding-top: 75px; } }

section.hero-row picture, section.hero-row img { width: 100%; max-width: 1000px; }

section.gray-row { background-color: #f9f9f9; }

@media (prefers-color-scheme: dark) { section.gray-row { background-color: #2a2a2a; } }

header { height: 60px; margin-bottom: 60px; font-size: 0.9em; position: fixed; top: 0; left: 0; right: 0; z-index: 99; transition: all 0.2s ease; border-bottom: 1px solid transparent; }

header.floating { backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid #e6e6e6; background-color: rgba(255, 255, 255, 0.72); }

@media (prefers-color-scheme: dark) { header.floating { background-color: rgba(30, 30, 30, 0.72); border-color: #333437; } }

header > div { height: 100%; display: flex; align-items: center; }

header .mobile-nav-toggle { display: none; }

@media (max-width: 750px) { header .mobile-nav-toggle { display: inherit; flex: 0 1 10%; } }

header .icon { width: 32px; height: 32px; vertical-align: bottom; filter: none; }

@media (prefers-color-scheme: dark) { header .icon { filter: invert(100%); } }

header nav { flex: 0 1 67%; text-align: right; }

header nav a { text-decoration: none; color: #464646; }

@media (prefers-color-scheme: dark) { header nav a { color: white; } }

@media (min-width: 751px) { header nav a.selected, header nav a:hover { border-bottom: 2px solid #007aff; padding-bottom: 10px; } }

header nav a + a { margin-left: 18px; }

header nav a.mobile-nav-toggle { margin-bottom: 40px; }

@media (max-width: 750px) { header nav { text-align: left; position: absolute; top: 0; left: -205px; height: 100vh; width: 150px; font-size: 1.2em; border-right: 1px solid #999; padding: 25px; background-color: rgba(255, 255, 255, 0.72); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); z-index: 999; transition: 0.2s ease; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); } }

@media (max-width: 750px) and (prefers-color-scheme: dark) { header nav { border-right: #333; box-shadow: 0 0 5px black; background-color: rgba(30, 30, 30, 0.72); } }

@media (max-width: 750px) { header nav a { display: block; margin: 0; } header nav a + a { margin-top: 20px; margin-left: 0; } }

body.sidebar-enabled nav { left: 0; }

.logo { font-size: 1.9rem; margin: auto 0; flex: 0 1 33%; }

@media (max-width: 750px) { .logo { flex: 0 1 80%; text-align: center; } }

.logo a { color: inherit; font-weight: inherit; }

.logo .mime { font-weight: 400; letter-spacing: 1px; }

.logo .stream { font-weight: 200; letter-spacing: 2px; }

footer { color: #272727; background-color: #f0f0f0; padding: 75px 0; font-size: 0.8em; }

@media (prefers-color-scheme: dark) { footer { color: #dcdddd; background-color: #464646; } }

@media (max-width: 750px) { footer { padding: 25px 0; } }

.footer-contents { display: flex; justify-content: space-between; vertical-align: center; }

@media (max-width: 750px) { .footer-contents { display: none; flex-direction: column; justify-content: center; text-align: center; } }

#copyright { font-size: 90%; }

@media (min-width: 751px) { #copyright { margin-top: 3em; border-top: 1px solid #cccccc; padding-top: 1.5em; } }

@media (min-width: 751px) and (prefers-color-scheme: dark) { #copyright { border-top-color: #585858; } }

.footer-contents .logo { font-size: 1.8em; }

.footer-contents > nav { display: flex; }

@media (max-width: 750px) { .footer-contents > nav { display: none; } }

.footer-contents > nav > section { display: flex; flex-direction: column; margin-left: 4em; }

.footer-contents > nav > section h5 { font-size: 1em; margin-top: 0; margin-bottom: 1em; font-weight: bold; }

.footer-contents > nav > section a { margin-bottom: 1em; color: black; }

@media (prefers-color-scheme: dark) { .footer-contents > nav > section a { color: white; } }

.footer-contents > nav > section a:hover { text-decoration: underline; }

.feature-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 50px 25px; }

@media (max-width: 750px) { .feature-grid { grid-template-columns: 1fr; } }

.feature { position: relative; }

.feature > img { position: absolute; left: 0; top: 0; }

.feature > :not(img) { margin-left: 50px; }

.feature > h3 { padding-top: 5px; }

.coming-soon-tag { font-weight: 300; font-size: 1rem; margin-top: 1rem; color: #818080; border: 1px solid #818080; border-radius: 4px; padding: 5px 10px; display: inline-block; }

@media (prefers-color-scheme: dark) { .coming-soon-tag { color: #99999a; border-color: #99999a; } }

@media (prefers-color-scheme: dark) { .swal-modal { background-color: #1e1e1e; color: white; } .swal-title, .swal-text { color: white; } .swal-icon--success::before, .swal-icon--success::after, .swal-icon--success__hide-corners { background-color: #1e1e1e; } }

.swal-button, .swal-button:not([disabled]):hover { background-color: #007aff; }

.swal-button { padding: 14px 24px; border: 0; border-radius: 10px; }

.swal-button:focus { box-shadow: none; }

.swal-footer { text-align: center; }

.hero-row.homepage-hero-row h1.hero { margin-bottom: 1rem; }

.hero-row.homepage-hero-row .text-block { margin-bottom: 2rem; }

@media (max-width: 750px) { .hero-row.homepage-hero-row { padding-top: 25px; } }

form.waitlist-form { text-align: left; max-width: 500px; margin: 0 auto; }

.email-input-container { display: flex; }

@media (max-width: 750px) { .email-input-container { flex-direction: column; } }

.email-input-container > input[type="email"] { flex: 1; }

@media (max-width: 750px) { .email-input-container > input[type="email"] { text-align: center; } }

.email-input-container > div:last-child { margin-left: 20px; display: flex; }

@media (max-width: 750px) { .email-input-container > div:last-child { max-width: 300px; margin: 10px auto 0 auto; } }

.requirement-label { font-size: 14px; color: #818080; }

@media (prefers-color-scheme: dark) { .requirement-label { color: #99999a; } }

section.screenshot-row { overflow-x: hidden; }

.screenshot-flex-container { display: flex; align-items: flex-start; position: relative; }

@media (max-width: 750px) { .screenshot-flex-container { flex-direction: column; } }

@media (min-width: 751px) { .screenshot-flex-container > div:first-child { flex: 0 1 30%; min-width: 350px; } .screenshot-flex-container > div:last-child { flex: 0 1 70%; } }

.screenshot-flex-container .text-block { text-align: left; }

.screenshot-flex-container .text-block p { margin-top: 0; margin-bottom: 2rem; }

@media (max-width: 750px) { .screenshot-flex-container .text-block { max-width: inherit; padding-bottom: 25px; } }

.screenshot-flex-container .screenshot-block { overflow: hidden; height: 714px; margin-top: -38px; margin-bottom: -67px; }

@media (max-width: 750px) { .screenshot-flex-container .screenshot-block { margin-left: -55px; margin-right: -25px; max-height: 350px; margin-bottom: -75px; order: 2; } }

.screenshot-flex-container .screenshot-block picture:not(.displayed) { display: none; }

@media (min-width: 751px) { .screenshot-flex-container .screenshot-block img { position: absolute; } }

.feature.card { cursor: pointer; margin-bottom: 10px; border-radius: 10px; padding: 20px; background-color: #f9f9f9; }

.feature.card:last-child { margin-bottom: 0; }

.feature.card > img { left: 20px; top: 20px; }

@media (prefers-color-scheme: dark) { .feature.card { background-color: #2a2a2a; } }

.feature.card:not(.selected) > div { display: none; }

.feature.card:hover { background-color: #e6e6e6; }

@media (prefers-color-scheme: dark) { .feature.card:hover { background-color: #333437; } }

.feature.card.selected { background-color: #e1f0ff; }

@media (prefers-color-scheme: dark) { .feature.card.selected { background-color: #21456d; } }

.feature.card.collapsed:not(:hover) { background: none; }

.feature.card.collapsed > div { display: none; }

ul.checkmark-list { list-style-type: none; text-align: left; display: inline-block; }

ul.checkmark-list li:before { content: "\2713\0020"; font-weight: bold; padding-right: 0.5rem; }

.spinner { visibility: hidden; margin: auto -25px auto 10px; height: 15px; width: 15px; border: 2px solid lightgray; border-top-color: gray; border-radius: 50%; animation: rotation 0.6s infinite linear; }

@keyframes rotation { 0% { transform: rotate(0deg); }
  100% { transform: rotate(359deg); } }

.pricing-list { display: flex; justify-content: center; margin: 5em 0; }

@media (max-width: 750px) { .pricing-list { display: grid; grid: 1fr 1fr / 1fr 1fr; grid-gap: 20px; } }

.pricing-list > div { flex: 1; text-align: center; height: 300px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); max-width: 225px; margin-right: 20px; position: relative; transition: transform 0.25s ease; }

@media (max-width: 750px) { .pricing-list > div { margin: 0; max-width: 100%; width: 100%; } }

@media (prefers-color-scheme: dark) { .pricing-list > div { background-color: #222; } }

.pricing-list > div.with-banner { position: relative; top: -30px; height: 330px; }

.pricing-list > div:last-child { margin-right: 0; margin-bottom: 0; }

.pricing-list > div:hover { transform: scale(1.05); }

.pricing-list h2 { background-color: #efefef; padding: 35px 10px 70px 10px; margin: 0; }

@media (prefers-color-scheme: dark) { .pricing-list h2 { color: white; background-color: #333; } }

.pricing-list .banner { font-size: 0.8em; width: 100%; line-height: 30px; height: 30px; background-color: black; color: white; text-transform: uppercase; }

.pricing-list .price { display: flex; flex-direction: column; justify-content: center; background-color: black; border: 5px solid white; color: white; border-radius: 100px; width: 100px; height: 100px; margin: 0 auto -50px auto; transform: translateY(-50%); }

@media (prefers-color-scheme: dark) { .pricing-list .price { border-color: #222; } }

.pricing-list .price-amount { font-size: 1.3em; }

.pricing-list .price-amount.strikethrough { text-decoration: line-through; margin-right: 5px; font-size: 0.8em; }

.pricing-list .price-terms { font-size: 0.7em; }

.pricing-list ul { text-align: left; display: inline-block; margin: 1em auto; padding: 10px; font-size: 0.8em; list-style: none; }

.pricing-list ul li:before { content: '\2713\0020'; }

.released-version { padding: 30px 0; /* Desktop Timeline Styles */ }

.released-version h2 { margin-top: 0; font-size: 1.4em; }

.released-version span.time { color: gray; }

.released-version h3 { margin-top: 1em; }

.released-version ul { margin: 0; }

.released-version li + li { margin-top: 0.25em; }

.released-version li { margin-left: 0.5em; }

.released-version:first-of-type { margin-top: 2em; }

@media (min-width: 751px) { .released-version { border-left: 2px solid lightgray; margin-left: 140px; } .released-version:first-of-type { padding-top: 0; } .released-version > div { position: relative; padding-left: 20px; } .released-version > div::before { border-radius: 50%; content: ""; background-color: white; border: 2px solid lightgray; position: absolute; height: 14px; width: 14px; left: -10px; top: 6px; } }

@media (min-width: 751px) and (prefers-color-scheme: dark) { .released-version > div::before { background-color: #1e1e1e; } }

@media (min-width: 751px) { .released-version div.release-date { position: absolute; left: -140px; width: 120px; text-align: right; top: 4px; } .released-version div.release-date span { display: block; } .released-version div.release-date span.date { font-weight: 600; } }

@media (max-width: 750px) { .released-version { border-top: 1px solid gray; } }

.faqs { max-width: 500px; margin: 0 auto; text-align: left; }

.faqs details { border-bottom: 1px solid lightgray; padding: 0.75rem 0; }

.faqs details:last-child { border-bottom: none; }

.faqs details :focus { outline: none; }

.faqs details summary { cursor: pointer; }

.faqs details p { color: #777; }

@media (prefers-color-scheme: dark) { .faqs details p { color: #CCC; } }

/*# sourceMappingURL=main.css.map */