body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#222;color:#eee;display:flex;flex-direction:column;height:100vh;margin:0}header{background:#333;padding:10px 20px;border-bottom:1px solid #444;display:flex;justify-content:space-between;align-items:center}h1{margin:0;font-size:1.2rem}.main-container{display:flex;flex:1;overflow:hidden}.sidebar{width:250px;background:#2a2a2a;border-right:1px solid #444;overflow-y:auto;display:flex;flex-direction:column}.file-list{list-style:none;padding:0;margin:0}.file-item{padding:10px 15px;cursor:pointer;border-bottom:1px solid #333;display:flex;justify-content:space-between;font-size:.9rem}.file-item:hover{background:#3a3a3a}.file-item.active{background:#005a9e;color:#fff}.file-item .size{font-size:.75rem;color:#aaa}.editor-area{flex:1;padding:20px;display:flex;flex-direction:column;align-items:center;overflow-y:auto}.canvas-container{border:2px solid #555;box-shadow:0 0 20px #00000080;position:relative;background:#000}#editorCanvas{display:block;image-rendering:pixelated;width:960px;height:560px;cursor:crosshair}#importCanvas{display:block;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;width:640px;height:560px;border:1px solid #555}.canvas-wrapper{display:flex;flex-direction:column;align-items:center}.tool-section{background:#2a2a2a;padding:20px;border-radius:8px;margin:20px 0;max-width:800px}.tool-section h3{margin-top:0;color:#fff}#cropOverlay{position:absolute;border:2px dashed #0f0;pointer-events:none}.toolbar{margin-top:15px;display:flex;gap:10px;background:#333;padding:10px;border-radius:5px}button{background:#444;border:1px solid #555;color:#fff;padding:5px 15px;cursor:pointer;border-radius:3px}button:hover{background:#555}button.primary{background:#005a9e;border-color:#004578}button.primary:hover{background:#004578}input[type=file]{display:none}.palette{display:flex;gap:5px;margin-top:10px}.swatch{width:30px;height:30px;border:2px solid #555;cursor:pointer}.swatch.selected{border-color:#fff;transform:scale(1.1)}.status{margin-left:10px;font-size:.8rem;color:#aaa}#helpModal h3{color:#4caf50;border-bottom:2px solid #4CAF50;padding-bottom:5px;margin-top:25px}#helpModal h3:first-of-type{margin-top:0}#helpModal ul{margin-left:20px;line-height:1.8}#helpModal li{margin-bottom:8px}#helpModal strong{color:#fff}#closeHelpBtn:hover{background:#d32f2f!important;transform:scale(1.05);transition:all .2s}