#tool{padding-top:16px!important;padding-bottom:40px!important}@media(min-width:768px){#tool{padding-top:24px!important;padding-bottom:60px!important}}.tool-container.svelte-1fx1ofc{max-width:900px;margin:0 auto;text-align:center}.header.svelte-1fx1ofc{text-align:center;margin-bottom:1.5rem;padding-top:0}h1.svelte-1fx1ofc{font-size:2.5rem;font-weight:800;margin-bottom:12px;line-height:1.2;letter-spacing:-.02em;color:var(--text-main)}.subtitle.svelte-1fx1ofc{font-size:1.125rem;color:var(--text-muted);line-height:1.6;max-width:650px;margin:0 auto}.interface.svelte-1fx1ofc{text-align:left;overflow:hidden}.workspace.svelte-1fx1ofc{min-height:360px;display:flex;align-items:center;justify-content:center}.step-content.svelte-1fx1ofc{width:100%;animation:svelte-1fx1ofc-fadeIn .4s ease-in-out}@keyframes svelte-1fx1ofc-fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in.svelte-1fx1ofc{animation:svelte-1fx1ofc-fadeIn .4s ease-in-out}.section-label.svelte-1fx1ofc{display:block;margin-bottom:12px;font-weight:600;font-size:.85rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.drop-zone.svelte-1fx1ofc{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:40px;border:2px dashed var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all .3s;background:var(--bg-main)}.drop-zone.svelte-1fx1ofc:hover{border-color:var(--primary);background:var(--surface-1)}.drop-zone.dragging.svelte-1fx1ofc{border-color:var(--primary);background:var(--primary-glow);border-style:solid}.drop-zone-icon.svelte-1fx1ofc{color:var(--text-muted);transition:color .3s}.drop-zone.svelte-1fx1ofc:hover .drop-zone-icon:where(.svelte-1fx1ofc),.drop-zone.dragging.svelte-1fx1ofc .drop-zone-icon:where(.svelte-1fx1ofc){color:var(--primary)}.drop-zone-text.svelte-1fx1ofc{font-size:1.1rem;font-weight:600;color:var(--text-main)}.drop-zone-hint.svelte-1fx1ofc{font-size:.9rem;color:var(--text-muted)}.split-layout.svelte-1fx1ofc{display:flex;gap:32px;align-items:flex-start;justify-content:center}.preview-panel.svelte-1fx1ofc{flex:1;min-width:0;max-width:400px}.preview-wrapper.svelte-1fx1ofc{border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--border);background:var(--surface-1);aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center}.preview-wrapper.checkerboard.svelte-1fx1ofc{background-image:linear-gradient(45deg,#e0e0e0 25%,transparent 25%),linear-gradient(-45deg,#e0e0e0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e0e0e0 75%),linear-gradient(-45deg,transparent 75%,#e0e0e0 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0px}.dark .preview-wrapper.checkerboard.svelte-1fx1ofc{background-image:linear-gradient(45deg,#2a2a2a 25%,transparent 25%),linear-gradient(-45deg,#2a2a2a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#2a2a2a 75%),linear-gradient(-45deg,transparent 75%,#2a2a2a 75%)}.preview-wrapper.svelte-1fx1ofc img:where(.svelte-1fx1ofc){max-width:100%;max-height:100%;display:block;object-fit:contain}.preview-wrapper.svelte-1fx1ofc img.fill:where(.svelte-1fx1ofc){width:100%;height:100%;object-fit:cover}.config-panel.svelte-1fx1ofc{flex:0 0 280px;display:flex;flex-direction:column;gap:20px}.dimension-info.svelte-1fx1ofc{text-align:center}.info-card.svelte-1fx1ofc{padding:16px;background:var(--surface-1);border-radius:var(--radius-sm);border:1px solid var(--border);text-align:center}.info-text.svelte-1fx1ofc{font-size:.9rem;color:var(--text-main);margin-bottom:8px}.success-text.svelte-1fx1ofc{color:#10b981;font-size:.85rem;font-weight:600}.warning-text.svelte-1fx1ofc{color:#f59e0b;font-size:.85rem;font-weight:600}.dimension-hint.svelte-1fx1ofc{font-size:.85rem;color:var(--text-muted);text-align:center;padding:8px 12px;background:var(--surface-1);border-radius:var(--radius-sm);border:1px solid var(--border);display:flex;flex-direction:column;gap:4px}.btn.svelte-1fx1ofc{min-width:120px;padding:12px 24px;font-size:1rem;font-weight:600;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;border:none}.btn-full.svelte-1fx1ofc{width:100%}.btn-sm.svelte-1fx1ofc{min-width:auto;padding:8px 16px;font-size:.9rem}.btn-primary.svelte-1fx1ofc{background:var(--primary);color:#fff}.btn-primary.svelte-1fx1ofc:hover:not(:disabled){background:var(--primary-hover, var(--primary));transform:translateY(-2px)}.btn-primary.svelte-1fx1ofc:disabled{opacity:.7;cursor:not-allowed}.btn-secondary.svelte-1fx1ofc{background:var(--surface-1);color:var(--text-main);border:1px solid var(--border)}.btn-secondary.svelte-1fx1ofc:hover{background:var(--surface-2, var(--surface-1));transform:translateY(-2px)}.btn-text.svelte-1fx1ofc{background:none;border:none;color:var(--primary);font-size:.9rem;font-weight:600;cursor:pointer;padding:4px 8px;transition:all .2s;text-align:center}.btn-text.svelte-1fx1ofc:hover{text-decoration:underline}.processing-section.svelte-1fx1ofc{text-align:center;padding:40px 20px}.processing-icon.svelte-1fx1ofc{margin:0 auto 24px;width:80px;height:80px;display:flex;align-items:center;justify-content:center}.spinner.svelte-1fx1ofc{width:60px;height:60px;border:4px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:svelte-1fx1ofc-spin 1s linear infinite}@keyframes svelte-1fx1ofc-spin{to{transform:rotate(360deg)}}.processing-section.svelte-1fx1ofc h3:where(.svelte-1fx1ofc){font-size:1.5rem;font-weight:700;margin-bottom:8px;color:var(--text-main)}.processing-text.svelte-1fx1ofc{font-size:1rem;color:var(--text-muted);margin-bottom:24px}.progress-bar.svelte-1fx1ofc{width:100%;max-width:400px;height:8px;background:var(--surface-1);border-radius:9999px;overflow:hidden;margin:0 auto 12px;border:1px solid var(--border)}.progress-fill.svelte-1fx1ofc{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-hover, var(--primary)));border-radius:9999px;transition:width .3s ease}.progress-text.svelte-1fx1ofc{font-size:.9rem;font-weight:600;color:var(--text-muted)}.results-section.svelte-1fx1ofc{width:100%}.results-header.svelte-1fx1ofc{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px}.header-actions.svelte-1fx1ofc{display:flex;gap:8px}.preview-selector.svelte-1fx1ofc{margin-bottom:24px;text-align:center}.preview-options.svelte-1fx1ofc{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.preview-option.svelte-1fx1ofc{flex:1;min-width:100px;padding:10px 16px;border:2px solid var(--border);background:var(--bg-main);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;font-size:.9rem;font-weight:600}.preview-option.svelte-1fx1ofc:hover{border-color:var(--primary);transform:translateY(-2px)}.preview-option.active.svelte-1fx1ofc{border-color:var(--primary);background:var(--primary-glow);color:var(--primary)}.preview-container.svelte-1fx1ofc{display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px;background:var(--bg-secondary);border-radius:var(--radius-sm);border:1px solid var(--border)}.preview-frame-tv.svelte-1fx1ofc{width:100%;max-width:700px;border:2px solid var(--primary);border-radius:var(--radius-sm);overflow:hidden;box-shadow:0 4px 12px #0000001a;background:#fff}.preview-full.svelte-1fx1ofc{width:100%;height:auto;display:block}.preview-frame-device.svelte-1fx1ofc{position:relative;border:2px solid var(--primary);border-radius:var(--radius-sm);overflow:hidden;box-shadow:0 4px 12px #0000001a;background:#fff}.preview-device-img.svelte-1fx1ofc{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:auto;height:350%;max-width:none}.preview-info.svelte-1fx1ofc{font-size:.9rem;color:var(--text-muted);font-style:italic}@media(max-width:768px){.header.svelte-1fx1ofc{margin-bottom:1.75rem}h1.svelte-1fx1ofc{font-size:1.875rem}.subtitle.svelte-1fx1ofc{font-size:1rem}.workspace.svelte-1fx1ofc{min-height:320px}.split-layout.svelte-1fx1ofc{flex-direction:column;gap:24px}.config-panel.svelte-1fx1ofc{flex:none;width:100%}.drop-zone.svelte-1fx1ofc{padding:32px 24px}.preview-options.svelte-1fx1ofc{gap:6px}.preview-option.svelte-1fx1ofc{min-width:auto;flex:1;padding:8px 12px;font-size:.85rem}}@media(max-width:640px){.btn.svelte-1fx1ofc{width:100%}.preview-frame-tv.svelte-1fx1ofc,.preview-frame-device.svelte-1fx1ofc{max-width:100%}}
