:root{--spacing-unit: 1em;--spacing-unit-global: 1rem;--font-family-sans-serif: Inter, Avenir, Helvetica, Arial, sans-serif;--font-family-monospace: Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;--font-size-xs: .6rem;--font-size-s: .8rem;--font-size: 1rem;--font-size-m: 1.2rem;--font-size-l: 1.4rem;--font-size-xl: 1.6rem;--font-size-xxl: 1.8rem;--font-size-xxxl: 2rem;--font-weight-normal: normal;--font-weight-bold: bold;--background-color: #bba89c;--color: #333;--color--dark: #111;--highlight-color: #c8a48c;--separator-color: #93674a;--editor-color: #cfc0bd;--white: #fff;--off-white: #efefef;--max-width: 800px;font-family:var(--font-family-sans-serif);font-synthesis:none;background-color:var(--background-color);color:var(--color);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box}html{scroll-behavior:smooth}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}html,body{padding:0;margin:0}body{min-height:100vh;display:flex;flex-direction:column}header,footer{width:100%;margin:0 auto;max-width:var(--max-width)}footer{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:var(--spacing-unit-global) 0;gap:var(--spacing-unit-global)}@media (min-width: 1024px){footer{flex-direction:row}}h1,h2,h3{margin:0}a{color:currentColor}.header-container{display:flex;align-items:center;padding:var(--spacing-unit-global);gap:var(--spacing-unit-global)}.header-container h1{flex:1;font-size:var(--font-size-xxl)}.header-container h1 a{display:inline-block;text-decoration:none}.header-container div:last-of-type{font-size:var(--font-size-m)}@media (min-width: 1024px){.header-container{justify-content:center;padding-left:0;padding-right:0}}.above-fold{flex:1 0 100vh;display:flex;flex-direction:column;padding-bottom:var(--spacing-unit-global)}main{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:min-content min-content 1fr 100px min-content min-content;grid-template-areas:"headline headline headline headline" "description description description description" "app app app app" ". faqs-separator faqs-separator ." ". faqs-headline faqs-headline ." "faqs faqs faqs faqs";flex:1;width:100%;margin:0 auto;gap:var(--spacing-unit-global);padding:var(--spacing-unit-global);padding-top:calc(var(--spacing-unit-global) * 2);max-width:var(--max-width)}.haikus-page main{grid-template-rows:min-content;grid-template-areas:"headline headline headline headline" "list list list list"}.haiku-page main{grid-template-rows:min-content max-content min-content;grid-template-areas:"headline headline headline headline" "haiku haiku haiku haiku" "link link link link"}@media (min-width: 1024px){main{padding-left:0;padding-right:0}}.headline{grid-area:headline;text-align:center;margin:0;font-size:calc(var(--font-size-xxxl) * 1.2);color:var(--color--dark)}.haiku-page .headline,.haikus-page .headline{text-align:left;font-size:calc(var(--font-size-xxxl))}@media (min-width: 1024px){.headline{font-size:calc(var(--font-size-xxxl) * 2)}.haiku-page .headline,.haikus-page .headline{font-size:calc(var(--font-size-xxxl) * 1.2)}}.description{grid-area:description;margin:0;text-align:center;font-size:var(--font-size-l)}@media (min-width: 1024px){.description{font-size:var(--font-size-xl)}}#app{grid-area:app;min-height:400px;margin-top:calc(var(--spacing-unit-global) * 3);scroll-margin-top:calc(var(--spacing-unit-global) * 4)}.haikus-page .haiku-list{grid-area:list;padding:0;margin:0;list-style:none}.haikus-page .haiku-list li{font-size:var(--font-size-l);margin-bottom:var(--spacing-unit-global)}.haiku-page .haiku{grid-area:haiku;font-size:var(--font-size-l)}@media (min-width: 1024px){.haiku-page .haiku,.haikus-page .haiku-list li{font-size:var(--font-size-xl)}}.haiku-page .link{grid-area:link;margin:0}hr{color:transparent;width:100%;border:none;border-top:1px solid var(--separator-color)}.faqs-separator{grid-area:faqs-separator;align-self:flex-end}.faqs-headline{grid-area:faqs-headline;justify-self:center}.faqs{grid-area:faqs}.faq{border-radius:10px;background-color:var(--editor-color);padding:var(--spacing-unit-global);margin-bottom:var(--spacing-unit-global)}.faq summary{cursor:pointer;font-size:var(--font-size-m);font-weight:var(--font-weight-bold)}.faq p{line-height:1.5}
