body{color:#333;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}label{cursor:pointer}main,header{width:800px;max-width:90%;flex-wrap:wrap;justify-content:space-between;margin:0 auto;display:flex}main{margin-bottom:25px}h1{margin:30px 0 40px;font-size:2.5em;font-weight:900}.column{width:48%}@media screen and (width<=670px){.column{width:100%}}.field-group{align-items:center;margin:0 0 20px;display:flex}.field-group--optional{display:block}.field-group label{margin:0 10px 0 0;display:inline-block}#value-toggle:not(:checked)~.field-group{display:none}.output-code{min-height:100px;color:#222;background:#f7f7f7;border-radius:3px;margin:15px 0;overflow:auto}.field-group input[type=number]{border:1px solid #888;border-radius:3px;padding:3px 7px}.field-group input[type=color]{-webkit-appearance:none;height:30px;width:28px;cursor:pointer;background:0 0;border:none;outline:none;padding:0}.field-group input[type=radio]{margin:0}.output{justify-content:center;align-items:center;margin:0 0 40px;display:flex}.footer-text{text-align:center;border-top:1px solid #ccc;margin:0;padding:30px 0;font-size:.8em}.copy-btn{width:156px;height:40px;color:#fff;cursor:pointer;background-color:#377cf0;border:none;border-radius:3px;margin:0;padding:12px 26px}.copy-btn:hover{background-color:#1951b0}@media (prefers-color-scheme:dark){body{color:#eee;background:#333}a{color:#8dcbfa}input,.output-code{color:#fff;background:#555}input[type=range]{accent-color:#8dcbfa}}
/*# sourceMappingURL=index.413c08fb.css.map */