body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box;margin:0;padding:0}body{font-family:lucida sans unicode,lucida grande,sans-serif}.App{background-color:#f5f5f5;display:flex;flex-direction:column;min-height:100vh}header{-webkit-font-feature-settings:"smcp";font-feature-settings:"smcp";background-color:#5f19dd;color:#fff;font-variant:small-caps;font-weight:500;line-height:1.7;margin-bottom:10px;padding:10px;text-align:center}.Panel{align-items:center;font-size:12px}.Panel,.container{display:flex;flex-direction:column}main{flex-grow:1}footer{align-items:center;display:flex;flex-direction:column}footer .footer{margin-top:10px;width:70vw}footer .footer a{color:#777}footer .footer a:hover{color:#525252}footer .footer p{font-size:10px;padding:10px;text-align:center}.row{display:flex;margin:10px}.column{display:flex;flex-direction:column}.col-33{width:33%}.col-50{width:50%}.slider{background-color:#b5b5b5;border:1px solid #a0a0a0;border-radius:1rem;height:10px;margin:10px;width:200px}.thumb{background:#fff;background:linear-gradient(180deg,#fff 0,#ccc);border:1px solid #cfcfcf;border-radius:5rem;bottom:-4px;cursor:pointer;font-size:12px;height:15px;justify-content:center;text-align:center;width:15px}.settings,.thumb{align-items:center;display:flex}.settings{background-color:#fff;border-bottom:3px solid #eee;border-left:1px solid #eee;border-right:1px solid #eee;flex-direction:column;margin-top:30px;padding:10px}.settings,.viewer{border-radius:1rem}.viewer{background-color:#eee;border-bottom:3px solid #e2e2e2;border-left:1px solid #e2e2e2;border-right:1px solid #e2e2e2}.c-row{align-items:center;display:flex}.wordSpacing{border-left:1px solid #ccc;border-right:1px solid #ccc;padding-right:20px}.lineSpacing,.wordSpacing{padding-left:20px}button.option{align-items:center;background:#fff;background:linear-gradient(180deg,#fff 0,#ccc);border:1px solid #ccc;border-radius:.3rem;cursor:pointer;display:flex;height:20px;justify-content:center;margin-right:5px;padding:10px;width:20px}.o-bold{margin-left:5px}.color,.fontSize{display:flex;margin-right:10px}.fontSize input{margin-left:5px;margin-right:5px;width:30px}.color{border-left:1px solid #ccc;border-right:1px solid #ccc;margin-left:10px;padding-left:20px;padding-right:20px}.color select{margin-right:5px}.color input{width:80px}.fontFamily{margin-right:5px}.active{background:#fff;background:linear-gradient(180deg,#ccc 0,#fff)!important;border-bottom:2px solid #777!important}.textArea{border:1px solid #cecece;height:170px;margin:10px;overflow:auto;padding:5px;resize:none;width:400px}.popover{position:relative}.userColorPicker{margin:5px;position:absolute;top:100%;width:100%;z-index:3}.close{align-items:center;background-color:#000;border-radius:5rem;color:#eee;cursor:pointer;display:flex;font-size:16px;height:20px;left:5px;padding:5px;position:absolute;top:15px;width:20px;z-index:4}.rcp-light{--rcp-background:#fff;--rcp-input-text:#111;--rcp-input-border:rgba(0,0,0,.1);--rcp-input-label:#717171}.rcp-dark{--rcp-background:#181818;--rcp-input-text:#f3f3f3;--rcp-input-border:hsla(0,0%,100%,.1);--rcp-input-label:#999}.rcp{background-color:var(--rcp-background);border-radius:10px}.rcp,.rcp-body{align-items:center;display:flex;flex-direction:column}.rcp-body{box-sizing:border-box;gap:20px;justify-content:center;padding:20px;width:100%}.rcp-saturation{background-image:linear-gradient(transparent,#000),linear-gradient(90deg,#fff,transparent);border-radius:10px 10px 0 0;position:relative;-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.rcp-saturation-cursor{border:2px solid #fff;border-radius:50%;box-shadow:0 0 15px 0 rgba(0,0,0,.15);box-sizing:border-box;height:20px;position:absolute;-webkit-transform:translate(-10px,-10px);transform:translate(-10px,-10px);width:20px}.rcp-hue{background-image:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:10px;height:12px;position:relative;-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.rcp-hue-cursor{border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 .5px rgba(0,0,0,.2);box-sizing:border-box;height:20px;position:absolute;-webkit-transform:translate(-10px,-4px);transform:translate(-10px,-4px);width:20px}.rcp-alpha{border-radius:10px;height:12px;position:relative;-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.rcp-alpha-cursor{border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 .5px rgba(0,0,0,.2);box-sizing:border-box;height:20px;position:absolute;-webkit-transform:translate(-10px,-4px);transform:translate(-10px,-4px);width:20px}.rcp-fields{grid-gap:10px;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));width:100%}.rcp-fields-element{align-items:center;display:flex;flex-direction:column;gap:5px;width:100%}.hex-element{grid-row:1}.hex-element:nth-child(3n){grid-column:1/-1}.rcp-fields-element-input{background:none;border:2px solid;border-color:var(--rcp-input-border);border-radius:5px;box-sizing:border-box;color:var(--rcp-input-text);font-size:14px;font-weight:600;outline:none;padding:10px;text-align:center;width:100%}.rcp-fields-element-label{color:var(--rcp-input-label);font-size:14px;font-weight:600;text-transform:uppercase}