.canvas-container.svelte-7tiwzr{position:relative;background:var(--color-bg-pure);border:1px solid var(--color-border-default);border-radius:var(--radius-md);overflow:hidden}canvas.svelte-7tiwzr{display:block;width:100%;cursor:crosshair}canvas.dragging.svelte-7tiwzr{cursor:grabbing}.clear-crop.svelte-7tiwzr{position:absolute;bottom:var(--space-sm);right:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-sm);color:var(--color-fg-secondary);font-size:var(--text-caption);cursor:pointer;transition:all var(--duration-micro) var(--ease-standard)}.clear-crop.svelte-7tiwzr:hover{background:var(--color-hover);color:var(--color-fg-primary)}.experiment-page.svelte-pvtxit{max-width:var(--width-content);margin:0 auto;padding:var(--space-xl) var(--gutter)}.experiment-header.svelte-pvtxit{margin-bottom:var(--space-2xl);padding-bottom:var(--space-xl);border-bottom:1px solid var(--color-border-default)}.header-meta.svelte-pvtxit{display:flex;align-items:center;gap:var(--space-xs);margin-bottom:var(--space-sm);font-size:var(--text-caption);color:var(--color-fg-muted);text-transform:uppercase;letter-spacing:.05em}.separator.svelte-pvtxit{color:var(--color-fg-subtle)}.experiment-header.svelte-pvtxit h1:where(.svelte-pvtxit){font-size:var(--text-h1);font-weight:var(--font-bold);color:var(--color-fg-primary);margin-bottom:var(--space-sm);line-height:var(--leading-tight)}.subtitle.svelte-pvtxit{font-size:var(--text-body-lg);color:var(--color-fg-secondary);line-height:var(--leading-relaxed)}.ascii-art.svelte-pvtxit{font-family:var(--font-mono);font-size:.65rem;line-height:1.2;color:var(--color-fg-muted);text-align:center;overflow-x:auto;margin:var(--space-xl) 0;padding:var(--space-md);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-md)}.section.svelte-pvtxit{margin-bottom:var(--space-2xl)}.section.svelte-pvtxit h2:where(.svelte-pvtxit){font-size:var(--text-h2);font-weight:var(--font-semibold);color:var(--color-fg-primary);margin-bottom:var(--space-md)}.section.svelte-pvtxit h3:where(.svelte-pvtxit){font-size:var(--text-h3);font-weight:var(--font-semibold);color:var(--color-fg-primary);margin-top:var(--space-lg);margin-bottom:var(--space-sm)}.section.svelte-pvtxit p:where(.svelte-pvtxit){font-size:var(--text-body);color:var(--color-fg-secondary);line-height:var(--leading-relaxed);margin-bottom:var(--space-sm)}.section.svelte-pvtxit ul:where(.svelte-pvtxit){margin:var(--space-sm) 0;padding-left:var(--space-md)}.section.svelte-pvtxit li:where(.svelte-pvtxit){font-size:var(--text-body);color:var(--color-fg-secondary);line-height:var(--leading-relaxed);margin-bottom:var(--space-xs)}.section.svelte-pvtxit em:where(.svelte-pvtxit){font-style:italic}.section.svelte-pvtxit strong:where(.svelte-pvtxit){font-weight:var(--font-semibold);color:var(--color-fg-primary)}.demo-controls.svelte-pvtxit{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-lg)}.upload-area.svelte-pvtxit{display:flex;gap:var(--space-sm)}.upload-button.svelte-pvtxit{display:inline-flex;align-items:center;padding:var(--space-sm) var(--space-md);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-md);color:var(--color-fg-primary);font-size:var(--text-body-sm);cursor:pointer;transition:all var(--duration-micro) var(--ease-standard)}.upload-button.svelte-pvtxit:hover{background:var(--color-hover);border-color:var(--color-border-emphasis)}.upload-button.svelte-pvtxit input:where(.svelte-pvtxit){display:none}.demo-button.svelte-pvtxit{padding:var(--space-sm) var(--space-md);background:transparent;border:1px solid var(--color-border-default);border-radius:var(--radius-md);color:var(--color-fg-secondary);font-size:var(--text-body-sm);cursor:pointer;transition:all var(--duration-micro) var(--ease-standard)}.demo-button.svelte-pvtxit:hover{background:var(--color-hover);border-color:var(--color-border-emphasis);color:var(--color-fg-primary)}.error-message.svelte-pvtxit{padding:var(--space-sm) var(--space-md);background:var(--color-error-muted);border:1px solid var(--color-error-border);border-radius:var(--radius-md);color:var(--color-error);font-size:var(--text-body-sm)}.preview-container.svelte-pvtxit{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg);margin-top:var(--space-md)}.preview-column.svelte-pvtxit{display:flex;flex-direction:column}.preview-column.svelte-pvtxit h3:where(.svelte-pvtxit){font-size:var(--text-body);font-weight:var(--font-semibold);color:var(--color-fg-secondary);margin:0 0 var(--space-sm) 0}.svg-display.svelte-pvtxit{background:#fff;border:1px solid var(--color-border-default);border-radius:var(--radius-md);padding:var(--space-md);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center}.svg-display.svelte-pvtxit svg{max-width:100%;max-height:100%}.preview-caption.svelte-pvtxit{font-size:var(--text-caption);color:var(--color-fg-muted);margin-top:var(--space-xs)}.loading-state.svelte-pvtxit,.empty-state.svelte-pvtxit{background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-md);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;color:var(--color-fg-muted);font-size:var(--text-body-sm)}.crop-info.svelte-pvtxit{margin-top:var(--space-md);padding:var(--space-sm) var(--space-md);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-md);font-size:var(--text-body-sm);color:var(--color-fg-secondary)}.crop-info.svelte-pvtxit code:where(.svelte-pvtxit){font-family:var(--font-mono);color:var(--color-fg-primary)}.pipeline-diagram.svelte-pvtxit{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);margin:var(--space-lg) 0;flex-wrap:wrap}.pipeline-step.svelte-pvtxit{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs)}.step-icon.svelte-pvtxit{width:64px;height:64px;display:flex;align-items:center;justify-content:center;background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-md);font-family:var(--font-mono);font-size:var(--text-body-sm);color:var(--color-fg-primary)}.step-label.svelte-pvtxit{font-size:var(--text-caption);color:var(--color-fg-muted)}.pipeline-arrow.svelte-pvtxit{font-size:var(--text-h3);color:var(--color-fg-muted)}.experiment-footer.svelte-pvtxit{margin-top:var(--space-2xl);padding-top:var(--space-lg);border-top:1px solid var(--color-border-default)}.tags.svelte-pvtxit{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-bottom:var(--space-sm)}.tag.svelte-pvtxit{padding:var(--space-xs) var(--space-sm);font-size:var(--text-caption);color:var(--color-fg-muted);background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-full)}.principles.svelte-pvtxit{font-size:var(--text-caption);color:var(--color-fg-muted);font-family:var(--font-mono)}@media(max-width:768px){.experiment-header.svelte-pvtxit h1:where(.svelte-pvtxit){font-size:var(--text-h2)}.ascii-art.svelte-pvtxit{font-size:.5rem}.preview-container.svelte-pvtxit{grid-template-columns:1fr}.pipeline-diagram.svelte-pvtxit{flex-direction:column}.pipeline-arrow.svelte-pvtxit{transform:rotate(90deg)}}