.p-1{padding:var(--size-1)}.p-2{padding:var(--size-2)}.p-3{padding:var(--size-3)}.m-1{margin:var(--size-1)}.m-2{margin:var(--size-2)}.m-3{margin:var(--size-3)}.ml-1{margin-left:var(--size-1)}.ml-2{margin-left:var(--size-2)}.ml-3{margin-left:var(--size-3)}.mr-1{margin-right:var(--size-1)}.mr-2{margin-right:var(--size-2)}.mr-3{margin-right:var(--size-3)}.typography{font-family:Roboto,Arial,sans-serif;line-height:1.3}.typography--h1{font-size:6rem;font-weight:300;line-height:1.167;letter-spacing:-.01562em}.typography--h2{font-size:3.75rem;font-weight:300;line-height:1.2;letter-spacing:-.00833em}.typography--h3{font-size:3rem;font-weight:400;line-height:1.167;letter-spacing:0em}.typography--h4{font-size:2.125rem;font-weight:400;line-height:1.235;letter-spacing:.00735em}.typography--h5{font-size:1.5rem;font-weight:400;line-height:1.334;letter-spacing:0em}.typography--h6{font-size:1.25rem;font-weight:500;line-height:1.6;letter-spacing:.0075em}.typography--subtitle1{font-size:1rem;font-weight:400;line-height:1.75;letter-spacing:.00938em}.typography--subtitle2{font-size:.875rem;font-weight:500;line-height:1.57;letter-spacing:.00714em}.typography--body1{font-size:1rem;font-weight:400;line-height:1.5;letter-spacing:.00938em}.typography--body2{font-size:.875rem;font-weight:400;line-height:1.43;letter-spacing:.01071em}.typography--caption{font-size:.75rem;font-weight:400;line-height:1.66;letter-spacing:.03333em}.typography--overline{font-size:.75rem;font-weight:400;line-height:2.66;text-transform:uppercase;letter-spacing:.08333em}.typography--color-initial{color:inherit}.typography--color-primary{color:var(--primary-color)}.typography--color-secondary{color:var(--secondary-color)}.typography--color-error{color:var(--text-error-color)}.typography--color-success{color:var(--success-color)}.typography--color-warning{color:var(--warning-color)}.typography--color-textLight{color:var(--text-light-color)}.typography--color-textPrimary{color:var(--text-color)}.typography--color-textSecondary{color:var(--text-secondary-color)}.typography--align-inherit{text-align:inherit}.typography--align-left{text-align:left}.typography--align-center{text-align:center}.typography--align-right{text-align:right}.typography--align-justify{text-align:justify}.typography--gutterBottom{margin-bottom:1rem}.typography--noWrap{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes slide-in{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slide-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:0}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fade-in{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.rotate-infinite{animation:rotate 1s linear infinite}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent;border-radius:10px}::-webkit-scrollbar-thumb{background:#0003;border-radius:10px;border:2px solid transparent;background-clip:content-box}::-webkit-scrollbar-thumb:hover{background:#0000004d;border:2px solid transparent;background-clip:content-box}::-webkit-scrollbar-corner{background:transparent}*{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent}.pointer{cursor:pointer}.resize-ew{cursor:ew-resize}html,body{margin:0;-webkit-user-select:none;user-select:none}button,input{outline:none}input{border:none}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-webkit-appearance:textfield;appearance:textfield;-moz-appearance:textfield}input[type=color]{border-radius:0;padding:0;border:none}input[type=color]::-moz-color-swatch{border:none}input[type=color]::-webkit-color-swatch-wrapper{padding:0;border-radius:0}input[type=color]::-webkit-color-swatch{border:none}.typography{margin:0;padding:0}.divider{background-color:var(--line-secondary-color)}.divider-horizontal{height:1px;width:100%;margin:var(--size-1) 0}.divider-vertical{width:1px;height:100%;margin:0 var(--size-1)}.button{display:flex;align-items:center;justify-content:center;background-color:var(--secondary-color);border:1px solid transparent;border-radius:var(--size-1);padding:var(--size-2);cursor:pointer;transition:background-color .2s,transform .2s;font-size:var(--font-size-2);color:var(--text-color)}.button *{transition:background-color .2s,transform .2s,stroke .1s}.button.primary{background-color:var(--primary-color);color:var(--text-light-color)}.button.primary svg{stroke:var(--text-light-color)}.button.text{background-color:transparent;border-color:transparent}.button.rectangle{border-radius:0}.button.secondary{border-radius:var(--size-3);padding:var(--size-1) var(--size-2)}.button:hover,.button.text:hover{background-color:var(--secondary-dark-color)}.button.primary:hover{background-color:var(--primary-dark-color)}.button:disabled,.button:disabled *{color:var(--text-disabled-color);stroke:var(--text-disabled-color);pointer-events:none}.button.color-box{width:var(--size-5);height:var(--size-5);transition:transform .2s}.button.color-box:hover{transform:scale(1.1)}.modal-actions{padding:var(--size-1) var(--size-3)}.modal-header{position:relative;min-height:30px;padding:var(--size-1) var(--size-1) var(--size-1) var(--size-3)}.modal-close-button{position:absolute;right:0;margin:var(--size-1)}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:var(--bg-overlay-color);display:flex;justify-content:center;align-items:center;z-index:var(--modal-z-index);visibility:hidden;opacity:0;transition:opacity .3s ease,visibility .3s ease}.modal-overlay.show{visibility:visible;opacity:1}.modal{background-color:var(--bg-secondary-color);color:var(--text-color);border-radius:var(--size-2);box-shadow:0 2px 2px var(--bg-secondary-color);overflow-x:hidden;overflow-y:auto;animation:fade-in .3s ease;min-width:200px}.modal-body{padding:var(--size-3);overflow:hidden;overflow-y:auto}@media (max-width: 480px){.information-modal{max-width:350px}}.snackbar-container{position:fixed;display:flex;justify-content:center;align-items:center;padding:16px;z-index:var(--snackbar-z-index);pointer-events:none}.snackbar{max-width:400px;background-color:var(--primary-color);color:var(--text-light-color);border-radius:var(--size-1);padding:var(--size-2) var(--size-3);box-shadow:2px 2px 2px var(--bg-overlay-color);pointer-events:auto;animation:slide-in .3s ease-out forwards}.snackbar-container.bottom-center{bottom:0;left:0;right:0}.snackbar-container.top-center{top:0;left:0;right:0}.snackbar-container.bottom-left{bottom:0;left:0;justify-content:flex-start}.snackbar-container.bottom-right{bottom:0;right:0;justify-content:flex-end}.snackbar-container.top-left{top:0;left:0;justify-content:flex-start}.snackbar-container.top-right{top:0;right:0;justify-content:flex-end}.snackbar.exiting{animation:slide-out .3s ease-out forwards}.toolbar{display:flex;align-items:center;justify-content:flex-start;z-index:var(--toolbar-z-index);background-color:var(--bg-secondary-color);gap:var(--size-2);padding-right:var(--size-2);padding-left:var(--size-2)}.toolbar.horizontal{width:100%;overflow-x:auto}.toolbar.vertical{flex-direction:column;width:fit-content;height:100%;overflow-y:auto}.toolbar.reset-padding{padding-right:0;padding-left:0}.toolbar.border{border:1px solid var(--line-secondary-color)}.toolbar.elevation{box-shadow:0 4px 8px var(--bg-secondary-color)}.toolbar.teritary{background-color:var(--bg-teritary-color)}.mode-toolbar{position:fixed;margin-top:var(--total-bars-height);border-bottom:1px solid var(--line-secondary-color);z-index:var(--mode-toolbar-z-index)}.button.tab{border-radius:0;padding:var(--size-1);padding-left:var(--size-3);padding-right:var(--size-1)}.button.primary.tab:hover{background-color:var(--primary-color)}.tab-label{max-width:100px}.tab input{background-color:var(--transparent-color);padding:0;color:var(--light-text);field-sizing:content;max-width:100px}.tabs-bar{position:fixed;width:100%;z-index:var(--toolbar-z-index);top:var(--app-bar-height);height:var(--tabs-bar-height);background-color:var(--bg-secondary-color)}.menu{background-color:var(--bg-secondary-color);border:1px solid var(--line-secondary-color);border-radius:var(--size-1);padding:var(--size-1) 0;overflow:hidden;overflow-y:auto;z-index:var(--menu-z-index);display:flex;flex-direction:column}.menu-item{background-color:transparent;border-color:transparent;border-radius:0;padding-top:var(--size-1);padding-bottom:var(--size-1);padding-left:var(--size-2)}.menu-item-description{color:var(--text-secondary-color);font-size:var(--font-size-1)}.key-cap{padding:var(--size-1);border-radius:var(--size-1);border:1px solid var(--text-secondary-color);color:var(--text-secondary-color)}.input-wrapper{position:relative;border:1px solid var(--line-color);border-radius:var(--size-1);transition:border-color .2s ease,box-shadow .2s ease}.input-wrapper.invalid{border-color:var(--error-bg-color);box-shadow:0 0 0 2px var(--error-bg-color)}.input-label{position:absolute;top:0;margin:var(--size-2);left:0;color:var(--text-color);font-size:14px;background-color:var(--bg-secondary-color);transition:font-size .2s ease,color .2s ease,top .2s ease;pointer-events:none}.input-label.invalid{color:var(--text-error-color)}.input-field{padding:var(--size-2);border:none;width:80px;background-color:var(--bg-secondary-color);color:var(--text-color);transition:border-color .2s ease,box-shadow .2s ease}.input-wrapper:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 2px var(--primary-color)}.input-wrapper:focus-within.invalid{border-color:var(--error-bg-color);box-shadow:0 0 0 2px var(--error-bg-color)}.input-field:focus+.input-label,.input-wrapper:focus-within .input-label{font-size:12px;top:-18px;color:var(--primary-color)}.input-field:focus.invalid+.input-label,.input-wrapper:focus-within.invalid .input-label{color:var(--text-error-color)}.input-field:not(:placeholder-shown)+.input-label{font-size:12px;top:-18px}.input-field:disabled,.input-field:disabled+.input-label{color:var(--text-disabled-color)}.input input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{transition:none;background-color:var(--bg-secondary-color)!important;box-shadow:0 0 0 1000px var(--bg-secondary-color) inset!important;-webkit-text-fill-color:var(--text-color)!important}.hotkeys-modal-body{padding-top:var(--size-3);height:225px;max-height:225px}.search-container{padding:0 var(--size-3)}.hotkeys-container{padding:var(--size-3);overflow:auto}.app-bar{position:fixed;top:0;height:var(--app-bar-height)}.ripple-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:var(--cursor-z-index)}.ripple{position:absolute;width:20px;height:20px;background-color:var(--ripple-color);border-radius:50%;transform:translate(-50%,-50%) scale(0);animation:ripple var(--ripple-duration) ease-out;pointer-events:none}@keyframes ripple{to{transform:translate(-50%,-50%) scale(3);opacity:0}}.gradient-picker{width:100%;height:var(--size-10)}.transparent-box{position:relative;background:linear-gradient(45deg,#ccc 25%,transparent 25%,transparent 75%,#ccc 75%),linear-gradient(45deg,#ccc 25%,transparent 25%,transparent 75%,#ccc 75%);background-size:var(--size-3) var(--size-3);background-position:0 0,8px 8px}.checkbox-wrapper{display:flex;align-items:center;gap:var(--size-2);position:relative}.checkbox-wrapper.invalid{color:var(--text-error-color)}.checkbox-icon-wrapper{position:relative;display:flex;justify-content:center;align-items:center}.checkbox-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:var(--size-4);height:var(--size-4);border:1px solid var(--line-color);border-radius:var(--size-1);background-color:var(--bg-secondary-color);transition:border-color .2s ease,background-color .2s ease,box-shadow .2s ease}.checkbox-input:checked{background-color:var(--primary-color);border-color:var(--primary-color)}.checkbox-icon{position:absolute;display:none;pointer-events:none}.checkbox-icon svg{stroke:var(--text-light-color)}.checkbox-input:checked+.checkbox-icon{display:flex}.checkbox-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px var(--primary-color)}.checkbox-input:disabled{background-color:var(--bg-tertiary-color);border-color:var(--line-secondary-color)}.checkbox-wrapper.invalid .checkbox-input{border-color:var(--error-bg-color)}.checkbox-label{color:var(--text-color);font-size:var(--font-size-2);transition:color .2s ease}.checkbox-wrapper.invalid .checkbox-label{color:var(--text-error-color)}.checkbox-label.disabled{color:var(--text-disabled-color)}.shape-properties-container{padding:var(--size-5) var(--size-2)}.drawer{position:fixed;top:0;right:0;width:var(--drawer-width);height:100%;overflow-y:auto;transform:translate(100%);z-index:var(--drawer-z-index);box-shadow:0 4px 8px var(--bg-secondary-color);background-color:var(--bg-secondary-color);border-left:1px solid var(--line-secondary-color);transition:transform .3s ease}.drawer.open{transform:translate(0)}.layers-container{height:225px;max-height:225px}.canvas-toolbar{position:fixed;margin-top:var(--canvas-start-position);height:var(--canvas-bar-height)}.cursor-tooltip{position:absolute;background-color:#000000bf;color:var(--text-light-color);padding:var(--size-1) var(--size-2);border-radius:var(--size-1);box-shadow:0 2px 8px #0003;white-space:nowrap;transform:translate(10px,10px);pointer-events:none;z-index:var(--cursor-z-index)}.cursor-tooltip-description{color:var(--text-secondary-color);font-size:var(--font-size-1)}.preview-container{width:100%;height:100%;background-color:#fff;position:fixed;top:0;padding-top:var(--total-bars-height);z-index:var(--canvas-preview-z-index);animation:fade-in .3s ease-out forwards}.preview-container img{height:100%;width:100%;max-height:calc(100vh - var(--total-bars-height))}.preview-container>.print-button{position:absolute;margin-top:var(--total-bars-height);top:10px;right:10px}.workspace{position:relative;overflow:auto;height:100vh;width:100vw}.canvas{width:100%;height:100%;margin:140px 20px 20px 70px;background-size:var(--grid-size) var(--grid-size);background-image:linear-gradient(to right,var(--line-color) 1px,transparent 1px),linear-gradient(to bottom,var(--line-color) 1px,transparent 1px)}.draw-layer{position:absolute;top:0;left:0;width:100%;height:100%}.flex{display:flex}.flex-column{display:flex;flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-evenly{justify-content:space-evenly}.align-items-start{align-items:flex-start}.align-items-end{align-items:flex-end}.align-items-center{align-items:center}.align-items-stretch{align-items:stretch}.align-items-baseline{align-items:baseline}.align-content-start{align-content:flex-start}.align-content-end{align-content:flex-end}.align-content-center{align-content:center}.align-content-stretch{align-content:stretch}.align-content-space-between{align-content:space-between}.align-content-space-around{align-content:space-around}.align-content-space-evenly{align-content:space-evenly}.flex-grow-0{flex-grow:0}.flex-grow-1{flex-grow:1}.flex-shrink-0{flex-shrink:0}.flex-shrink-1{flex-shrink:1}.gap-1{gap:var(--size-1)}.gap-2{gap:var(--size-2)}.gap-3{gap:var(--size-3)}html,body{font-family:var(--font-family);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100vw;height:100vh;background-color:var(--bg-color);cursor:var(--cursor)}code{font-family:var(--code-font-family),monospace}:root{--bg-color: #f3f1f1;--line-color: #ccc;--bg-secondary-color: #efefef;--bg-teritary-color: #e4e4e4;--line-secondary-color: #ddd;--bg-overlay-color: rgba(0, 0, 0, .5);--text-color: #333;--text-light-color: #fff;--text-secondary-color: #a5a5a5;--text-disabled-color: #aaa;--text-error-color: #d32f2f;--primary-color: #007bff;--secondary-color: #fff;--select-color: #007bff;--error-bg-color: #ffe8e8;--success-color: #388e3c;--warning-color: #f57c00;--icon-color: #fff;--black-color: #000;--white-color: #fff;--silver-color: #c0c0c0;--reference-color: #9932cc;--ripple-color: rgba(0, 0, 0, .2);--transparent-color: transparent;--primary-dark-color: color-mix(in srgb, var(--primary-color) 80%, black 20%);--secondary-dark-color: color-mix( in srgb, var(--secondary-color) 80%, black 20% );--size-1: 4px;--size-2: 8px;--size-3: 16px;--size-4: 24px;--size-5: 32px;--size-6: 40px;--size-7: 48px;--size-8: 56px;--size-9: 64px;--size-10: 72px;--size-11: 80px;--font-size-1: 12px;--font-size-2: 14px;--drawer-width: 200px;--app-bar-height: 40px;--tabs-bar-height: 27px;--canvas-bar-height: 34px;--canvas-start-position: calc(var(--app-bar-height) + var(--tabs-bar-height));--total-bars-height: calc( var(--app-bar-height) + var(--tabs-bar-height) + var(--canvas-bar-height) + var(--size-3) );--side-bar-width: 50px;--ripple-duration: .2s;--drawer-transition: .3s ease;--grid-size: 20px;--cursor: default;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--code-font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New";--mode-toolbar-z-index: 1;--canvas-preview-z-index: 1;--toolbar-z-index: 2;--drawer-z-index: 2;--menu-z-index: 3;--modal-z-index: 3;--snackbar-z-index: 4;--cursor-z-index: 5}:root.dark{--bg-color: #444;--line-color: #555;--bg-secondary-color: #333;--bg-teritary-color: #2d2d2d;--line-secondary-color: #444;--text-color: #ddd;--text-light-color: #fff;--text-secondar-color: #888;--text-disabled-color: #777;--text-error-color: #ff9e9e;--primary-color: #375a7f;--secondary-color: #444;--select-color: rgb(48, 140, 238);--error-bg-color: #5b1a1a;--success-color: #18501b;--warning-color: #b05902;--icon-color: #ccc;--black-color: #fff;--white-color: #000;--silver-color: #888;--reference-color: #7e5fa0;--ripple-color: rgba(255, 255, 255, .3);--primary-dark-color: color-mix(in srgb, var(--primary-color) 80%, black 20%);--secondary-dark-color: color-mix( in srgb, var(--secondary-color) 90%, black 10% )}@media (prefers-color-scheme: dark){:root:not(.light):not(.dark){--bg-color: #444;--line-color: #555;--bg-secondary-color: #333;--bg-teritary-color: #2d2d2d;--line-secondary-color: #444;--text-color: #ddd;--text-light-color: #fff;--text-secondar-color: #888;--text-disabled-color: #777;--text-error-color: #ff9e9e;--primary-color: #375a7f;--secondary-color: #444;--select-color: rgb(48, 140, 238);--error-bg-color: #5b1a1a;--success-color: #18501b;--warning-color: #b05902;--icon-color: #ccc;--black-color: #fff;--white-color: #000;--silver-color: #888;--reference-color: #7e5fa0;--ripple-color: rgba(255, 255, 255, .3);--primary-dark-color: color-mix( in srgb, var(--primary-color) 80%, black 20% );--secondary-dark-color: color-mix( in srgb, var(--secondary-color) 90%, black 10% )}}
