@media (prefers-color-scheme: light){:root{--c-text: #202020;--c-bg: #fff;--c-section-border: rgba(0, 0, 0, .2);--c-grid-border: rgba(0, 0, 0, .2);color-scheme:light}}@media (prefers-color-scheme: dark){:root{--c-bg: #202020;--c-text: #cecece;--c-section-border: rgba(255, 255, 255, .1);--c-grid-border: rgba(255, 255, 255, .1);color-scheme:dark}}:root.light{--c-text: #202020;--c-bg: #fff;--c-section-border: rgba(0, 0, 0, .2);--c-grid-border: rgba(0, 0, 0, .2);color-scheme:light}:root.dark{--c-bg: #202020;--c-text: #cecece;--c-section-border: rgba(255, 255, 255, .1);--c-grid-border: rgba(255, 255, 255, .1);color-scheme:dark}body{margin:0;font:16px sans-serif;background:var(--c-bg);color:var(--c-text);transition:background-color .2s,color .2s}.layout{width:100vw;height:100vh;display:grid;grid:auto / 350px 1fr 250px;align-items:flex-start}.text-parameters{grid:auto / auto;display:grid;overflow:auto;max-height:100%}.text-parameters>div:first-child{padding:15px 20px 5px}.text-parameters>div:not(:first-child):not(:last-child){padding:5px 20px}.text-parameters>div:last-child{padding:5px 20px}.text-parameters>div:nth-child(even){border-bottom:1px solid var(--c-section-border)}.text-input{resize:vertical;min-height:65px;width:100%;box-sizing:border-box;font:inherit}.ff-header{display:flex;justify-content:space-between;align-items:middle}.font-size-input{width:100%;margin:0}.font-style{display:grid;grid:"a b" "c b" / 1fr 1fr}.fs-browser-container{grid-area:b}.line-height-input{width:100%;margin:0}.canvas{border-left:1px solid var(--c-grid-border);border-right:1px solid var(--c-grid-border);align-self:stretch;overflow:hidden;position:relative}.canvas canvas{width:100%;height:100%;display:block}.canvas-ui{position:absolute;left:0;top:0;width:100%;height:100%;cursor:grab}.canvas-ui.grabbing{cursor:grabbing}.canvas-parameters{display:grid;grid:auto / auto;overflow:auto;max-height:100%}.canvas-parameters>div:first-child{padding:15px 20px 5px}.canvas-parameters>div:not(:first-child):not(:last-child){padding:5px 20px}.canvas-parameters>div:last-child{padding:5px 20px}.color-inputs{display:grid;grid:auto / 70px 50px 30px;column-gap:10px;align-items:center}.color-inputs div input{width:100%}.info-modal::backdrop{background:rgba(0,0,0,.5)}
/*# sourceMappingURL=bundle.css.map */