@figurosity/consumer-controls 0.1.0

package/README.md

@@ -0,0 +1,25 @@
+# @figurosity/consumer-controls
+
+Shared Vue 3 / Quasar UI component library for the Figurosity consumer
+frontend. Scaffolded as a walk-away replacement for the legacy
+`@figurosity/quasar-ui-controls` package.
+
+This package is currently a bare scaffold. Components will be ported in
+from `fe/controls/ui/src/` in a subsequent step. The old
+`@figurosity/quasar-ui-controls` npm package remains published and
+supported; consumers will migrate one at a time in their own work
+streams.
+
+## Related packages
+
+- `@figurosity/toolbox` — shared utilities, composables, and constants
+  (including the control-type IDs and loading-status enums used by this
+  package internally).
+
+## Scripts
+
+```bash
+npm run build   # Vite library build → dist/consumer-controls.{js,css}
+npm run test    # Vitest + happy-dom
+npm run lint    # ESLint
+```

package/dist/consumer-controls.css

@@ -0,0 +1 @@
+.c-counter{text-align:right;margin-right:16px}.c-counter-count{font-size:16px;line-height:16px}.c-counter-title{text-transform:uppercase;font-size:8px;line-height:8px;display:block}.c-drawer-header-title{font-size:21px;font-weight:700;letter-spacing:.01em;line-height:70px;position:relative;padding-left:19px;display:inline-block}.c-drawer-header-title.bottom{line-height:50px}.c-bottom-drawer .q-dialog__inner{padding:0;background-color:#000000e6}.c-drawer-header.dark{color:#fff}.c-drawer-header{color:#333}.c-drawer-header-title{font-size:21px;font-weight:700;letter-spacing:.01em;line-height:70px;position:relative;padding-left:19px;display:inline-block;line-height:50px}.c-drawer-header-indicator{position:absolute;top:50%;transform:translateY(-50%);left:0;width:10px}.c-drawer-header-selected .q-item__section--avatar{opacity:1}.c-drawer-header .q-toolbar{padding-right:20px;border-bottom:1px solid rgba(255,255,255,.9)!important}.fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}.c-bottom-drawer-container,.c-bottom-drawer-container-default{position:absolute;top:0;left:0;right:0;bottom:0}.c-button-bar{border-top:1px solid rgba(255,255,255,.2)}.c-camera-direction{width:200px;height:200px;position:relative;margin:30px auto 40px}.c-camera-direction.dark{color:#fff}.c-camera-direction{color:#333}.c-camera-direction .quickpose-angle{position:absolute;top:0;left:0;z-index:100;border-radius:50%}.c-camera-direction .quickpose-angle img{width:100%;height:auto;border-radius:50%}.c-camera-direction.dark .quarters.borders .quarter{color:#fff}.quarters{transform:rotate(45deg);width:100%;height:100%;position:absolute;top:0;left:0;z-index:90}.quarters.overlay{z-index:110}.quarters.borders .quarter>span{position:absolute;font-size:11px;left:50%;top:50%;transform:translate(-50%) translateY(-50%) rotate(-45deg)}.quarters.borders .quarter{background-color:transparent;border-color:#ccc}.quarters.borders .quarter.active{outline:0;border-color:#0087ff;background-color:#0087ff}.quarters.borders .quarter.active span{color:#fff!important}.quarters .quarter{border:1px solid transparent;height:49%;width:49%;position:absolute;z-index:110}.quarters .quarter .fa{color:#fff;position:absolute;font-size:2em}.quarters .quarter.back{top:0;left:0;border-radius:100% 0 0}.quarters .quarter.back.active{border-radius:100% 0 0}.quarters .quarter.back .fa{transform:rotate(45deg);top:25px;left:25px}.quarters .quarter.left{top:0;right:0;border-radius:0 100% 0 0}.quarters .quarter.left.active{border-radius:0 100% 0 0}.quarters .quarter.left .fa{transform:rotate(135deg);top:25px;right:25px}.quarters .quarter.front{bottom:0;right:0;border-radius:0 0 100%}.quarters .quarter.front.active{border-radius:0 0 100%}.quarters .quarter.front .fa{transform:rotate(225deg);bottom:25px;right:25px}.quarters .quarter.right{bottom:0;left:0;border-radius:0 0 0 100%}.quarters .quarter.right.active{border-radius:0 0 0 100%}.quarters .quarter.right .fa{transform:rotate(315deg);bottom:25px;left:25px}:root{--vc-picker-bg: #f8f8f8;--vc-body-bg: #fff;--vc-input-bg: #fff;--vc-input-text: #333;--vc-input-label: #969696;--vc-input-border: #dadada;--vc-chrome-toggle-btn-highlighted: #eee;--vc-ps-bg: #dcdcdc;--vc-ps-title-bg-gradient-start: #f0f0f0;--vc-ps-title-bg-gradient-end: #d4d4d4;--vc-ps-title-border: #B1B1B1;--vc-ps-title-color: #4d4d4d;--vc-ps-slider-border: #b3b3b3;--vc-ps-slider-border-bottom: #f0f0f0;--vs-ps-picker-border-dark: #555;--vs-ps-picker-border-white: #fff;--vc-ps-btn-gradient-start: #fff;--vc-ps-btn-gradient-end: #e6e6e6;--vc-ps-btn-border: #878787;--vc-ps-btn-shadow: #EAEAEA;--vc-ps-btn-color: #000;--vc-ps-preview-border: #000;--vc-ps-label: #000;--vc-ps-input-border: #888;--vc-ps-input-shadow-dark: rgba(0,0,0,.1);--vc-ps-input-shadow-light: #ececec;--vc-sketch-input-label: #222;--vc-sketch-presets-border: #eee;--vc-twitter-input-bg: #fff;--vc-twitter-input-border: #f0f0f0;--vc-twitter-input-color: #666;--vc-twitter-hash-bg: #f0f0f0;--vc-twitter-hash-color: #98A1A4}:root.dark{--vc-body-bg: #424242;--vc-picker-bg: #d0d0d0;--vc-input-bg: #2c2c2c;--vc-input-text: #d0d0d0;--vc-input-label: #bbbbbb;--vc-input-border: #555555;--vc-chrome-toggle-btn-highlighted: #5c5c5c;--vc-sketch-input-label: #bbbbbb;--vc-sketch-presets-border: #5a5a5a;--vc-twitter-input-border: #383838;--vc-twitter-input-color: #bbbbbb;--vc-twitter-hash-bg: #383838;--vc-twitter-hash-color: #a0acaf;--vc-twitter-input-bg: #555;--vc-ps-bg: #424242;--vc-ps-title-bg-gradient-start: #4e4e4e;--vc-ps-title-bg-gradient-end: #3a3a3a;--vc-ps-title-border: #5a5a5a;--vc-ps-title-color: #bbbbbb;--vc-ps-slider-border: #5c5c5c;--vc-ps-slider-border-bottom: #4a4a4a;--vs-ps-picker-border-dark: #b8b8b8;--vs-ps-picker-border-white: #bbbbbb;--vc-ps-btn-gradient-start: #505050;--vc-ps-btn-gradient-end: #3a3a3a;--vc-ps-btn-border: #6a6a6a;--vc-ps-btn-shadow: #2a2a2a;--vc-ps-btn-color: #bbbbbb;--vc-ps-preview-border: #3a3a3a;--vc-ps-label: #bbbbbb;--vc-ps-input-border: #666666;--vc-ps-input-shadow-dark: rgba(0, 0, 0, .45);--vc-ps-input-shadow-light: #2d2d2d}.bg[data-v-4d048d6e]{cursor:crosshair;position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none}.white[data-v-4d048d6e]{background:linear-gradient(to right,#fff,#fff0)}.black[data-v-4d048d6e]{background:linear-gradient(to top,#000,#0000)}.picker-wrap[data-v-4d048d6e]{cursor:pointer;position:absolute;outline:none}.picker[data-v-4d048d6e]{cursor:move;width:4px;height:4px;box-shadow:0 0 0 1.6px var(--vc-picker-bg),inset 0 0 1px 1px #0000004d,0 0 1px 2px #0006;border-radius:50%;transform:translate(-2px,-2px)}.vc-base-slider[data-v-972b0fad]{position:relative;width:100%;height:100%;touch-action:none}.background[data-v-972b0fad],.slider[data-v-972b0fad]{position:absolute;top:0;right:0;bottom:0;left:0}.background[data-v-972b0fad]{overflow:hidden}.slider[data-v-972b0fad]{cursor:pointer;z-index:2}.picker-wrap[data-v-972b0fad]{position:absolute;z-index:2;outline:none}.picker[data-v-972b0fad]{width:4px;height:8px;margin-top:1px;border-radius:1px;box-shadow:0 0 2px #0009;background:var(--vc-picker-bg);cursor:pointer;transform:translate(-2px)}.vc-hue-slider[data-v-5367c985]{cursor:crosshair;touch-action:none}.gradient[data-v-5367c985]{width:100%;height:100%;border-radius:2px;background:var(--2f44f39d)}.vc-checkerboard[data-v-37d61ccd]{position:absolute;top:0;right:0;bottom:0;left:0;background-size:contain}.vc-alpha-slider[data-v-07dd346b] .vc-checkerboard{border-radius:2px}.gradient[data-v-07dd346b]{position:absolute;top:0;right:0;bottom:0;left:0}.vc-editable-input[data-v-9c267b2b]{position:relative}.vc-input-input[data-v-9c267b2b]{width:100%;padding:0;border:0;outline:none}.vc-input-label[data-v-9c267b2b]{text-transform:capitalize}.vc-chrome-picker[data-v-dfdde7e0]{width:225px;box-sizing:initial;border-radius:2px;box-shadow:0 0 2px #0000004d,0 4px 8px #0000004d;font-family:Menlo,Consolas,Courier New,monospace}.controls[data-v-dfdde7e0]{display:flex}.color-wrap[data-v-dfdde7e0]{position:relative;width:36px}.active-color[data-v-dfdde7e0]{position:relative;width:30px;height:30px;border-radius:15px;overflow:hidden;z-index:1}.color-wrap[data-v-dfdde7e0] .vc-checkerboard{width:30px;height:30px;border-radius:15px;background-size:auto}.sliders[data-v-dfdde7e0]{flex:1}.fieldsWrap[data-v-dfdde7e0]{display:flex;padding-top:16px}.fields[data-v-dfdde7e0]{display:flex;margin-left:-6px;flex:1}.field[data-v-dfdde7e0]{padding-left:6px;width:100%}.toggle-btn[data-v-dfdde7e0]{width:32px;text-align:right;position:relative}.toggle-icon[data-v-dfdde7e0]{position:relative;margin-right:-4px;margin-top:12px;cursor:pointer;z-index:2;color:var(--vc-input-text)}.toggle-icon_highlighted[data-v-dfdde7e0]{position:absolute;width:24px;height:28px;top:10px;left:12px;background:var(--vc-chrome-toggle-btn-highlighted);border-radius:4px}.hue-wrap[data-v-dfdde7e0]{position:relative;height:10px;margin-bottom:8px}.alpha-wrap[data-v-dfdde7e0]{position:relative;height:10px}.hue-wrap[data-v-dfdde7e0] .container,.alpha-wrap[data-v-dfdde7e0] .gradient{border-radius:2px}.hue-wrap[data-v-dfdde7e0] .picker,.alpha-wrap[data-v-dfdde7e0] .picker{width:12px;height:12px;border-radius:6px;transform:translate(-6px,-2px);box-shadow:0 1px 4px #0000005e}.body[data-v-dfdde7e0]{padding:16px 16px 12px;background-color:var(--vc-body-bg)}.saturation[data-v-dfdde7e0]{width:100%;padding-bottom:55%;position:relative;border-radius:2px 2px 0 0;overflow:hidden}.saturation[data-v-dfdde7e0] .picker{width:12px;height:12px;transform:translate(-6px,-6px)}.fields[data-v-dfdde7e0] .vc-input-input{width:100%;height:21px;border-radius:2px;border:none;box-shadow:inset 0 0 0 1px var(--vc-input-border);background-color:var(--vc-input-bg);color:var(--vc-input-text);font-size:11px;text-align:center}.fields[data-v-dfdde7e0] .vc-input-label{display:block;margin-top:12px;font-size:11px;color:var(--vc-input-label);line-height:11px;text-transform:uppercase;text-align:center}.alpha-disabled[data-v-dfdde7e0] .active-color{width:18px;height:18px}.alpha-disabled[data-v-dfdde7e0] .color-wrap{width:30px}.alpha-disabled[data-v-dfdde7e0] .hue-wrap{margin-top:4px;margin-bottom:4px}.vc-compact-picker[data-v-91d11fa7]{width:245px;padding-top:5px;padding-left:5px;border-radius:2px;box-sizing:border-box;box-shadow:0 2px 10px #0000001f,0 2px 5px #00000029;background-color:var(--vc-body-bg)}.colors[data-v-91d11fa7]{overflow:hidden;padding:0;margin:0}.color-item[data-v-91d11fa7]{list-style:none;width:15px;height:15px;float:left;margin-right:5px;margin-bottom:5px;position:relative;cursor:pointer}.color-item_white[data-v-91d11fa7]{box-shadow:inset 0 0 0 1px #ddd}.color-item_white .dot[data-v-91d11fa7]{background:#000}.dot[data-v-91d11fa7]{position:absolute;top:5px;right:5px;bottom:5px;left:5px;border-radius:50%;opacity:1;background:#fff}.vc-grayscale-picker[data-v-631223a5]{padding-top:5px;padding-left:5px;width:245px;border-radius:2px;box-sizing:border-box;box-shadow:0 2px 10px #0000001f,0 2px 5px #00000029;background-color:var(--vc-body-bg)}.colors[data-v-631223a5]{overflow:hidden;padding:0;margin:0}.color-item[data-v-631223a5]{list-style:none;width:15px;height:15px;float:left;margin-right:5px;margin-bottom:5px;position:relative;cursor:pointer}.color-item_white[data-v-631223a5]{box-shadow:inset 0 0 0 1px #ddd}.color-item_white .dot[data-v-631223a5]{background:#000}.dot[data-v-631223a5]{position:absolute;top:5px;right:5px;bottom:5px;left:5px;border-radius:50%;opacity:1;background:#fff}.vc-material-picker[data-v-8f86229c]{position:relative;width:98px;height:98px;padding:16px;border-radius:2px;box-shadow:0 2px 10px #0000001f,0 2px 5px #00000029;background-color:var(--vc-body-bg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif}.vc-material-picker[data-v-8f86229c] .vc-input-input{width:100%;height:30px;margin-top:12px;background-color:var(--vc-body-bg);color:var(--vc-input-text);font-size:15px}.vc-material-picker[data-v-8f86229c] .vc-input-label{position:absolute;top:0;left:0;font-size:11px;color:var(--vc-input-label)}.hex[data-v-8f86229c]{border-bottom-width:2px;border-bottom-style:solid}.rgb[data-v-8f86229c]{display:flex;margin-right:-10px;padding-top:11px}.color[data-v-8f86229c]{flex:1;padding-right:10px}.vc-photoshop-picker[data-v-b69df0e5]{width:513px;background:var(--vc-ps-bg);border-radius:4px;box-shadow:0 0 0 1px #00000040,0 8px 16px #00000026;box-sizing:initial;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif}.fields_disabled[data-v-b69df0e5]{width:390px}.title[data-v-b69df0e5]{height:23px;background-image:linear-gradient(-180deg,var(--vc-ps-title-bg-gradient-start) 0%,var(--vc-ps-title-bg-gradient-end) 100%);border-bottom:1px solid var(--vc-ps-title-border);border-radius:4px 4px 0 0;box-shadow:inset 0 1px #fff3,inset 0 -1px #00000005;color:var(--vc-ps-title-color);font-size:13px;line-height:24px;text-align:center}.body[data-v-b69df0e5]{padding:15px;display:flex}.saturation[data-v-b69df0e5]{width:256px;height:256px;position:relative;border:2px solid var(--vc-ps-slider-border);border-bottom:2px solid var(--vc-ps-slider-border-bottom);overflow:hidden}.saturation[data-v-b69df0e5] .picker{width:12px;height:12px;transform:translate(-6px,-6px)}.hue[data-v-b69df0e5]{height:256px;width:19px;margin-left:10px;border:2px solid var(--vc-ps-slider-border);border-bottom:2px solid var(--vc-ps-slider-border-bottom)}.hue-picker[data-v-b69df0e5]{position:relative}.hue-picker-left[data-v-b69df0e5],.hue-picker-right[data-v-b69df0e5]{position:absolute;width:0;height:0;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent var(--vs-ps-picker-border-dark);cursor:pointer}.hue-picker-left[data-v-b69df0e5]:after,.hue-picker-right[data-v-b69df0e5]:after{content:"";width:0;height:0;border-style:solid;border-width:4px 0 4px 6px;border-color:transparent transparent transparent var(--vs-ps-picker-border-white);position:absolute;top:1px;left:1px;transform:translate(-8px,-5px)}.hue-picker-left[data-v-b69df0e5]{transform:translate(-10px,-4px)}.hue-picker-right[data-v-b69df0e5]{transform:translate(21px,-4px) rotate(180deg)}.controls[data-v-b69df0e5]{width:180px;margin-left:10px;display:flex}.controls_fields_disabled[data-v-b69df0e5]{width:auto}.actions[data-v-b69df0e5]{margin-left:20px;flex:1}.action-btn[data-v-b69df0e5]{height:20px;margin-bottom:10px;background-image:linear-gradient(-180deg,var(--vc-ps-btn-gradient-start) 0%,var(--vc-ps-btn-gradient-end) 100%);border:1px solid var(--vc-ps-btn-border);border-radius:2px;box-shadow:0 1px 0 0 var(--vc-ps-btn-shadow);cursor:pointer;color:var(--vc-ps-btn-color);font-size:14px;line-height:20px;text-align:center}.preview[data-v-b69df0e5]{width:60px}.preview-swatches[data-v-b69df0e5]{border:1px solid var(--vc-ps-slider-border);border-bottom:1px solid var(--vc-ps-slider-border-bottom);margin-bottom:2px;margin-top:1px}.preview-color[data-v-b69df0e5]{height:34px;box-shadow:inset 1px 0 var(--vc-ps-preview-border),inset -1px 0 var(--vc-ps-preview-border),inset 0 1px var(--vc-ps-preview-border)}.preview-label[data-v-b69df0e5]{color:var(--vc-ps-label);font-size:14px;text-align:center}.fields[data-v-b69df0e5]{padding-top:5px;padding-bottom:9px;width:80px;position:relative}.fields[data-v-b69df0e5] .vc-input-input{width:40%;height:18px;margin-left:40%;margin-right:10px;margin-bottom:5px;padding-left:3px;border:1px solid var(--vc-ps-input-border);box-shadow:inset 0 1px 1px var(--vc-ps-input-shadow-dark),0 1px 0 0 var(--vc-ps-input-shadow-light);background-color:var(--vc-input-bg);color:var(--vc-ps-label);font-size:13px}.fields[data-v-b69df0e5] .vc-input-label,.fields[data-v-b69df0e5] .vc-input-desc{position:absolute;top:0;height:18px;color:var(--vc-ps-label);font-size:13px;line-height:22px;text-transform:uppercase}.fields[data-v-b69df0e5] .vc-input-label{left:0;width:34px}.fields[data-v-b69df0e5] .vc-input-desc{right:0;width:0}.fields-divider[data-v-b69df0e5]{height:5px}.hex[data-v-b69df0e5] .vc-input-input{width:80%;height:18px;margin-left:20%;margin-bottom:6px;padding-left:3px;border:1px solid var(--vc-ps-input-border);box-shadow:inset 0 1px 1px var(--vc-ps-input-shadow-dark),0 1px 0 0 var(--vc-ps-input-shadow-light);font-size:13px}.hex[data-v-b69df0e5] .vc-input-label{position:absolute;top:0;left:0;width:14px;text-transform:uppercase;font-size:13px;height:18px;line-height:22px}.vc-sketch-picker[data-v-fdb7d989]{position:relative;width:200px;padding:10px 10px 0;box-sizing:initial;background:var(--vc-body-bg);border-radius:4px;box-shadow:0 0 0 1px #00000026,0 8px 16px #00000026;font-family:Menlo,Consolas,Courier New,monospace}.saturation[data-v-fdb7d989]{width:100%;padding-bottom:75%;position:relative;overflow:hidden}.controls[data-v-fdb7d989]{display:flex}.sliders[data-v-fdb7d989]{padding:4px 0;flex:1}.hue[data-v-fdb7d989] .container,.alpha[data-v-fdb7d989] .gradient{border-radius:2px}.hue[data-v-fdb7d989]{position:relative;height:10px}.alpha[data-v-fdb7d989]{position:relative;height:10px;margin-top:4px;overflow:hidden}.color[data-v-fdb7d989]{width:24px;height:24px;position:relative;margin-top:4px;margin-left:4px;border-radius:2px;overflow:hidden}.active-color[data-v-fdb7d989]{position:absolute;top:0;right:0;bottom:0;left:0;box-shadow:inset 0 0 0 1px #00000026,inset 0 0 4px #00000040;z-index:2}.color[data-v-fdb7d989] .vc-checkerboard{background-size:auto}.field[data-v-fdb7d989]{display:flex;padding-top:4px}.field[data-v-fdb7d989] .vc-input-input{width:90%;padding:4px 0 3px 10%;border:none;box-shadow:inset 0 0 0 1px var(--vc-input-border);background-color:var(--vc-input-bg);color:var(--vc-input-text);font-size:10px}.field[data-v-fdb7d989] .vc-input-label{display:block;padding-top:3px;padding-bottom:4px;color:var(--vc-sketch-input-label);font-size:11px;text-align:center}.field_single[data-v-fdb7d989]{flex:1;padding-left:6px}.field_double[data-v-fdb7d989]{flex:2}.presets[data-v-fdb7d989]{margin-right:-10px;margin-left:-10px;padding-left:10px;padding-top:10px;border-top:1px solid var(--vc-sketch-presets-border)}.preset-color[data-v-fdb7d989]{border-radius:3px;overflow:hidden;position:relative;display:inline-block;margin:0 10px 10px 0;vertical-align:top;cursor:pointer;width:16px;height:16px;box-shadow:inset 0 0 0 1px #00000026}.preset-color[data-v-fdb7d989] .vc-checkerboard{box-shadow:inset 0 0 0 1px #00000026;border-radius:3px}.alpha-disabled .color[data-v-fdb7d989]{height:10px}.vc-slider-picker[data-v-675d6988]{position:relative;width:410px}.hue[data-v-675d6988]{height:12px;position:relative}.hue[data-v-675d6988] .picker,.alpha[data-v-675d6988] .picker{width:14px;height:14px;border-radius:6px;box-shadow:0 1px 4px #0000005e;transform:translate(-7px,-2px)}.alpha[data-v-675d6988]{height:12px;position:relative;margin-top:20px}.swatches[data-v-675d6988]{display:flex;margin-top:20px}.swatch[data-v-675d6988]{margin-right:1px;flex:1;width:20%}.swatch[data-v-675d6988]:first-child{margin-right:1px}.swatch:first-child .picker[data-v-675d6988]{border-radius:2px 0 0 2px}.swatch[data-v-675d6988]:last-child{margin-right:0}.swatch:last-child .picker[data-v-675d6988]{border-radius:0 2px 2px 0}.picker[data-v-675d6988]{cursor:pointer;height:12px}.swatch:nth-child(n) .picker_active[data-v-675d6988]{transform:scaleY(1.8);border-radius:3.6px/2px}.picker_white[data-v-675d6988]{box-shadow:inset 0 0 0 1px #ddd}.picker_active.picker_white[data-v-675d6988]{box-shadow:inset 0 0 0 .6px #ddd}.vc-swatches-picker[data-v-3427cb2a]{width:320px;height:240px;overflow-y:scroll;background-color:var(--vc-body-bg);box-shadow:0 2px 10px #0000001f,0 2px 5px #00000029}.box[data-v-3427cb2a]{padding:16px 0 6px 16px;overflow:hidden}.colorGroup[data-v-3427cb2a]{padding-bottom:10px;width:40px;float:left;margin-right:10px}.color[data-v-3427cb2a]{box-sizing:border-box;width:40px;height:24px;margin-bottom:1px;cursor:pointer;overflow:hidden;-ms-border-radius:2px 2px 0 0;-moz-border-radius:2px 2px 0 0;-o-border-radius:2px 2px 0 0;-webkit-border-radius:2px 2px 0 0;border-radius:2px 2px 0 0}.color_white[data-v-3427cb2a]{border:1px solid #ddd}.picker[data-v-3427cb2a]{display:block;fill:#fff;margin-left:8px}.color_white .picker[data-v-3427cb2a]{fill:#333}.vc-twitter-picker[data-v-e74ac697]{position:relative;background:var(--vc-body-bg);border:0 solid rgba(0,0,0,.25);box-shadow:0 1px 4px #00000040;border-radius:4px}.triangle[data-v-e74ac697]{position:absolute;width:0px;height:0px;border-style:solid;border-width:0 9px 10px 9px;border-color:transparent transparent var(--vc-body-bg) transparent}.triangle_shadow[data-v-e74ac697]{width:0px;height:0px;border-style:solid;border-width:0 9px 10px 9px;border-color:transparent transparent rgba(0,0,0,.1) transparent;position:absolute}.body[data-v-e74ac697]{padding:15px 9px 9px 15px}.vc-twitter-picker[data-v-e74ac697] .vc-editable-input{position:relative}.vc-twitter-picker[data-v-e74ac697] .vc-input-input{float:left;width:100px;height:28px;padding:1px 1px 1px 8px;outline:none;box-shadow:inset 0 0 0 1px var(--vc-twitter-input-border);box-sizing:content-box;border:0px;border-radius:0 4px 4px 0;background-color:var(--vc-twitter-input-bg);color:var(--vc-twitter-input-color);font-size:14px}.vc-twitter-picker[data-v-e74ac697] .vc-editable-input span{display:none}.hash[data-v-e74ac697]{float:left;display:flex;align-items:center;justify-content:center;height:30px;width:30px;border-radius:4px 0 0 4px;background:var(--vc-twitter-hash-bg);color:var(--vc-twitter-hash-color)}.swatch[data-v-e74ac697]{width:30px;height:30px;float:left;border-radius:4px;margin:0 6px 6px 0;cursor:pointer;position:relative;outline:none}.clear[data-v-e74ac697]{clear:both}.tri_hide .triangle[data-v-e74ac697],.tri_hide .triangle_shadow[data-v-e74ac697]{display:none}.tri_top_left .triangle[data-v-e74ac697]{top:-10px;left:12px}.tri_top_left .triangle_shadow[data-v-e74ac697]{top:-11px;left:12px}.tri_top_right .triangle[data-v-e74ac697]{top:-10px;right:12px}.tri_top_right .triangle_shadow[data-v-e74ac697]{top:-11px;right:12px}.vc-hue-wrap[data-v-b3ac1ab2]{height:8px}.vc-hue-wrap[data-v-b3ac1ab2] .slider{border-radius:4px}.vc-hue-wrap[data-v-b3ac1ab2] .picker{width:20px;height:20px;margin:0;border-radius:50%;box-shadow:none;border:2px white solid;background-color:var(--46ac36b6);transform:translate(-12px) translateY(-8px)}.vc-hsl-sliders[data-v-2e071f54]{position:relative;width:100%;font-family:Menlo,Consolas,Courier New,monospace}.slider-wrap[data-v-2e071f54]{display:flex;gap:12px;height:24px;margin-bottom:10px}.slider-wrap[data-v-2e071f54]:last-of-type{margin-bottom:0}.label[data-v-2e071f54]{display:block;height:24px;color:var(--vc-input-text);font-size:12px;line-height:24px;text-transform:uppercase;text-align:center}.vc-hsl-sliders[data-v-2e071f54] .vc-base-slider{margin-top:5px;height:14px}.vc-hsl-sliders[data-v-2e071f54] .background{border-radius:4px;border:1px solid var(--vc-input-border)}.gradient[data-v-2e071f54]{width:100%;height:100%}.vc-hsl-sliders[data-v-2e071f54] .picker{width:20px;height:20px;margin:0;border-radius:50%;box-shadow:none;border:2px white solid;transform:translate(-12px) translateY(-5px)}.h-slider[data-v-2e071f54] .picker{background-color:var(--41b5b6d0)}.s-slider[data-v-2e071f54] .picker,.l-slider[data-v-2e071f54] .picker{background-color:var(--05fbe691)}.vc-hsl-sliders[data-v-2e071f54] .vc-editable-input{border-bottom:1px solid var(--vc-input-border)}.vc-hsl-sliders[data-v-2e071f54] .vc-input-input{width:50px;background:none;color:var(--vc-input-text);font-size:12px;text-align:center}.vc-hsv-sliders[data-v-d6cfe1d9]{position:relative;width:100%;font-family:Menlo,Consolas,Courier New,monospace}.slider-wrap[data-v-d6cfe1d9]{display:flex;gap:12px;height:24px;margin-bottom:10px}.slider-wrap[data-v-d6cfe1d9]:last-of-type{margin-bottom:0}.label[data-v-d6cfe1d9]{display:block;height:24px;color:var(--vc-input-text);font-size:12px;line-height:24px;text-transform:uppercase;text-align:center}.vc-hsv-sliders[data-v-d6cfe1d9] .vc-base-slider{margin-top:5px;height:14px}.vc-hsv-sliders[data-v-d6cfe1d9] .background{border-radius:4px;border:1px solid var(--vc-input-border)}.gradient[data-v-d6cfe1d9]{width:100%;height:100%}.vc-hsv-sliders[data-v-d6cfe1d9] .picker{width:20px;height:20px;margin:0;border-radius:50%;box-shadow:none;border:2px white solid;transform:translate(-12px) translateY(-5px)}.h-slider[data-v-d6cfe1d9] .picker{background-color:var(--f666f450)}.s-slider[data-v-d6cfe1d9] .picker,.b-slider[data-v-d6cfe1d9] .picker{background-color:var(--46b90cce)}.vc-hsv-sliders[data-v-d6cfe1d9] .vc-editable-input{border-bottom:1px solid var(--vc-input-border)}.vc-hsv-sliders[data-v-d6cfe1d9] .vc-input-input{width:50px;background:none;color:var(--vc-input-text);font-size:12px;text-align:center}.vc-rgb-sliders[data-v-98b3b212]{position:relative;width:100%;font-family:Menlo,Consolas,Courier New,monospace}.slider-wrap[data-v-98b3b212]{display:flex;gap:12px;height:24px;margin-bottom:10px}.slider-wrap[data-v-98b3b212]:last-of-type{margin-bottom:0}.label[data-v-98b3b212]{display:block;height:24px;color:var(--vc-input-text);font-size:12px;line-height:24px;text-transform:uppercase;text-align:center}.vc-rgb-sliders[data-v-98b3b212] .vc-base-slider{margin-top:5px;height:14px}.vc-rgb-sliders[data-v-98b3b212] .background{border-radius:4px;border:1px solid var(--vc-input-border)}.gradient[data-v-98b3b212]{width:100%;height:100%}.vc-rgb-sliders[data-v-98b3b212] .picker{width:20px;height:20px;margin:0;border-radius:50%;box-shadow:none;border:2px white solid;transform:translate(-12px) translateY(-5px)}.slider-wrap[data-v-98b3b212]:not(.a-slider) .picker{background-color:var(--5f730604)}.vc-rgb-sliders[data-v-98b3b212] .vc-editable-input{border-bottom:1px solid var(--vc-input-border)}.vc-rgb-sliders[data-v-98b3b212] .vc-input-input{width:50px;background:none;color:var(--vc-input-text);font-size:12px;text-align:center}.c-divider{margin:38px 10px 0;padding-top:12px}.c-divider.divider div{border-color:#fff3}.c-divider div{margin-left:2px;height:32px;border-left:1px solid transparent}.c-divider span{margin-right:1px;border-left:1px dotted rgba(255,255,255,.5);height:30px}.c-duration-button.dark{background-color:#fff!important;color:#0087ff!important}.c-duration-button.selected.dark{background-color:#0087ff!important}.c-duration-button.selected.dark .c-duration-button-duration,.c-duration-button.selected.dark .c-duration-button-unit{color:#fff!important}.c-duration-button{background-color:#fff;color:#ccc;line-height:11.6666666667px;height:70px;width:70px;transition:border-color .3s,background-color .3s,color .3s}.c-duration-button.q-btn--outline .q-btn__wrapper:before{border-width:1px}.c-duration-button .c-duration-button-duration,.c-duration-button .c-duration-button-unit{color:#333!important}.c-duration-button.selected{background-color:#0087ff!important}.c-duration-button.selected .c-duration-button-duration,.c-duration-button.selected .c-duration-button-unit{color:#fff!important}.c-duration-button-duration{width:100%;font-weight:700;font-size:31.8181818182px;line-height:21px;letter-spacing:-.05em}.c-duration-button-unit{font-weight:500;font-size:17.5px;line-height:17.5px}.c-expansion-item{color:var(--grey-700)}.c-expansion-item .q-expansion-item__container .q-expansion-item__content:first-child{margin-top:20px;background-color:red}.c-expansion-item .q-item__section--side{color:#fff}.c-expansion-item .q-item__label{font-size:16px;font-weight:700}.c-expansion-item.selected .q-item__section--avatar{opacity:1}.c-expansion-item.negative .q-item__section--avatar svg{color:#d0051e}.c-expansion-item.locked .q-item__section--avatar{width:20px;min-width:20px}.c-expansion-item.locked .q-item__section--avatar .q-icon{margin-left:-5px;width:18px;height:18px}.c-expansion-item.locked .q-item__section--avatar svg{width:18px;height:18px;color:#fff}.c-expansion-item.positive .q-item__section--avatar svg{color:#96cb00}.c-expansion-item .q-item{padding-left:12px}.c-expansion-item .q-item__section--avatar{transition:opacity .3s;opacity:0;width:20px;min-width:20px}.c-expansion-item .q-item__section--avatar .q-icon{font-size:10px}.c-expansion-item .q-item__section--avatar svg{font-size:10px;color:#0087ff}.c-horizontal-scroller{position:relative;width:100%;overflow:hidden;z-index:100}.c-horizontal-scroller.full-height,.c-horizontal-scroller-outer{position:absolute;top:0;left:0;right:0;bottom:0}.c-horizontal-scroller-inner{position:absolute;top:0;display:inline-block;height:100%;margin:0 auto;white-space:nowrap;scrollbar-width:none;-ms-overflow-style:none}.c-horizontal-scroller-inner::-webkit-scrollbar{width:0;height:0}.c-item-heading{padding-left:30px;text-transform:uppercase;font-size:14px}.c-rect-button{border:1px solid #cccccc;border-radius:10px;width:80px;height:110px;position:relative;overflow:hidden;background-color:#fff;color:#333;transition:border-color .3s,background-color .3s,color .3s}.c-rect-button-overlay{position:absolute;top:0;left:0;right:0;bottom:0;z-index:10;background-color:#0000004d}.c-rect-button-overlay>.q-icon{position:absolute;left:50%;top:40%!important;transform:translateY(-50%) translate(-50%);opacity:1}.c-rect-button.dark{border:1px solid #0087ff;color:#0087ff}.c-rect-button .q-icon{position:absolute;top:10px;font-size:5em}.c-rect-button.selected{border-color:#ffffff80;background-color:#0087ff;color:#fff}.c-rect-button-image{position:absolute;top:5px;right:0;left:0;bottom:85px}.c-rect-button-image>img{width:100%;height:auto}.c-rect-button-label{font-size:12px;font-weight:400;position:absolute;bottom:2px;z-index:11}.expando-enter-active,.expando-leave-active{transition:opacity .5s,width .5s,transform .5s,margin-left .5s}.expando-enter,.expando-leave-to{opacity:0;width:0!important;margin-left:0!important}.c-round-button-holder{display:inline-block;width:70px}.c-round-button{border:2px #cccccc solid}.c-round-button.dark{border-color:#fff}.c-round-button.dark .q-icon{color:#fff!important}.c-round-button.dark .c-round-button-label{color:#ffffff80}.c-round-button{position:relative;width:70px;height:70px;margin-bottom:30px;transition:border-color .3s,background-color .3s,color .3s}.c-round-button .q-icon{font-size:3.5em;color:#ccc;transition:color .3s}.c-round-button .c-round-button.selected.dark .c-round-button-label,.c-round-button .c-round-button.selected.dark .q-icon{color:#fff;transition:color .3s}.c-round-button.selected{border-color:#0087ff;background-color:#0087ff}.c-round-button.selected .c-round-button-label{color:#0087ff;transition:color .3s}.c-round-button.selected .q-icon{color:#fff;transition:color .3s}.c-round-button-image{position:absolute;top:0;left:0;right:0;bottom:0}.c-round-button-image>img{border-radius:50%;background-color:#fff;width:100%;height:auto}.c-round-button-label{text-align:center;position:absolute;top:72px;left:50%;transform:translate(-50%);font-size:14px;font-weight:400;color:#b3b3b3;transition:color .3s}.c-slider{padding-left:12px!important;margin-top:5px;color:#333}.c-slider.dark{color:#fff9}.c-slider.dark .q-slider__track{background-color:#fff9}.c-slider.dark .c-slider-indicator-tick{border-right:1px solid rgba(255,255,255,.6)}.c-slider:first-child{margin-top:15px}.c-slider:last-child{margin-bottom:15px}.c-slider.no-icons .c-slider-title{left:5px}.c-slider-title{position:absolute;text-transform:uppercase;font-weight:500;top:-14px;left:0}.c-slider .q-slider__track{background-color:#ccc;border-radius:10px}.c-slider-left-icon{width:20px}.c-slider-left-icon.q-item__section--side{padding-right:5px}.c-slider-right-icon.q-item__section--side{padding-left:2px}.c-slider-indicator{position:absolute;left:0;right:0;bottom:6px;height:3px}.c-slider-indicator-tick{left:0;top:0;position:absolute;height:5px;border-right:1px solid #cccccc}.c-toggle{border-radius:4px}.c-toggle.dark .c-toggle-title{color:#fff9}.c-toggle-title{color:#333;text-transform:uppercase;font-weight:500!important;font-size:14px!important;padding-left:20px}.c-toggle.full .c-toggle-title{padding-left:0}.c-contrast-button{z-index:200}.c-drawer .q-drawer__content{padding-bottom:27px}.c-drawer .q-drawer__content::-webkit-scrollbar{width:0;background:transparent}.c-drawer .q-drawer__content::-webkit-scrollbar-thumb{background:red}.c-drawer.dark{color:#fff}.c-drawer.dark aside{background-color:#000c!important}.c-drawer.overlay-transparent .q-drawer__backdrop{background-color:#0000!important}.c-fab.q-btn{color:#0003}.c-fab.q-btn .q-icon{font-size:30px;padding:5px}.c-right-drawer-container{width:299px!important;background-color:#000000e6;padding-bottom:37px}.c-right-drawer .q-dialog__inner--minimized{padding:0}.c-interactive-layout .profile-icon{position:fixed;top:9px;right:12px;z-index:1000}.c-interactive-layout .c-menu-button{position:fixed;top:9px;left:12px;z-index:2998}.c-interactive-layout .c-avatar-button{position:fixed;top:9px;right:12px;z-index:2998}.c-interactive-layout .q-drawer--left{z-index:3098}.c-interactive-layout-overlay{position:fixed;top:0;left:0;bottom:0;right:0;z-index:8000;background-color:#fffc}.c-interactive-layout .logo-button{position:fixed;bottom:20px;left:20px;display:block;height:72px;width:72px;z-index:100;opacity:.15}.c-interactive-layout .logo-button .q-btn{cursor:default!important}.c-interactive-layout .logo-button svg{width:72px;height:72px}.c-interactive-layout .q-page-container{padding-top:0!important;padding-bottom:0!important}.c-interactive-layout .q-header{color:#170a27;font-size:20px;font-weight:700;background-color:transparent;z-index:2998}.c-interactive-layout .controls-header{background-color:#fff0}.c-layout-overlay{position:fixed;top:0;left:0;bottom:0;right:0;z-index:200;background-color:#fff9}.c-layout .c-right-drawer .fullscreen.q-drawer__backdrop{background-color:transparent!important;opacity:0}.c-layout .profile-icon{position:fixed;top:9px;right:12px;z-index:2500}.c-layout .logo-button{position:fixed;bottom:20px;left:20px;display:block;height:72px;width:72px;z-index:100;opacity:.15;transition:color .3s}.c-layout .logo-button .q-btn{cursor:default!important}.c-layout .logo-button .q-icon{font-size:72px!important}.c-layout .logo-button svg{width:72px;height:72px}.c-layout .q-page-container{padding-top:0!important;padding-bottom:0!important}.c-layout .q-header{color:#170a27;font-size:20px;font-weight:700;background-color:transparent}.c-layout .controls-header{background-color:#fff0}.c-tool-layout-left-header-icon{position:fixed;top:10px;left:10px;z-index:2999}.c-tool-layout-right-header-icon{position:fixed;top:10px;right:9px;z-index:4000}.c-tool-layout-center-header-icon{position:fixed;top:8px;right:180px;z-index:2000;transform:translate(50%)}.mobile .c-tool-layout,.mobile .c-tool-layout .q-page-container{height:100vh}.mobile .c-tool-layout-center-header-icon{right:50%;transform:translate(50%)}:root{--blue-300: #7cc2ff;--blue-400: #5fb4ff;--blue-500: #0087ff;--blue-900: #002c52;--bright-green-500: #96cb00;--bright-red-500: #d0051e;--bright-yellow-500: #ffc300;--crimson-500: #8d0a54;--crimson-900: #480030;--mustard-500: #d6a731;--mustard-900: #745a18;--green-500: #22988d;--green-900: #003e39;--orange-500: #bf4628;--orange-900: #5c1c0c;--purple-500: #7c01cb;--purple-900: #320052;--grey-100: #ffffff;--grey-200: #f8f8f8;--grey-300: #e6e6e6;--grey-400: #c8c8c8;--grey-500: #afafaf;--grey-600: #969696;--grey-700: #6e6e6e;--grey-800: #383838;--grey-900: #170a27;--white: #ffffff;--black: #170a27;--button-border: #c8c8c8;--primary: #0087ff;--secondary: #480030}.c-tool-page{height:100vh}.c-tool-page .c-tool-page-drawer-button{position:absolute;bottom:10px;left:5px;z-index:1001}