@font-face{font-family:"Aeonik";src:url("../../assets/fonts/aeonik/aeonik-regular.woff2") format("woff2"),url("../../assets/fonts/aeonik/aeonik-regular.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"Aeonik";src:url("../../assets/fonts/aeonik/aeonik-bold.woff2") format("woff2"),url("../../assets/fonts/aeonik/aeonik-bold.woff") format("woff");font-weight:bold;font-style:normal;font-display:swap}@font-face{font-family:"Segoe Print";src:url("../../assets/fonts/segoe-print/segoe-print-regular.woff2") format("woff2"),url("../../assets/fonts/segoe-print/segoe-print-regular.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"Segoe Print";src:url("../../assets/fonts/segoe-print/segoe-print-bold.woff2") format("woff2"),url("../../assets/fonts/segoe-print/segoe-print-bold.woff") format("woff");font-weight:bold;font-style:normal;font-display:swap}@font-face{font-family:"PF Reminder Pro";src:url("../../assets/fonts/pf-reminder-pro/pf-reminder-pro-medium.woff2") format("woff2"),url("../../assets/fonts/pf-reminder-pro/pf-reminder-pro-medium.woff") format("woff");font-weight:medium;font-style:normal;font-display:swap}body{font-family:"Aeonik",sans-serif;font-size:1.125rem;background-color:#16131d;color:#fff;box-sizing:border-box;margin:0;padding:0}@media(max-width: 599px){body{font-size:1rem}}@media(min-width: 1400px){body{font-size:1.25rem}}.navbar{background-color:#16131d;padding:2.5rem;display:flex;justify-content:center;align-items:center}@media(max-width: 599px){.navbar{padding:2rem}}.logo img{width:7rem;height:auto}@media(max-width: 599px){.logo img{width:5.5rem}}@media(min-width: 1400px){.logo img{width:auto;height:2rem}}.editor-container{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:0 2.5rem;height:calc(100vh - 9.5rem);overflow:hidden;gap:2.5rem}@media(max-width: 599px){.editor-container{display:none}}.toolbar{display:flex;flex-direction:column;align-items:center;gap:1rem}.left-toolbar-1,.left-toolbar-2,.right-toolbar-1,.right-toolbar-2{display:flex;flex-direction:column;align-items:center;gap:.5rem;background-color:#1f1b2a;padding:.5rem;border-radius:1rem}.left-toolbar,.left-toolbar-2,.right-toolbar-1{position:relative}.tool,.shapes-tool{display:flex;justify-content:center;align-items:center;position:relative;width:3rem;height:3rem;box-sizing:border-box;overflow:hidden;background-color:#16131d;border:none;padding:.75rem;border-radius:.5rem;cursor:pointer;transition:background-color .3s ease,transform .3s ease}.tool img,.shapes-tool img{width:auto;height:1rem;margin-left:-0.75rem}.tool img,.tool div,.shapes-tool img,.shapes-tool div{transition:transform .15s ease}.tool:hover,.shapes-tool:hover{background-color:#7458ed}.tool:hover img,.shapes-tool:hover img{transform:scale(1.1)}.tool:hover div,.shapes-tool:hover div{transform:scale(1.1)}.tool:active,.shapes-tool:active{transform:scale(0.9)}.tool.active,.shapes-tool.active{background-color:#7458ed}.shapes-icon,.rectangle-icon{width:1.5rem;height:1.5rem;box-sizing:border-box;border:.2rem solid #fff;border-radius:.125rem}.shapes-popup{position:absolute;display:flex;flex-direction:row;align-items:center;top:0;left:calc(100% + 1rem);gap:.5rem;background-color:#1f1b2a;padding:.5rem;border-radius:1rem;z-index:1000;display:none;transition:opacity .15s ease-in-out}.shapes-popup.visible{display:flex;animation:fadeIn .15s ease-in-out}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.shapes-popup.closing{opacity:0}.line-icon{width:1.5rem;height:.2rem;background-color:#fff;box-sizing:border-box;transform:rotate(-45deg);border-radius:1000px}.circle-icon{width:1.5rem;height:1.5rem;box-sizing:border-box;border:.2rem solid #fff;border-radius:50%}.shapes-tool img{width:auto;height:1.5rem;margin-left:0}.color-picker-icon{display:flex;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;box-sizing:border-box;border-radius:50%;background:linear-gradient(135deg, #3084d1 5%, #b01fe2 25%, #e77d41 55%, #addf48 85%)}.color-picker-indicator{width:1rem;height:1rem;box-sizing:border-box;border-radius:50%;border:.2rem solid #16131d;background-color:#16131d}.color-picker-popup{position:absolute;width:auto;height:100%;top:0;left:calc(100% + 1rem);background-color:#1f1b2a;padding:1rem;box-sizing:border-box;border-radius:1rem;display:none;flex-direction:column;justify-content:space-between;gap:1.5rem;z-index:1000;opacity:1;transition:opacity .15s ease-in-out}.color-picker-popup.visible{display:flex;animation:fadeIn .15s ease-in-out}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.color-picker-popup.closing{opacity:0}.color-picker-header{display:flex;justify-content:space-between;align-items:center}.color-picker-header h4{margin:0;padding:0;color:#fff;font-size:1.25rem}.color-picker-header img{width:1.5rem;height:1.5rem;cursor:pointer;transition:transform .15s ease}.color-picker-header img:active{transform:scale(0.9)}.color-selection-area{flex:1;width:26rem;background:linear-gradient(to bottom, transparent, black),linear-gradient(to right, white, transparent);position:relative;border-radius:.5rem}.color-selection-cursor{width:1.5rem;height:1.5rem;box-sizing:border-box;background-color:#7458ed;border-radius:50%;cursor:pointer;border:.25rem solid #fff;position:absolute;transform:translate(-25%, -25%)}.color-sliders{display:flex;flex-direction:column;gap:1rem;width:100%}.hue-slider,.color-opacity-slider{-webkit-appearance:none;width:100%;height:1rem;border-radius:1000px;outline:none;cursor:pointer}.hue-slider::-webkit-slider-thumb,.color-opacity-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:1.5rem;height:1.5rem;background-color:var(--hue-thumb-color, #7458ed);border-radius:50%;cursor:pointer;border:.25rem solid #fff}.hue-slider::-moz-range-thumb,.color-opacity-slider::-moz-range-thumb{width:1.5rem;height:1.5rem;background-color:var(--hue-thumb-color, #7458ed);border-radius:50%;cursor:pointer;border:.25rem solid #fff}.hue-slider{background:linear-gradient(to right, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%)}.color-opacity-slider{background-image:linear-gradient(to right, rgba(255, 255, 255, 0), #7458ed),linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%),linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%);background-size:100% 100%,8px 8px,8px 8px;background-position:0 0,0 0,4px 4px}.color-opacity-slider::-webkit-slider-thumb{background-color:var(--opacity-thumb-color, #ffffff) !important}.color-opacity-slider::-moz-range-thumb{background-color:var(--opacity-thumb-color, #ffffff) !important}.input-row{width:100%;position:relative;display:grid;grid-template-columns:5.25rem 2fr 5.25rem;align-items:center;gap:1rem}.color-format{grid-column:1;width:100%}.color-format-options{display:none;position:absolute;bottom:100%;left:0;width:5.25rem;margin-top:1rem;background-color:#16131d;border-radius:.5rem;list-style:none;padding:0;z-index:1001}.color-format-options li{padding:.75rem 1rem;cursor:pointer;color:#fff;transition:background-color .15s ease}.color-format-options li:hover{background-color:#7458ed}.color-format-options li:first-child{border-radius:.5rem .5rem 0 0}.color-format-options li:last-child{border-radius:0 0 .5rem .5rem}.color-format.open .color-format-options{display:block;animation:fadeIn .15s ease-in-out}.color-format-toggle{border:none;padding:0;margin:0;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;height:2.5rem;padding:0 1rem;box-sizing:border-box;background-color:#16131d;border:none;border-radius:.5rem;cursor:pointer;color:#fff;font-family:"Aeonik",sans-serif;font-size:1rem}.color-format-toggle img{width:1rem;height:1rem;transition:transform .3s ease}.color-format-toggle img.rotated{transform:rotate(-180deg)}.color-inputs{grid-column:2;width:100%}.color-inputs input{width:100%;height:2.5rem;box-sizing:border-box;border-radius:.5rem;border:none;padding:0 1rem;background-color:#16131d;color:#fff;font-family:"Aeonik",sans-serif;font-size:1rem;text-transform:uppercase}.color-inputs input::-moz-placeholder{color:hsla(0,0%,100%,.5)}.color-inputs input::placeholder{color:hsla(0,0%,100%,.5)}.color-inputs input:focus{outline:none}.format-inputs{display:none}.format-inputs.rgb,.format-inputs.hsl{grid-template-columns:repeat(3, 1fr);gap:1rem}.format-inputs.visible{display:block}.rgb input,.hsl input{width:100%;height:2.5rem;box-sizing:border-box;border-radius:.5rem;border:none;padding:0 1rem;background-color:#16131d;color:#fff;font-family:"Aeonik",sans-serif;font-size:1rem}.rgb input::-webkit-outer-spin-button,.rgb input::-webkit-inner-spin-button,.hsl input::-webkit-outer-spin-button,.hsl input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.rgb input::-moz-placeholder, .hsl input::-moz-placeholder{color:hsla(0,0%,100%,.5)}.rgb input::placeholder,.hsl input::placeholder{color:hsla(0,0%,100%,.5)}.rgb input:focus,.hsl input:focus{outline:none}.rgb.visible,.hsl.visible{display:grid}.opacity-input{position:relative;grid-column:3;display:flex;align-items:center;gap:.5rem;width:100%}.opacity-input input{width:100%;height:2.5rem;box-sizing:border-box;border-radius:.5rem;border:none;padding:0 1rem;background-color:#16131d;color:#fff;font-family:"Aeonik",sans-serif;font-size:1rem}.opacity-input input::-webkit-outer-spin-button,.opacity-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.opacity-input input::-moz-placeholder{color:#868489}.opacity-input input::placeholder{color:#868489}.opacity-input input:focus{outline:none}.opacity-input span{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:#868489;font-size:1rem}.saved-colors h4{margin:0;padding:0;color:#fff;font-size:1rem;font-weight:normal;margin-bottom:1rem}.add-color{width:1.5rem;height:1.5rem;box-sizing:border-box;background:#16131d;border:1px dashed rgba(134,132,137,.5);display:flex;align-items:center;justify-content:center;color:#868489;border-radius:50%;cursor:pointer;padding:0;position:relative;transition:border-color .15s ease,color .15s ease,transform .15s ease}.add-color::before,.add-color::after{content:"";position:absolute;background-color:#868489;transition:background-color .15s ease}.add-color::before{width:.75rem;height:2px;border-radius:2px;top:50%;left:50%;transform:translate(-50%, -50%)}.add-color::after{width:2px;height:.75rem;border-radius:2px;top:50%;left:50%;transform:translate(-50%, -50%)}.add-color:hover{border-color:#7458ed;transform:scale(1.1)}.add-color:hover::before,.add-color:hover::after{background-color:#7458ed}.add-color:active{transform:scale(0.9)}.saved-colors-container{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;padding:0;margin:0}.saved-colors-grid{display:flex;gap:.5rem;flex-wrap:wrap;padding:0;margin:0}.saved-colors-grid:empty{display:none}.saved-color-swatch{width:1.5rem;height:1.5rem;border-radius:50%;cursor:pointer;border:2px solid #1f1b2a;transition:transform .15s ease}.saved-color-swatch:hover{transform:scale(1.1);border-color:#7458ed}.saved-color-swatch:active{transform:scale(0.9)}.left-toolbar-2 .tool img,.right-toolbar-1 .tool img,.right-toolbar-2 .tool img{width:auto;height:1.5rem;margin-left:0}.stroke-size-popup,.opacity-popup{position:absolute;height:7.5rem;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between !important;top:0;right:calc(100% + 1rem);background-color:#1f1b2a;padding:1rem;border-radius:1rem;z-index:1000;display:none;transition:opacity .15s ease-in-out}.opacity-popup{top:3.5rem}.stroke-size-popup h4,.opacity-popup h4{margin:0;padding:0;color:#fff;font-size:1.25rem}.stroke-size-popup.visible,.opacity-popup.visible{display:flex;animation:fadeIn .15s ease-in-out}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.stroke-size-popup.closing,.opacity-popup.closing{opacity:0}.stroke-size-display,.opacity-display{display:flex;justify-content:center;align-items:center;gap:1.5rem}.stroke-size-range,.opacity-range{-webkit-appearance:none;width:15rem;height:.75rem;background-color:#868489;border-radius:1000px;outline:none;cursor:pointer}.stroke-size-range::-webkit-slider-thumb,.opacity-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:2rem;height:2rem;background-color:#7458ed;border-radius:50%;cursor:pointer;border:.25rem solid #1f1b2a}.stroke-size-range::-moz-range-thumb,.opacity-range::-moz-range-thumb{width:2rem;height:2rem;background-color:#7458ed;border-radius:50%;cursor:pointer;border:.25rem solid #1f1b2a}.stroke-size-value,.opacity-value{border:none;outline:none;padding:0;margin:0;font:inherit;text-align:center;width:4rem;height:2.5rem;background-color:#16131d;box-sizing:border-box;border-radius:.5rem;display:flex;justify-content:center;align-items:center;color:#fff}.stroke-size-value::-webkit-outer-spin-button,.stroke-size-value::-webkit-inner-spin-button,.opacity-value::-webkit-outer-spin-button,.opacity-value::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.canvas-container{display:flex;flex-grow:1;justify-content:center;align-items:center}.editor-canvas{width:100%;height:calc(100vh - 2.5rem);background-color:#fff;display:block}.mobile-notice{display:none;height:calc(100vh - 9.5rem);font-family:"Aeonik",sans-serif;font-size:1rem;text-align:center;padding:2rem;box-sizing:border-box;justify-content:center;align-items:center}@media(max-width: 599px){.mobile-notice{display:flex}}.mobile-notice-content{max-width:36rem}.mobile-notice-content h1{font-size:2.5rem;line-height:3rem;margin-bottom:2rem}