:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body:has(#root){margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}@font-face{font-family:Legend;src:url(@/assets/fonts/Legend\ Bold.otf) format("otf");font-weight:400;font-style:normal}@font-face{font-family:"The Legend Serif";src:url(https://cdn.nitroapps.co/fontify/dreamstitchmfg.myshopify.com/the-legend-serif-uppercase-only-woff2.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}svg{width:100%;height:100%;display:block}#root{max-width:1280px;text-align:center}*{box-sizing:border-box}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.editor-container{display:flex;height:100vh;gap:16px;padding:16px;box-sizing:border-box;border-radius:.5rem 0 0 .5rem}.sidebar-icon{width:100%;height:80px;background-color:#fff;border-top:1px solid black}.sidebar{display:flex;flex-direction:column;height:100%;align-items:stretch;background:#222020;width:6rem}.canvas-container{flex:1;display:flex;align-items:center}.sidebar-right{width:180px;border-left:1px solid #ccc;padding:16px;box-sizing:border-box}.main-content{flex:1;background-color:#fff;height:100%}.title{text-align:center;font-size:20px;font-weight:700}.body-area{border:2px dashed #ccc;border-radius:8px;height:100%}.custom-input{width:100%;max-width:600px;padding:16px 20px;font-size:20px;border:.5px solid #ccc;border-radius:8px;outline:none;text-align:center;box-sizing:border-box;background-color:#fff;color:#000!important}.custom-input::placeholder{color:#bbb}.font-grid{display:flex;flex-wrap:wrap;gap:16px;max-width:600px;margin:0 auto}.font-item{flex:1 1 calc(33.333% - 16px);text-align:center;padding:16px;border:2px solid #ccc;border-radius:8px;cursor:pointer;transition:.2s ease;box-sizing:border-box;color:#000;font-size:12px}.font-item:hover{background-color:#f0f0f0}.font-item.selected{border-color:#007bff;background-color:#e6f0ff}.slider-wrapper{width:100%;max-width:500px;margin:20px auto;font-family:sans-serif}label{display:block;margin-bottom:8px;font-weight:500}input[type=range]{width:100%;margin-bottom:16px;accent-color:rgb(0,140,149)}.preview-text{border:1px solid #ccc;padding:16px;border-radius:6px;font-size:24px;text-align:center;background-color:#fafafa}.navbar{display:flex;justify-content:center;align-items:center;gap:40px;padding:20px 0;background-color:#fff}.nav-item{font-family:Georgia,serif;font-size:20px;font-weight:600;color:#333;cursor:pointer;position:relative;transition:color .2s ease}.nav-item.active{font-weight:800;color:#000}.nav-item.active:after{content:"";position:absolute;left:0;bottom:1px;width:100%;height:1px;background-color:#222}.nav-item:hover{color:#111}.color-picker-container{display:flex;flex-wrap:wrap;gap:10px;max-width:400px;margin:0 auto}.color-swatch{width:20px;height:20px;border:2px solid transparent;border-radius:4px;cursor:pointer;transition:transform .15s,border-color .15s}.color-swatch:hover{transform:scale(1.1)}.color-swatch.selected{border-color:#333}.size-grid-container{display:flex;flex-wrap:wrap;gap:10px;max-width:400px;margin:20px auto}.size-box{padding:10px 16px;border:2px solid #ccc;border-radius:6px;font-family:sans-serif;font-size:16px;text-align:center;background-color:#fff;color:#000}