.blog-image-generator .image-canvas{image-rendering:-webkit-optimize-contrast;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;image-rendering:pixelated}.blog-image-generator .preview-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;display:grid}.blog-image-generator .control-panel input[type=range]{appearance:none;background:hsl(var(--muted));border-radius:3px;outline:none;height:6px;transition:background .2s}.blog-image-generator .control-panel input[type=range]::-webkit-slider-thumb{appearance:none;background:hsl(var(--primary));cursor:pointer;border-radius:50%;width:16px;height:16px;transition:transform .2s,box-shadow .2s}.blog-image-generator .control-panel input[type=range]::-webkit-slider-thumb:hover{box-shadow:0 0 0 4px hsla(var(--primary),.2);transform:scale(1.1)}.blog-image-generator .control-panel input[type=range]::-moz-range-thumb{background:hsl(var(--primary));cursor:pointer;border:none;border-radius:50%;width:16px;height:16px;transition:transform .2s,box-shadow .2s}.blog-image-generator .control-panel input[type=range]::-moz-range-thumb:hover{box-shadow:0 0 0 4px hsla(var(--primary),.2);transform:scale(1.1)}.blog-image-generator .control-panel input[type=color]{appearance:none;border:1px solid hsl(var(--border));cursor:pointer;border-radius:6px;transition:transform .2s,border-color .2s}.blog-image-generator .control-panel input[type=color]:hover{border-color:hsl(var(--primary));transform:scale(1.05)}.blog-image-generator .control-panel input[type=color]::-webkit-color-swatch-wrapper{padding:0}.blog-image-generator .control-panel input[type=color]::-webkit-color-swatch{border:none;border-radius:4px}.blog-image-generator .control-panel input[type=color]::-moz-color-swatch{border:none;border-radius:4px}.canvas-container{aspect-ratio:1200/630;background:hsl(var(--muted));border-radius:8px;width:100%;position:relative;overflow:hidden}.canvas-container canvas{-o-object-fit:contain;object-fit:contain;width:100%;height:100%}.loading-spinner{border:2px solid hsl(var(--muted));border-top-color:hsl(var(--primary));border-radius:50%;width:20px;height:20px;animation:1s ease-in-out infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.preview-card{transition:transform .2s,box-shadow .2s}.preview-card:hover{box-shadow:0 10px 25px hsla(var(--foreground),.15);transform:translateY(-2px)}.status-indicator{align-items:center;gap:.5rem;font-size:.875rem;display:inline-flex}.status-dot{border-radius:50%;width:8px;height:8px;animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}.status-dot.ready{background-color:hsl(var(--success))}.status-dot.generating{background-color:hsl(var(--warning))}.status-dot.error{background-color:hsl(var(--error))}@media (max-width:768px){.blog-image-generator .control-panel{z-index:10;background:hsl(var(--background));border-bottom:1px solid hsl(var(--border));margin:-1rem -1rem 1rem;padding:1rem;position:sticky;top:0}.blog-image-generator .preview-grid{grid-template-columns:1fr}}@media (prefers-contrast:high){.control-panel input[type=range]::-webkit-slider-thumb{border:2px solid hsl(var(--foreground))}.control-panel input[type=range]::-moz-range-thumb{border:2px solid hsl(var(--foreground))}.canvas-container{border:2px solid hsl(var(--border))}}@media (prefers-reduced-motion:reduce){.preview-card{transition:none}.preview-card:hover{transform:none}.loading-spinner{animation-duration:2s}.status-dot{animation:none}}@media print{.blog-image-generator .control-panel,.blog-image-generator .toolbar,.blog-image-generator .status-bar{display:none}.canvas-container{-moz-column-break-inside:avoid;break-inside:avoid;page-break-inside:avoid}}