@import "https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700&family=Pixelify+Sans:wght@400;600;700&display=swap";@font-face{font-family:Cabinet Grotesk;src:url(/fonts/CabinetGrotesk-Variable.woff2)format("woff2-variations"),url(/fonts/CabinetGrotesk-Bold.woff2)format("woff2");font-weight:100 900;font-style:normal;font-display:swap}@font-face{font-family:Melodrama;src:url(/fonts/Melodrama-Variable.woff2)format("woff2-variations"),url(/fonts/Melodrama-Bold.woff2)format("woff2");font-weight:100 900;font-style:normal;font-display:swap}:root{--bg-dark:#121212;--bg-panel:#1c1c1c;--bg-active:#2b2b2b;--primary:#e25f38;--primary-light:#f17855;--primary-dark:#b84422;--border-color:#000;--text-main:#dcdcdc;--text-muted:#888;--text-bright:#fff;--font-brand-argila:"Cabinet Grotesk", sans-serif;--font-brand-omatheus:"Melodrama", serif;--font-sans:"Outfit", sans-serif;--font-title:"Pixelify Sans", sans-serif;--font-mono:"Courier New", monospace;background-color:var(--bg-dark);color:var(--text-main);font-family:var(--font-sans);box-sizing:border-box;font-size:15px;line-height:1.5}*,:before,:after{box-sizing:inherit}body{background-color:var(--bg-dark);width:100vw;height:100vh;margin:0;padding:0;overflow:hidden}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{border-left:2px solid var(--border-color);background:#181818}::-webkit-scrollbar-thumb{background:var(--bg-active);border:2px solid var(--border-color)}::-webkit-scrollbar-thumb:hover{background:var(--primary)}.pixel-border{image-rendering:pixelated;border:4px solid #0000;border-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='0' y='0' width='12' height='12' fill='none' stroke='black' stroke-width='2'/><rect x='2' y='2' width='8' height='2' fill='white' opacity='0.15'/><rect x='2' y='2' width='2' height='8' fill='white' opacity='0.15'/><rect x='8' y='2' width='2' height='8' fill='black' opacity='0.35'/><rect x='2' y='8' width='8' height='2' fill='black' opacity='0.35'/></svg>") 4}.retro-button{background-color:var(--bg-panel);color:var(--text-main);font-family:var(--font-sans);cursor:pointer;image-rendering:pixelated;border:4px solid #0000;border-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='0' y='0' width='12' height='12' fill='none' stroke='black' stroke-width='2'/><rect x='2' y='2' width='8' height='2' fill='white' opacity='0.3'/><rect x='2' y='2' width='2' height='8' fill='white' opacity='0.3'/><rect x='8' y='2' width='2' height='8' fill='black' opacity='0.4'/><rect x='2' y='8' width='8' height='2' fill='black' opacity='0.4'/></svg>") 4;justify-content:center;align-items:center;gap:8px;padding:8px 16px;font-weight:700;transition:background-color 50ms;display:inline-flex;position:relative}.retro-button:hover{background-color:var(--bg-active);color:var(--text-bright)}.retro-button:active{border-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='0' y='0' width='12' height='12' fill='none' stroke='black' stroke-width='2'/><rect x='2' y='2' width='8' height='2' fill='black' opacity='0.4'/><rect x='2' y='2' width='2' height='8' fill='black' opacity='0.4'/><rect x='8' y='2' width='2' height='8' fill='white' opacity='0.3'/><rect x='2' y='8' width='8' height='2' fill='white' opacity='0.3'/></svg>") 4}.retro-button.primary{background-color:var(--primary);color:var(--text-bright);border-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='0' y='0' width='12' height='12' fill='none' stroke='black' stroke-width='2'/><rect x='2' y='2' width='8' height='2' fill='white' opacity='0.4'/><rect x='2' y='2' width='2' height='8' fill='white' opacity='0.4'/><rect x='8' y='2' width='2' height='8' fill='black' opacity='0.4'/><rect x='2' y='8' width='8' height='2' fill='black' opacity='0.4'/></svg>") 4}.retro-button.primary:hover{background-color:var(--primary-light)}.retro-button.primary:active{border-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='0' y='0' width='12' height='12' fill='none' stroke='black' stroke-width='2'/><rect x='2' y='2' width='8' height='2' fill='black' opacity='0.4'/><rect x='2' y='2' width='2' height='8' fill='black' opacity='0.4'/><rect x='8' y='2' width='2' height='8' fill='white' opacity='0.3'/><rect x='2' y='8' width='8' height='2' fill='white' opacity='0.3'/></svg>") 4}.retro-button.danger{color:var(--text-bright);background-color:#d93838}.retro-button.danger:hover{background-color:#f55}.retro-input{color:var(--text-bright);font-family:var(--font-sans);image-rendering:pixelated;background-color:#141414;border:4px solid #0000;border-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='0' y='0' width='12' height='12' fill='none' stroke='black' stroke-width='2'/><rect x='2' y='2' width='8' height='2' fill='black' opacity='0.5'/><rect x='2' y='2' width='2' height='8' fill='black' opacity='0.5'/><rect x='8' y='2' width='2' height='8' fill='white' opacity='0.2'/><rect x='2' y='8' width='8' height='2' fill='white' opacity='0.2'/></svg>") 4;outline:none;padding:8px 12px;font-size:15px;transition:border-color .1s}.retro-input:focus{border-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='0' y='0' width='12' height='12' fill='none' stroke='%23e25f38' stroke-width='2'/><rect x='2' y='2' width='8' height='2' fill='black' opacity='0.5'/><rect x='2' y='2' width='2' height='8' fill='black' opacity='0.5'/><rect x='8' y='2' width='2' height='8' fill='white' opacity='0.2'/><rect x='2' y='8' width='8' height='2' fill='white' opacity='0.2'/></svg>") 4}#root{flex-direction:column;height:100vh;display:flex}.pixelate-text{filter:contrast(200%)url(#pixelate)}.dropdown-item{transition:background-color .1s,color .1s}.dropdown-item:hover{background-color:var(--primary)!important;color:#000!important}.dropdown-item:hover span{color:#000!important}.sidebar-resize-handle{cursor:col-resize;z-index:99;background-color:#0000;width:5px;height:100%;transition:background-color .15s,opacity .15s}.sidebar-resize-handle:hover,.sidebar-resize-handle.active{background-color:var(--primary);opacity:1}.vertical-icon-bar{z-index:20;-webkit-user-select:none;user-select:none;background-color:#161616;border-right:2px solid #000;flex-direction:column;align-items:center;gap:8px;width:42px;padding:8px 0;display:flex}.vertical-icon-bar.right-side{border-left:2px solid #000;border-right:none}.vertical-icon-bar-item{width:30px;height:30px;color:var(--text-muted);cursor:pointer;background-color:#0000;border:2px solid #0000;justify-content:center;align-items:center;transition:all .1s;display:flex}.vertical-icon-bar-item:hover{background-color:var(--bg-active);color:var(--text-bright)}.vertical-icon-bar-item.active{background-color:var(--primary);color:var(--text-bright);border:2px solid #000}.flyout-drawer{z-index:90;width:280px;position:absolute;top:100px;box-shadow:8px 8px #0006}.illustrator-tab{letter-spacing:.8px;color:#888;cursor:pointer;text-transform:uppercase;height:27px;font-size:9px;font-weight:700;font-family:var(--font-sans);background-color:#242424;border:1px solid #161616;border-bottom:none;align-items:center;padding:4px 10px;transition:all .1s;display:inline-flex}.illustrator-tab:hover{color:#fff;background-color:#2d2d2d}.illustrator-tab.active{color:#fff;border-top:2px solid var(--primary);background-color:#1c1c1c;border-left:1px solid #161616;border-right:1px solid #161616}.aseprite-tool-button{color:#c4c4c4;cursor:pointer;box-sizing:border-box;background-color:#2b2b2b;border:1px solid #1e1e1e;border-color:#404040 #1e1e1e #1e1e1e #404040;border-radius:1px;justify-content:center;align-items:center;width:24px;height:24px;padding:0;transition:all 50ms;display:inline-flex}.aseprite-tool-button:hover{color:#fff;background-color:#3a3a3a;border:1px solid #303030;border-color:#606060 #303030 #303030 #606060}.aseprite-tool-button.active{background-color:var(--primary);color:#fff;border:1px solid #404040;border-color:#101010 #404040 #404040 #101010;box-shadow:inset 1px 1px 3px #0009}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}
