.homepage-workspace .workspace-body{align-items:stretch;min-height:0}.homepage-workspace .preview-area{grid-template-rows:auto 1fr;align-content:start;gap:14px;padding:20px}.homepage-workspace .upload-strip{border:0;padding:0}.homepage-workspace .homepage-upload{background:var(--primary);width:100%;min-height:44px;color:var(--primary-ink);border-style:solid;flex:1;justify-content:center;padding:8px 14px}.homepage-upload .upload-icon{width:20px;height:20px;color:inherit;background:0 0;border:0}.homepage-upload .upload-copy{align-items:center;gap:14px;display:flex}.homepage-upload .upload-copy span{color:inherit;font-size:11px;font-weight:var(--fw-normal);margin:0}.homepage-upload:focus-within,.homepage-workspace.is-dragging{outline:2px solid var(--focus);outline-offset:3px}.homepage-comparison{gap:6px}.homepage-preview-heading,.homepage-preview-meta{justify-content:space-between;align-items:center;gap:8px;font-size:12px;display:flex}.homepage-preview-heading span,.homepage-preview-meta{color:var(--ink-muted)}.homepage-preview-heading strong{font-weight:var(--fw-semibold)}.homepage-preview-heading strong span{padding:0 6px}.homepage-preview-meta{font-size:11px}.homepage-preview-meta #sourceLabel{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.homepage-preview-meta>span:last-child{flex-shrink:0}.homepage-comparison .compare-media{aspect-ratio:auto;width:min(100%,440px);height:clamp(240px,33vw,380px);margin:0 auto;display:block}.homepage-comparison .compare-image{width:100%;height:100%;position:absolute;inset:0}.homepage-comparison canvas{background:0 0;border:0;border-radius:0;max-width:none;max-height:none}.homepage-comparison canvas:not(.compare-before){grid-area:1/1}.homepage-comparison .compare-media:focus-within{outline:2px solid var(--focus);outline-offset:3px}.homepage-workspace:not([data-preview-ready=true]) .homepage-comparison canvas{visibility:hidden}.homepage-workspace[data-preview-ready=true] .demo-preview{display:none}.homepage-workspace [hidden]{display:none!important}.homepage-updating{z-index:5;background:var(--surface);color:var(--ink);pointer-events:none;box-shadow:0 2px 8px var(--shadow);border-radius:5px;padding:5px 9px;font-size:12px;position:absolute;top:10px;right:10px}.homepage-size-row{background:0 0;border:0;min-height:24px;padding:0;font-size:11px}.homepage-size-row>span{align-items:center;gap:6px;display:flex}.homepage-size-row strong{font-size:inherit;gap:4px}.homepage-size-row .saved-badge{min-height:18px;padding:0 4px;font-size:10px}.homepage-export-actions.panel-actions{background:0 0;border:0;gap:10px;padding:0}.homepage-export-actions .panel-primary-actions{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.homepage-export-actions .panel-primary-actions .button{flex-direction:row;min-height:44px;padding:9px 12px}.homepage-export-actions .panel-primary-actions :is(#downloadButton,#demoDownloadLink){background:var(--primary);color:var(--primary-ink);border-color:var(--primary)}.homepage-export-actions .export-options{order:-1;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;margin:0;display:grid}.homepage-export-actions .export-options legend{font-size:11px;display:contents}.homepage-export-actions .export-format-options{gap:2px;padding:2px}.homepage-export-actions .export-format-option span{min-height:32px;padding:4px 8px;font-size:12px}.homepage-export-actions .export-options p{grid-column:1/-1;min-height:0;margin:0}.homepage-export-actions .homepage-start-over{text-underline-offset:3px;background:0 0;border:0;justify-self:start;width:auto;min-height:28px;padding:2px 0;font-size:12px;text-decoration:underline}.homepage-file-status{min-height:2.8em;color:var(--ink-muted);overflow-wrap:anywhere;margin:0;font-size:11px;line-height:1.4}.homepage-export-area{border-top:1px solid var(--line);background:var(--panel);align-content:start;gap:10px;padding:16px;display:grid}.homepage-workspace .control-panel{grid-template-rows:1fr auto}.homepage-workspace .panel-settings{align-self:start}.homepage-workspace .control-hint{font-size:11px}.homepage-workspace .control-panel .advanced-panel{border-bottom:0}.homepage-workspace .control-panel .presets{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.homepage-workspace .control-panel .preset{max-width:none}.home-page .homepage-workspace .control-panel .preset:last-child:nth-child(odd){grid-column:1/-1}@media (width>=961px){.homepage-workspace .homepage-upload{min-height:52px}.homepage-comparison{align-content:start}.homepage-comparison .compare-media{background:0 0;border:0;border-radius:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;width:100%;height:clamp(280px,28vw,380px);display:grid}.homepage-comparison .compare-image{clip-path:none;border:1px solid var(--line);background:repeating-conic-gradient(var(--checker) 0% 25%, transparent 0% 50%) 0 0 / 16px 16px, var(--surface-2);border-radius:8px;grid-row:1;min-width:0;position:static;inset:auto}.homepage-comparison .compare-before{grid-column:1}.homepage-comparison .compare-media .compare-after{grid-area:1/2}.homepage-comparison :is(.compare-range,.compare-handle){display:none}.homepage-comparison .compare-label-after{left:calc(50% + 20px);right:auto}.homepage-preview-meta>span:last-child{display:none}.homepage-size-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.homepage-size-row>span{border-bottom:1px solid var(--line);justify-content:space-between;padding:8px 10px}.homepage-export-actions .panel-primary-actions .button{padding-inline:8px}}@media (width<=960px){.homepage-workspace .workspace-body{grid-template-columns:1fr}.homepage-workspace .preview-area{grid-template-rows:auto auto;gap:10px;padding:18px 18px 10px}.homepage-workspace .control-panel{display:contents}.homepage-workspace .panel-settings{border-top:1px solid var(--line);background:var(--surface-2);order:3}.homepage-export-area{border:0;order:2;padding:0 18px 18px}}@media (width<=720px){.homepage-workspace .preview-area{gap:8px;padding:12px 12px 8px}.homepage-export-area{gap:8px;padding:0 12px 12px}.homepage-workspace .upload-strip{flex-direction:row}.homepage-workspace .homepage-upload{padding:8px 10px}.homepage-comparison .compare-media{height:clamp(210px,100dvh - 420px,320px)}.homepage-comparison .compare-label{padding:4px 7px;font-size:11px;bottom:8px}.homepage-export-actions.panel-actions{gap:8px}.homepage-export-actions .export-options p{display:none}}@media (width<=360px){.homepage-upload .upload-copy{gap:10px}.homepage-upload .upload-copy span{font-size:10px}.homepage-comparison .compare-media{height:clamp(190px,100dvh - 420px,280px);min-height:190px}.homepage-export-actions .panel-primary-actions .button{padding-inline:8px;font-size:11px}}.tool-noscript{border-bottom:1px solid var(--line);margin:0;padding:12px 16px;font-size:13px}@media (width<=960px){.homepage-workspace[data-mobile-preset-strip=true] .panel-settings{display:contents}.homepage-workspace[data-mobile-preset-strip=true] .panel-settings>.panel-section:first-child{background:var(--panel);border:0;order:1;padding:4px 18px 8px}.homepage-workspace[data-mobile-preset-strip=true] .panel-title{margin-bottom:8px}.homepage-workspace[data-mobile-preset-strip=true] .control-panel .presets{gap:8px;padding:3px 2px 7px;scroll-padding-inline:2px;display:flex;overflow:auto hidden}.homepage-workspace[data-mobile-preset-strip=true] .control-panel .preset{flex:0 0 112px;align-items:center;width:112px;min-height:56px;padding:9px 10px;display:flex}.homepage-workspace[data-mobile-preset-strip=true] .control-panel .preset small,.homepage-workspace[data-mobile-preset-strip=true] .preset-hint{display:none}.homepage-workspace[data-mobile-preset-strip=true] .strength-panel{border:0;order:2;padding:4px 18px 12px}.homepage-workspace[data-mobile-preset-strip=true] .strength-panel .control-hint{display:none}.homepage-workspace[data-mobile-preset-strip=true] .homepage-export-area{order:3}.homepage-workspace[data-mobile-preset-strip=true] .advanced-panel{border-top:1px solid var(--line);background:var(--surface-2);order:4}}@media (width<=720px){.homepage-workspace[data-mobile-preset-strip=true] .panel-settings>:is(.panel-section:first-child,.strength-panel){padding-inline:12px}.homepage-workspace[data-mobile-preset-strip=true] .homepage-comparison .compare-media{height:clamp(160px,100dvh - 580px,260px);min-height:160px}}
