*{box-sizing:border-box;margin:0;padding:0}body{color:#d4d4d4;-webkit-user-select:none;user-select:none;background:#1e1e1e;width:100vw;height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:12px;line-height:1.3;overflow:hidden}.app-container{flex-direction:column;width:100%;height:100vh;display:flex}.top-bar{background:#252526;border-bottom:1px solid #454545;flex-shrink:0;justify-content:space-between;align-items:center;height:40px;padding:0 10px;display:flex}.file-info{color:#888;white-space:nowrap;text-overflow:ellipsis;max-width:60%;font-family:Consolas,Courier New,monospace;font-size:11px;overflow:hidden}.toolbar-actions{align-items:center;gap:6px;display:flex;position:relative}.icon-btn{color:#d4d4d4;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:3px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;transition:all .15s;display:flex}.icon-btn:hover{color:#fff;background:#3c3c3c;border-color:#454545}.icon-btn:active{transform:translateY(1px)}.icon-btn svg{fill:currentColor;width:16px;height:16px}.dropdown{position:relative}.dropdown-menu{z-index:100;background:#252526;border:1px solid #454545;border-radius:3px;min-width:130px;margin-top:4px;animation:.15s ease-out slideDown;position:absolute;top:100%;right:0;overflow:hidden;box-shadow:0 4px 16px #00000080}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{cursor:pointer;align-items:center;gap:6px;padding:6px 10px;font-size:12px;display:flex}.dropdown-item:hover{color:#fff;background:#3c3c3c}.dropdown-item .format-badge{color:#888;background:#1e1e1e;border-radius:2px;margin-left:auto;padding:1px 4px;font-size:10px}.app-body{flex:1;width:100%;display:flex;overflow:hidden}.sidebar{background:#252526;border-right:1px solid #454545;flex-direction:column;flex-shrink:0;width:260px;display:flex}.canvas-area{background:#2d2d2d;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:auto}.canvas-area:before{content:"";opacity:.1;pointer-events:none;background-image:linear-gradient(#454545 1px,#0000 1px),linear-gradient(90deg,#454545 1px,#0000 1px);background-size:20px 20px;position:absolute;inset:0}canvas{image-rendering:pixelated;cursor:crosshair;background:#000;display:block;box-shadow:0 4px 24px #0006}.status-bar{color:#888;white-space:nowrap;text-overflow:ellipsis;background:#1a1a1a;border-top:1px solid #454545;align-items:center;height:22px;padding:0 10px;font-family:Consolas,Courier New,monospace;font-size:11px;display:flex;overflow:hidden}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#1e1e1e}::-webkit-scrollbar-thumb{background:#4a4a4a;border:2px solid #1e1e1e;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#5a5a5a}