@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap";.generate{color:oklch(100% 0 0);background:oklch(0% 0 0);min-height:100dvh;overflow:hidden}.generate__wrapper{grid-template-rows:1fr;grid-template-columns:1fr;gap:0;height:100dvh;padding:2em;display:grid}@media (width>=769px){.generate__wrapper{grid-template-columns:repeat(12,1fr);column-gap:2em}}.generate__header{flex-direction:column;justify-content:center;display:flex}@media (width>=769px){.generate__header{z-index:2;flex-direction:row;grid-area:1/3/auto/-1;justify-content:space-between;align-items:flex-start;height:15em;display:flex;position:sticky;top:2em}}.generate__title,.generate__year{-webkit-user-select:none;user-select:none}.generate__header-tabs{gap:1.2em;padding-top:.4em;display:none}@media (width>=769px){.generate__header-tabs{display:flex}}.generate__tab{color:#fff6;font-size:1.2em;font-weight:500;line-height:1.2;text-decoration:none;transition:color .3s}@media (width>=769px){.generate__tab{font-size:1.6em}}.generate__tab:hover,.generate__tab--active{color:oklch(100% 0 0)}@media (width>=769px){.generate__canvas{grid-area:1/1/auto/-1;padding:10%}}.generate__canvas{justify-content:center;align-items:center;min-height:0;display:flex}.generate__canvas canvas{border:1px solid #fff;display:block}.generate__controls{z-index:10;pointer-events:none;background:linear-gradient(#0000 0%,oklch(0% 0 0) 100%);padding:6em 2em 2em;position:fixed;bottom:0;left:0;right:0}.generate__buttons{pointer-events:auto;justify-content:center;gap:1.5em;display:flex}.generate__btn{color:oklch(100% 0 0);cursor:pointer;background:0 0;border:none;outline:none;padding-bottom:2em;font-size:1.2em;font-weight:500;line-height:1.2;transition:opacity .3s}@media (width>=769px){.generate__btn{font-size:1.6em}}.generate__btn:hover{opacity:.6}.generate__btn:disabled{opacity:.4;cursor:default}@media (width>=769px){.generate__code{grid-column:3/11}}.generate__code{padding-bottom:12em}.generate__code pre{border-radius:0;outline:none;margin:0;overflow-x:auto;background:0 0!important;padding:0!important}.generate__code code{font-family:JetBrains Mono,monospace;font-size:1.2em;font-weight:400;line-height:1.6}.generate__code code::selection{color:oklch(0% 0 0);background:oklch(100% 0 0)}.generate__code code ::selection{color:oklch(0% 0 0);background:oklch(100% 0 0)}
