/* Arte de Pixel v1.0.0 */
#pa-wrap{font-family:'Segoe UI',Arial,sans-serif;background:#1a1a2e;color:#e0e0ff;box-sizing:border-box;user-select:none}

/* SETUP */
#pa-setup{min-height:80vh;display:flex;flex-direction:column;align-items:center;justify-content:center}
.pa-title{font-size:2rem;font-weight:800;color:#a78bfa;text-align:center;padding:0 0 24px;letter-spacing:.06em;text-shadow:0 0 20px rgba(167,139,250,.4)}
.pa-setup-box{max-width:400px;width:100%;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:20px;padding:20px}
.pa-dim-row{display:flex;align-items:center;gap:20px}
.pa-dim-group{display:flex;flex-direction:column;align-items:center;gap:6px}
.pa-dim-label{font-size:.78rem;color:#a78bfa;text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.pa-dim-input{width:80px;padding:8px 10px;background:#16213e;border:2px solid #4c1d95;border-radius:8px;color:#e0e0ff;font-size:1.2rem;text-align:center;outline:none}
.pa-dim-input:focus{border-color:#a78bfa}
.pa-dim-x{font-size:1.4rem;font-weight:700;color:#7c3aed}
.pa-saved-info{display:flex;flex-direction:column;align-items:center;gap:10px;background:#16213e;border:1px solid #4c1d95;border-radius:10px;padding:14px 20px;width:100%;box-sizing:border-box}
.pa-saved-text{font-size:.88rem;color:#a78bfa}

/* BUTTONS */
.pa-btn{border:none;border-radius:10px;padding:10px 20px;font-size:.95rem;font-weight:700;cursor:pointer;transition:filter .15s,transform .1s}
.pa-btn:hover{filter:brightness(1.2);transform:translateY(-1px)}
.pa-btn:active{transform:translateY(0)}
.pa-btn-primary{background:linear-gradient(135deg,#a78bfa,#7c3aed);color:#fff;padding:12px 28px;font-size:1rem}
.pa-btn-secondary{background:#16213e;border:1px solid #4c1d95;color:#a78bfa}
.pa-tool-btn{padding:6px 12px;font-size:.88rem;border-radius:8px;background:#16213e;border:1px solid #4c1d95;color:#e0e0ff}
.pa-tool-btn.pa-active{background:#4c1d95;border-color:#a78bfa;color:#fff}
.pa-btn-danger{background:#7f1d1d;color:#fca5a5;border:none}
.pa-btn-back{color:#9ca3af;border-color:#374151}

/* TOOLBAR */
.pa-toolbar{display:flex;align-items:center;gap:6px;padding:6px 10px;background:#0f0f23;border-bottom:2px solid #2d1b69;flex-wrap:wrap}
.pa-palette{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.pa-swatch{width:26px;height:26px;border-radius:5px;border:2px solid transparent;cursor:pointer;transition:transform .1s;padding:0;flex-shrink:0}
.pa-swatch:hover{transform:scale(1.2);z-index:1}
.pa-swatch.pa-swatch-active{border-color:#fff;transform:scale(1.18);box-shadow:0 0 8px rgba(255,255,255,.7)}
.pa-picker{width:36px;height:30px;border:2px solid #4c1d95;border-radius:6px;padding:1px;cursor:pointer;background:none;flex-shrink:0}
.pa-picker:focus{border-color:#a78bfa;outline:none}
.pa-tool-sep{width:1px;height:28px;background:#2d1b69;margin:0 2px;flex-shrink:0}

/* CANVAS */
.pa-canvas-wrap{display:flex;align-items:center;justify-content:center;background:#0a0a1a;overflow:hidden}
#pa-canvas{display:block;cursor:crosshair;image-rendering:pixelated;image-rendering:crisp-edges}