@font-face{font-family:Manrope;src:url(/fonts/manrope-variable.ttf)format("truetype");font-style:normal;font-weight:200 800;font-display:swap}:root{--bg:#f8f7f2;--surface:#fff;--text:#1f2927;--muted:#59665f;--accent:#146b59;--accent-hover:#0b5143;--border:#dde3dc;--soft:#edf3ee;--canvas:#f0f0e9;--error:#8d2725;--error-bg:#fff1ec;--radius:14px;--control-radius:7px;--content-width:1408px;--ease:cubic-bezier(.16,1,.3,1);--motion-fast:.12s;--motion-select:.16s;--motion-feedback:.18s;--motion-reveal:.26s;--motion-loader:.8s;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Manrope,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-color:#b8c5bb var(--bg);scroll-padding-top:24px}body{margin:0;font-size:16px;line-height:1.65}button,input,select,textarea{font:inherit}button{color:inherit}button,select,input[type=range],input[type=checkbox],summary{cursor:pointer}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed}button,a{touch-action:manipulation}button{transition:background-color var(--motion-feedback) var(--ease), border-color var(--motion-feedback) var(--ease), color var(--motion-feedback) var(--ease), transform var(--motion-fast) var(--ease)}a{color:var(--accent);text-underline-offset:4px}a:hover{text-decoration-thickness:2px}::selection{color:var(--surface);background:var(--accent)}input{caret-color:var(--accent)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,h3{text-wrap:balance;line-height:1.2}img{max-width:100%;height:auto}svg,.icon{stroke-linecap:round;stroke-linejoin:round;flex:none;display:block}main,.header-inner,.footer-inner{max-width:var(--content-width);margin:0 auto;padding-left:48px;padding-right:48px}.site-header{border-bottom:1px solid var(--border)}.header-inner{justify-content:space-between;align-items:center;gap:24px;height:76px;display:flex}.brand{min-height:44px;color:var(--text);letter-spacing:-.035em;white-space:nowrap;align-items:center;gap:10px;font-size:18px;font-weight:750;text-decoration:none;display:inline-flex}.brand img{flex:none;width:32px;height:32px}.header-nav{gap:32px;display:flex}.header-nav a{min-height:44px;color:var(--muted);align-items:center;font-size:13px;text-decoration:none;display:flex}.header-nav a:hover{color:var(--accent)}.skip-link{background:var(--surface);z-index:50;padding:12px 18px;position:absolute;top:-100px;left:16px}.skip-link:focus{top:12px}.mobile-menu{display:none}.hero{grid-template-columns:minmax(0,1fr) 350px;align-items:center;gap:64px;padding-top:32px;padding-bottom:26px;display:grid}.hero h1{letter-spacing:-.04em;max-width:790px;font-size:clamp(40px,4.2vw,60px);font-weight:650;line-height:1.08}.hero-lede{color:var(--muted);max-width:70ch;font-size:15px;line-height:1.7}.hero-note{color:var(--accent);margin-top:12px;font-size:12px;font-weight:600}.converter-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);scroll-margin-top:20px;position:relative;overflow:hidden}.workspace-heading{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:14px 24px;display:flex}.workspace-title{align-items:center;gap:10px;display:flex}.workspace-title>.icon{color:var(--accent)}.workspace-title h2{letter-spacing:-.02em;font-size:14px;font-weight:700}.workspace-status{color:var(--muted);align-items:center;gap:6px;margin-left:12px;font-size:11px;display:inline-flex}.workspace-status:before{content:"";background:var(--accent);border-radius:50%;width:5px;height:5px}.workspace-status.is-working:before{background:#a27836}.primary-button,.secondary-button,.small-button{border-radius:var(--control-radius);justify-content:center;align-items:center;gap:9px;min-height:44px;padding:0 20px;font-size:13px;font-weight:650;display:inline-flex}.primary-button{border:1px solid var(--accent);color:var(--surface);background:var(--accent)}.primary-button:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.primary-button:disabled{color:var(--muted);background:#e9eeea;border-color:#e9eeea}.secondary-button{border:1px solid var(--border);background:var(--surface);color:var(--accent)}.secondary-button:hover{border-color:var(--accent);background:var(--soft)}.primary-button>.icon,.secondary-button>.icon{transition:transform var(--motion-fast) var(--ease)}.primary-button:active:not(:disabled),.secondary-button:active:not(:disabled),.small-button:active:not(:disabled),.text-button:active:not(:disabled),.sample-button:active{transition-duration:70ms;transform:translateY(1px)}@media (hover:hover) and (pointer:fine){.upload-button:hover>.icon,.secondary-button:hover>.icon{transform:translateY(-2px)}.download-button:hover:not(:disabled):not(.download-complete)>.icon{transform:translateY(2px)}}.upload-button{min-width:156px}.workspace-grid{grid-template-columns:minmax(0,1fr) 326px;display:grid}.preview-column{background:#fdfdfa;min-width:0;padding:24px}.source-bar{justify-content:space-between;align-items:center;gap:12px;min-height:44px;margin-bottom:16px;display:flex}.source-bar>div{min-width:0}.source-bar strong{white-space:nowrap;text-overflow:ellipsis;max-width:480px;font-size:14px;font-weight:650;display:block;overflow:hidden}.source-bar span{color:var(--muted);margin-top:2px;font-size:11px;display:block}.text-button{border-radius:var(--control-radius);min-width:44px;min-height:44px;color:var(--accent);background:0 0;border:0;justify-content:center;align-items:center;gap:7px;padding:0 10px;font-size:12px;font-weight:650;display:inline-flex}.text-button:hover{background:var(--soft)}.preview-tools{justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}.view-tabs{border-bottom:1px solid var(--border);gap:3px;display:flex}.view-button{min-height:44px;color:var(--muted);background:0 0;border:0;border-bottom:2px solid #0000;margin-bottom:-1px;padding:0 14px;font-size:12px}.view-button:hover{color:var(--accent);background:var(--soft)}.view-button.selected{border-bottom-color:var(--accent);color:var(--accent);font-weight:750}.preview-grid-label{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;align-items:center;gap:6px;font-size:11px;display:flex}.comparison-display{grid-template-columns:1fr 1fr;gap:24px;display:grid;position:relative}.comparison-display figure{min-width:0;margin:0}.comparison-display figcaption{justify-content:space-between;align-items:center;gap:8px;padding-top:10px;font-size:12px;font-weight:650;display:flex}.image-caption-detail{color:var(--muted);font-size:10px;font-weight:400}.image-preview{aspect-ratio:1;border-radius:4px;width:100%;position:relative;overflow:hidden}.checkerboard{background-color:#f2f2ed;background-image:conic-gradient(#e7e9e1 25%,transparent 0 50%,#e7e9e1 0 75%,transparent 0);background-size:16px 16px}.source-preview,.pixel-preview{width:100%;height:100%;display:block;position:absolute;top:0;left:0}.source-preview{pointer-events:none;-webkit-user-select:none;user-select:none}.pixel-preview{image-rendering:pixelated}.pixel-reveal{pointer-events:none;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(4,1fr);display:grid;position:absolute;inset:0}.pixel-reveal>span{background:var(--bg);animation:pixel-uncover calc(var(--motion-reveal) - 90ms) steps(4,end) calc(var(--tile-order) * 6ms) both}@keyframes pixel-uncover{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.pending-preview{opacity:.4}.comparison-arrow{background:var(--surface);width:34px;height:34px;color:var(--accent);z-index:2;border-radius:50%;place-items:center;display:grid;position:absolute;top:calc(50% - 15px);left:50%;transform:translate(-50%,-50%)}.view-original .result-pane,.view-original .comparison-arrow,.view-result .original-pane,.view-result .comparison-arrow{display:none}.view-original,.view-result{grid-template-columns:1fr}.view-original figure,.view-result figure{width:min(100%,350px);margin:0 auto}.crop-active{touch-action:none;cursor:grab}.crop-active:active{cursor:grabbing}.crop-badge,.processing-badge{z-index:3;border-radius:var(--control-radius);background:var(--surface);white-space:nowrap;pointer-events:none;padding:7px 10px;font-size:11px;position:absolute;left:50%;transform:translate(-50%)}.crop-badge{bottom:12px}.processing-badge{color:var(--accent);animation:processing-appear var(--motion-fast) var(--ease) .15s both;align-items:center;gap:8px;display:flex;top:12px;box-shadow:0 4px 12px #1f29271a}@keyframes processing-appear{0%{opacity:0}to{opacity:1}}.preview-working .pixel-preview.has-result{opacity:.55!important}.grid-overlay{pointer-events:none;background-image:linear-gradient(90deg,#1f292738 1px,#0000 1px),linear-gradient(#1f292738 1px,#0000 1px);position:absolute;inset:0}.art-palette{justify-content:space-between;align-items:center;gap:16px;min-height:38px;margin-top:18px;padding:0;display:flex}.art-palette>span{color:var(--muted);font-size:11px}.art-palette>div{flex-wrap:wrap;justify-content:flex-end;gap:2px;max-width:60%;min-height:16px;display:flex}.art-palette>div>span{width:16px;height:16px}.preview-meta{color:var(--muted);justify-content:space-between;align-items:center;gap:12px;min-height:24px;margin-top:4px;font-size:10px;display:flex}.preview-meta>span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}.meta-divider{color:var(--muted);padding:0 8px}.example-picker{border-top:1px solid var(--border);align-items:center;gap:16px;margin-top:20px;padding-top:20px;display:flex}.example-picker-label{color:var(--muted);white-space:nowrap;align-items:center;gap:7px;font-size:11px;display:flex}.sample-choices{flex-wrap:wrap;gap:8px;display:flex}.sample-button{border:1px solid var(--border);border-radius:var(--control-radius);background:0 0;align-items:center;gap:8px;min-height:44px;padding:4px 10px 4px 4px;font-size:11px;display:flex}.sample-button img{object-fit:cover;border-radius:3px;width:32px;height:32px}.sample-button:hover{background:var(--soft);border-color:var(--accent)}.sample-button.selected{background:var(--surface);border-color:var(--accent);color:var(--accent);font-weight:700}.settings-column{border-left:1px solid var(--border);min-width:0;padding:24px}.settings-title{letter-spacing:-.03em;margin-bottom:12px;font-size:16px;font-weight:650}.control-field{margin-bottom:12px}.field-label{margin-bottom:7px;font-size:12px;font-weight:650;display:block}.field-heading,.export-heading{justify-content:space-between;align-items:center;gap:10px;display:flex}.field-value,.export-type{color:var(--muted);font-variant-numeric:tabular-nums;margin-bottom:7px;font-size:10px;line-height:1.65}.field-help{color:var(--muted);margin-top:6px;font-size:11px;font-weight:400;line-height:1.5;display:block}.segmented{border-radius:var(--control-radius);background:#f1f3ef;gap:3px;padding:3px;display:flex}.segmented button{isolation:isolate;min-width:0;min-height:44px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;background:0 0;border:1px solid #0000;border-radius:5px;flex:1;justify-content:center;align-items:center;gap:6px;padding:0 6px;font-size:11px;display:inline-flex;position:relative}.segmented button:before{content:"";z-index:-1;border-radius:inherit;background:var(--surface);opacity:0;transition:opacity var(--motion-select) var(--ease);border:1px solid #d1ddd2;position:absolute;inset:-1px}.segmented button:hover:not(:disabled){color:var(--accent);background:#e4ebe3}.segmented .selected{color:var(--accent);font-weight:750}.segmented .selected:before{opacity:1}.segmented button:disabled{color:#7a837e;opacity:.7}.framing-field{grid-template-columns:64px 1fr;align-items:center;display:grid}.framing-field>.field-label{margin-bottom:0}.framing-field .field-help{display:none}.range-labels{color:var(--muted);justify-content:space-between;margin-top:4px;font-size:10px;display:none}select{border:1px solid var(--border);border-radius:var(--control-radius);background-color:var(--surface);width:100%;min-height:44px;color:var(--text);padding:0 12px;font-size:12px}.color-limit-field{grid-template-columns:74px 1fr;align-items:center;display:grid}.color-limit-field .field-label{margin:0}.switch-row{cursor:pointer;justify-content:space-between;align-items:center;gap:12px;min-height:44px;font-size:12px;display:flex}.switch-row strong{font-weight:650}.switch-row .field-help{margin-top:2px}.switch-row input{appearance:none;background:#dce4da;border:1px solid #b9c7bb;border-radius:14px;flex:none;width:36px;height:22px;margin:0;position:relative}.switch-row input:before{content:"";background:var(--surface);width:14px;height:14px;transition:transform .2s var(--ease);border-radius:50%;position:absolute;top:3px;left:3px}.switch-row input:checked{background:var(--accent);border-color:var(--accent)}.switch-row input:checked:before{transform:translate(14px)}.advanced{margin-top:4px}.advanced summary{min-height:44px;color:var(--muted);justify-content:space-between;align-items:center;font-size:11px;list-style:none;display:flex}.advanced summary::-webkit-details-marker{display:none}.advanced[open] summary>.icon,.faq-list details[open] summary>.icon{transform:rotate(180deg)}.download-section{border-top:1px solid var(--border);margin-top:0;padding-top:12px}.output-dimensions{margin:10px 0 12px;font-size:11px}.output-dimensions div{justify-content:space-between;gap:12px;display:flex}.output-dimensions dt{color:var(--muted)}.output-dimensions dd{font-variant-numeric:tabular-nums;margin:0;font-weight:650}.download-button{width:100%;min-height:48px}.download-complete>.icon{animation:check-arrive var(--motion-feedback) var(--ease) both}@keyframes check-arrive{0%{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}.download-note{color:var(--muted);text-align:center;margin-top:8px;font-size:9px}.workspace-footer{border-top:1px solid var(--border);color:var(--muted);background:#fbfcf8;justify-content:space-between;align-items:center;gap:16px;padding:13px 24px;font-size:10px;display:flex}.workspace-footer>span:first-child{align-items:center;gap:7px;display:flex}.workspace-footer .icon{width:14px;height:14px;color:var(--accent)}.empty-preview{text-align:center;background:var(--canvas);flex-direction:column;justify-content:center;align-items:center;gap:14px;min-height:464px;display:flex}.empty-preview>.icon{color:var(--accent)}.empty-preview h3{letter-spacing:-.03em;max-width:300px;font-size:24px}.empty-preview p{color:var(--muted);font-size:13px}.empty-preview .secondary-button{margin-top:8px}.drop-overlay{z-index:8;color:var(--accent);border:2px dashed var(--accent);pointer-events:none;background:#edf3eef5;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:absolute;inset:0}.drop-overlay strong{letter-spacing:-.03em;font-size:30px}.drop-overlay span{color:var(--muted);font-size:14px}.drop-overlay>.icon{animation:drop-lift var(--motion-feedback) var(--ease) both}.drop-pixels{pointer-events:none;position:absolute;inset:0}.drop-pixels>span{background:var(--accent);width:8px;height:8px;animation:drop-pixel var(--motion-feedback) steps(3,end) both;position:absolute}.drop-pixels>span:first-child{top:12px;left:12px}.drop-pixels>span:nth-child(2){animation-delay:20ms;top:12px;right:12px}.drop-pixels>span:nth-child(3){animation-delay:40ms;bottom:12px;right:12px}.drop-pixels>span:nth-child(4){animation-delay:60ms;bottom:12px;left:12px}@keyframes drop-lift{0%{transform:translateY(4px)}to{transform:translateY(-2px)}}@keyframes drop-pixel{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.crop-controls{padding:0 0 16px;font-size:11px}.crop-controls label{justify-content:space-between;align-items:center;gap:12px;display:flex}.crop-controls output{font-variant-numeric:tabular-nums}.crop-controls input[type=range]{width:100%;height:44px;accent-color:var(--accent);margin:0;display:block}.crop-controls .text-button{padding-left:0}.error-banner{color:var(--error);background:var(--error-bg);border-bottom:1px solid #edcfc2;justify-content:space-between;align-items:center;gap:20px;padding:16px 24px;font-size:12px;display:flex}.error-message{align-items:flex-start;gap:10px;display:flex}.error-message>.icon{margin-top:3px}.error-message p{margin-top:4px}.error-actions{flex-wrap:wrap;flex:none;gap:8px;display:flex}.small-button{color:var(--error);background:var(--surface);border:1px solid #d6b6a9;padding:0 12px;font-size:11px}.small-button:hover{border-color:var(--error)}.content-section{margin-top:90px;scroll-margin-top:32px}.section-heading{max-width:670px;margin-bottom:32px}.section-heading h2{letter-spacing:-.035em;margin-bottom:12px;font-size:34px;font-weight:600}.section-heading p{color:var(--muted);font-size:14px;line-height:1.7}.examples-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;display:grid}.example-card{min-width:0}.example-card h3{margin-bottom:16px;font-size:15px;font-weight:650}.example-images{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;display:grid}.example-images figure{min-width:0;margin:0}.example-images img{aspect-ratio:1;object-fit:contain;background:var(--canvas);border-radius:4px;width:100%;display:block}.example-images figure:last-child img{image-rendering:pixelated}.example-images figcaption{color:var(--muted);margin-top:8px;font-size:10px}.example-card p{color:var(--muted);font-size:11px}.example-card .sample-credit{margin-top:8px;font-size:10px}.example-card .example-purpose{min-height:42px;margin:-6px 0 16px;font-size:12px;line-height:1.7}.example-link{align-items:center;gap:8px;min-height:44px;font-size:13px;font-weight:650;text-decoration:none;display:inline-flex}.example-link:hover{text-decoration:underline}.example-link .icon{width:16px;height:16px}.guide-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;display:grid}.guide-card{border-top:1px solid var(--border);color:var(--text);grid-template-columns:76px minmax(0,1fr);align-items:start;gap:16px;padding:20px 0;text-decoration:none;display:grid}.guide-card img{object-fit:contain;width:76px;height:76px;image-rendering:pixelated;background:var(--canvas);border-radius:4px}.guide-card h3{font-size:16px;font-weight:650;line-height:1.4}.guide-card p{color:var(--muted);margin-top:8px;font-size:12px;line-height:1.7}.guide-card span{color:var(--accent);align-items:center;gap:8px;margin-top:12px;font-size:12px;font-weight:650;display:flex}.guide-card span .icon{width:15px;height:15px}.guide-card:hover h3{color:var(--accent)}.breadcrumb{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:24px;font-size:12px;display:flex}.breadcrumb a{align-items:center;min-height:44px;display:inline-flex}.guide-index .guide-cards,.guide-related .guide-cards{grid-template-columns:1fr;gap:0}.guide-index .guide-card,.guide-related .guide-card{grid-template-columns:96px minmax(0,1fr);padding:24px 0}.guide-index .guide-card img,.guide-related .guide-card img{width:96px;height:96px}.page-content .guide-card p{margin-bottom:0}.guide-index-note{margin-top:32px}.guide-source{margin:28px 0 16px}.guide-source img{border-radius:5px;width:min(100%,512px);margin:0 auto;display:block}.guide-source.transparent-image{max-width:360px;margin:28px auto}.guide-source figcaption,.guide-result figcaption{color:var(--muted);margin-top:12px;font-size:12px;line-height:1.7}.guide-source figcaption{text-align:center}.guide-page .sample-credit{font-size:12px}.guide-results{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:28px 0;display:grid}.guide-results.three{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.guide-result{min-width:0;margin:0}.guide-result img{aspect-ratio:1;object-fit:contain;width:100%;image-rendering:pixelated;background-color:#f7f7f2;background-image:linear-gradient(45deg,#e5e8df 25%,#0000 25%),linear-gradient(-45deg,#e5e8df 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e5e8df 75%),linear-gradient(-45deg,#0000 75%,#e5e8df 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;border-radius:4px;display:block}.guide-color-list{padding:0;list-style:none}.guide-color-list li{align-items:center;gap:12px;display:flex}.guide-color-list li span{border-radius:3px;width:24px;height:24px}.guide-cta{margin:8px 0 20px;text-decoration:none}.guide-related{border-top:1px solid var(--border);margin-top:48px}.custom-palette{background:var(--soft);border-radius:var(--control-radius);flex-direction:column;gap:8px;margin-top:12px;padding:14px 12px;display:flex}.custom-palette .field-label{margin-top:4px;font-size:12px}.custom-palette input:not([type=file]),.custom-palette textarea{border:1px solid var(--border);background:var(--surface);width:100%;min-width:0;color:var(--text);border-radius:5px;min-height:44px;padding:9px 10px;font-size:13px}.custom-palette textarea{resize:vertical;font-family:ui-monospace,monospace;line-height:1.6}.custom-palette .palette-help{color:var(--muted);font-size:11px;line-height:1.6}.custom-swatches{flex-wrap:wrap;gap:4px;display:flex}.custom-swatches span{border:1px solid #1f292726;border-radius:2px;width:20px;height:20px}.palette-add{align-items:center;gap:8px;display:flex}.custom-palette .palette-add input{width:48px;padding:4px}.custom-palette .small-button{border:1px solid var(--border);background:var(--surface);color:var(--accent);padding:0 12px;font-size:12px}.custom-palette .small-button:hover{border-color:var(--accent)}.palette-import,.palette-save{width:100%}.palette-save{margin-top:4px;padding:0 8px;font-size:12px}.palette-delete{align-self:flex-start}.custom-palette .palette-error{color:var(--error);font-size:12px}.custom-palette .palette-notice{color:var(--accent);font-size:12px}.palette-editor summary{min-height:44px;color:var(--accent);align-items:center;font-size:12px;font-weight:650;display:flex}.palette-editor-fields{flex-direction:column;gap:8px;display:flex}.steps-grid{grid-template-columns:repeat(3,1fr);gap:40px;padding:0;list-style:none;display:grid}.step{border-top:1px solid var(--border);padding-top:24px}.step-number{color:var(--accent);margin-bottom:20px;font-size:13px;font-weight:700;display:block}.step h3{letter-spacing:-.02em;margin-bottom:12px;font-size:18px;font-weight:650}.step p{color:var(--muted);font-size:13px;line-height:1.75}#faq{grid-template-columns:1fr 2fr;gap:70px;display:grid}.faq-list{min-width:0}.faq-list details{border-bottom:1px solid var(--border)}.faq-list summary{justify-content:space-between;align-items:center;gap:20px;min-height:64px;padding:18px 0;font-size:13px;font-weight:650;list-style:none;display:flex}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary .icon{width:16px;height:16px;color:var(--accent)}.faq-list details p{color:var(--muted);padding:0 32px 20px 0;font-size:13px;line-height:1.75}.site-footer{border-top:1px solid var(--border);margin-top:96px}.footer-inner{justify-content:space-between;align-items:center;gap:24px;padding-top:32px;padding-bottom:32px;display:flex}.footer-brand p{color:var(--muted);margin-top:6px;font-size:11px}.footer-inner nav{gap:28px;display:flex}.footer-inner nav a{min-height:44px;color:var(--muted);align-items:center;font-size:12px;text-decoration:none;display:flex}.footer-inner nav a:hover{color:var(--accent)}.page-content{max-width:760px;min-height:55vh;padding-top:64px;padding-bottom:24px}.hero-eyebrow{display:none}.page-content h1{letter-spacing:-.035em;margin-bottom:24px;font-size:44px;font-weight:600}.page-content h2{letter-spacing:-.02em;margin:36px 0 14px;font-size:24px;font-weight:650}.page-content p,.page-content li{color:var(--muted);margin-bottom:16px}.page-content .hero-lede{margin-bottom:24px;font-size:19px}.editor-fallback{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-align:center;padding:40px 24px}.editor-fallback button{border-radius:var(--control-radius);background:var(--soft);min-height:44px;color:var(--muted);border:0;margin:20px 0;padding:0 24px}.editor-fallback .trust-note{color:var(--muted);margin-top:12px;font-size:13px}.visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.pixel-loader{flex:none;grid-template-rows:repeat(2,6px);grid-template-columns:repeat(2,6px);gap:2px;width:14px;height:14px;display:grid}.pixel-loader>span{opacity:.3;animation:pixel-step var(--motion-loader) steps(1,end) infinite;background:currentColor}.pixel-loader>span:nth-child(2){animation-delay:.2s}.pixel-loader>span:nth-child(3){animation-delay:.6s}.pixel-loader>span:nth-child(4){animation-delay:.4s}@keyframes pixel-step{0%,24%{opacity:1}25%,to{opacity:.3}}@media (max-width:1199px){main,.header-inner,.footer-inner{padding-left:32px;padding-right:32px}.hero{grid-template-columns:1fr 300px;gap:36px}.hero h1{font-size:48px}.workspace-grid{grid-template-columns:minmax(0,1fr) 300px}.preview-column,.settings-column{padding:20px}.example-picker{flex-direction:column;align-items:flex-start;gap:10px}.image-caption-detail{display:none}.preview-meta{flex-wrap:wrap;gap:0}}@media (min-width:900px){.download-section{grid-template-columns:68px 1fr;align-items:center;column-gap:10px;display:grid}.export-heading{grid-area:1/1}.export-heading .field-label{margin-bottom:0}.export-type{display:none}.download-section>.segmented{grid-area:1/2}.output-dimensions,.download-button,.download-note{grid-column:1/-1}.control-field>.field-help{display:none}.preview-column{grid-template-columns:minmax(0,1fr) auto;align-content:start;display:grid}.source-bar{grid-area:1/1;margin-bottom:20px;padding-right:24px}.source-bar .clear-button{margin-left:auto}.preview-tools{grid-area:1/2;margin-bottom:20px}.preview-grid-label{display:none}.comparison-display{grid-column:1/-1;min-height:380px;padding:10px 0}.comparison-display figure{width:min(100%,350px);margin:0 auto}.comparison-display.view-original,.comparison-display.view-result{grid-template-columns:1fr}.art-palette,.preview-meta,.example-picker{grid-column:1/-1}.art-palette{min-height:28px;margin-top:10px}.example-picker{margin-top:14px;padding-top:16px}}@media (max-width:899px){.header-inner{height:68px}.hero{grid-template-columns:1fr;gap:24px;padding-top:32px;padding-bottom:28px}.hero h1{max-width:680px;font-size:48px}.hero-intro{max-width:550px}.hero-note{margin-top:6px}.workspace-grid{grid-template-columns:1fr}.preview-column{padding:24px}.comparison-display{gap:20px}.settings-column{border-left:0;border-top:1px solid var(--border);grid-template-columns:1fr 1fr;align-items:start;gap:0 28px;padding:24px;display:grid}.settings-title{grid-column:1/-1}.download-section{grid-column:1/-1;grid-template-columns:1fr 1fr;align-items:center;column-gap:28px;display:grid}.export-heading,.download-section>.segmented{grid-column:1}.output-dimensions{grid-area:1/2/3}.download-button{grid-column:1/-1;margin-top:16px}.download-note{grid-column:1/-1}.example-picker{flex-direction:row;align-items:center}.workspace-footer{gap:10px;font-size:9px}.examples-grid{gap:20px}.steps-grid{gap:24px}.content-section{margin-top:64px}#faq{grid-template-columns:1fr;gap:0}#faq .section-heading{margin-bottom:10px}}@media (max-width:599px){main,.header-inner,.footer-inner{padding-left:20px;padding-right:20px}.header-inner{height:64px}.brand{gap:7px;font-size:16px}.brand img{width:28px;height:28px}.header-nav{display:none}.mobile-menu{display:block;position:relative}.mobile-menu summary{width:44px;height:44px;color:var(--accent);border-radius:var(--control-radius);justify-content:center;align-items:center;list-style:none;display:flex}.mobile-menu summary::-webkit-details-marker{display:none}.mobile-menu summary .icon{width:20px;height:20px}.mobile-menu .menu-close-icon,.mobile-menu[open] .menu-open-icon{display:none}.mobile-menu[open] .menu-close-icon{display:block}.mobile-menu nav{z-index:10;background:var(--surface);border:1px solid var(--border);border-radius:var(--control-radius);width:200px;padding:8px;position:absolute;top:48px;right:0;box-shadow:0 8px 24px #1f292718}.mobile-menu nav a{border-radius:4px;align-items:center;min-height:44px;padding:0 12px;font-size:13px;text-decoration:none;display:flex}.mobile-menu nav a:hover{background:var(--soft)}.hero{gap:16px;padding:26px 0 24px}.hero h1{letter-spacing:-.04em;text-wrap:initial;max-width:360px;font-size:39px;line-height:1.1}.hero-lede{font-size:13px;line-height:1.75}.hero-note{font-size:11px;display:block}.converter-card{border-radius:12px}.drop-overlay{text-align:center;justify-content:flex-start;padding:160px 16px 24px}.drop-overlay strong{font-size:24px}.workspace-heading{gap:8px;min-height:66px;padding:10px 14px}.workspace-title{gap:7px}.workspace-title>.icon{width:16px;height:16px}.workspace-title h2{font-size:11px}.workspace-status{display:none}.upload-button{gap:6px;min-width:0;padding:0 11px;font-size:11px}.upload-button .icon{width:15px;height:15px}.preview-column{padding:16px 14px}.source-bar{margin-bottom:8px}.source-bar strong{max-width:calc(100vw - 130px);font-size:12px}.source-bar span{font-size:10px}.preview-tools{gap:6px;margin-bottom:14px}.view-button{padding:0 10px;font-size:11px}.preview-grid-label{gap:4px;font-size:10px}.preview-grid-label .icon{display:none}.comparison-display{display:block}.view-compare .original-pane{z-index:2;background:var(--surface);border-radius:5px;width:86px;padding:3px 3px 0;position:absolute;bottom:40px;left:10px;box-shadow:0 3px 12px #1f292724}.view-compare .original-pane .image-preview{border-radius:3px}.view-compare .original-pane figcaption{padding:4px 2px;font-size:8px}.comparison-arrow,.image-caption-detail{display:none}.comparison-display figcaption{padding-top:8px;font-size:11px}.view-compare .result-pane figcaption{justify-content:flex-end}.view-original figure,.view-result figure{width:100%}.art-palette{gap:10px;min-height:26px;margin-top:8px}.art-palette>span{font-size:9px}.art-palette>div{max-width:55%}.art-palette>div>span{width:9px;height:12px}.preview-meta{margin-top:4px;font-size:8px;line-height:1.7}.preview-meta>span{width:100%}.preview-meta>span:last-child{display:none}.example-picker{flex-direction:column;align-items:flex-start;gap:10px;margin-top:14px;padding-top:14px}.example-picker-label{font-size:10px}.example-picker-label .icon{width:14px;height:14px}.sample-choices{flex-wrap:nowrap;gap:6px;width:100%}.sample-button{flex-direction:column;flex:1;gap:5px;padding:7px 4px;font-size:9px}.sample-button img{width:36px;height:30px}.settings-column{padding:22px 18px;display:block}.settings-title{margin-bottom:20px;font-size:17px}.control-field{margin-bottom:20px}.field-label,select,.switch-row{font-size:13px}.field-help{font-size:11px}.segmented button{min-height:44px;font-size:12px}.field-value,.range-labels{font-size:11px}.framing-field{grid-template-columns:80px 1fr}.color-limit-field{grid-template-columns:90px 1fr}.advanced summary{font-size:12px}.download-section{margin-top:12px;padding-top:20px;display:block}.download-button{min-height:50px;margin-top:0;font-size:14px}.output-dimensions{margin:12px 0 16px;font-size:12px}.download-note{font-size:10px}.workspace-footer{flex-direction:column;align-items:flex-start;gap:6px;padding:14px 18px;font-size:9px}.workspace-footer .icon{width:14px;height:14px}.empty-preview{min-height:390px;padding:20px}.empty-preview h3{font-size:23px}.crop-badge{padding:6px 8px;font-size:9px;bottom:10px}.original-pane .crop-badge{display:none}.processing-badge{font-size:11px}.crop-controls{font-size:12px}.error-banner{flex-direction:column;align-items:flex-start;gap:12px;padding:14px}.error-actions{gap:6px}.error-message{font-size:11px}.content-section{margin-top:52px}.section-heading{margin-bottom:24px}.section-heading h2{font-size:29px}.section-heading p{font-size:13px}.examples-grid,.steps-grid{grid-template-columns:1fr;gap:32px}.guide-cards{grid-template-columns:1fr;gap:4px}.guide-results,.guide-results.three{grid-template-columns:1fr;gap:28px}.guide-result{width:100%;max-width:360px;margin:0 auto}.guide-index .guide-card,.guide-related .guide-card{grid-template-columns:76px minmax(0,1fr);gap:14px}.guide-index .guide-card img,.guide-related .guide-card img{width:76px;height:76px}.example-card h3{margin-bottom:12px;font-size:15px}.example-card p{font-size:12px}.example-card .sample-credit{font-size:10px}.step{padding-top:20px}.step-number{margin-bottom:12px}.step h3{font-size:18px}.faq-list summary{gap:16px;font-size:12px}.faq-list details p{padding-right:0;font-size:12px}.site-footer{margin-top:52px}.footer-inner{flex-direction:column;align-items:flex-start;gap:16px;padding-top:28px;padding-bottom:24px}.footer-inner nav{gap:28px}.footer-brand p{font-size:10px}.page-content{padding-top:36px}.page-content h1{font-size:34px}.page-content h2{font-size:22px}.page-content p{font-size:14px}.page-content .hero-lede{font-size:16px}}@media (max-width:359px){main,.header-inner,.footer-inner{padding-left:14px;padding-right:14px}.hero h1{font-size:34px}.brand{font-size:15px}.workspace-heading{padding:10px}.workspace-title h2{font-size:10px}.workspace-title>.icon{display:none}.upload-button{padding:0 9px;font-size:10px}.preview-column{padding:14px 10px}.preview-grid-label{font-size:9px}.view-button{padding:0 9px;font-size:10px}.settings-column{padding:20px 14px}.color-limit-field{grid-template-columns:74px 1fr}.sample-button{font-size:8px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}button,.primary-button>.icon,.secondary-button>.icon,.segmented button:before,.switch-row input:before{transition:none}.primary-button:active:not(:disabled),.secondary-button:active:not(:disabled),.small-button:active:not(:disabled),.text-button:active:not(:disabled),.sample-button:active,.upload-button:hover>.icon,.secondary-button:hover>.icon,.download-button:hover:not(:disabled):not(.download-complete)>.icon{transform:none}.pixel-reveal{display:none}.pixel-reveal>span,.pixel-loader>span,.processing-badge,.drop-overlay>.icon,.drop-pixels>span,.download-complete>.icon{animation:none}.pixel-loader>span{opacity:.7}}.analytics-banner[hidden]{display:none}.analytics-banner{z-index:50;background:#fff;border:1px solid #c9d9d2;border-radius:16px;align-items:center;gap:24px;max-width:1040px;margin:auto;padding:20px 24px;font-size:14px;display:flex;position:fixed;inset:auto 20px 20px;box-shadow:0 8px 32px #12392d22}.analytics-banner p{margin:6px 0 0;line-height:1.5}.analytics-banner a{color:#146b59;text-decoration:underline}.analytics-banner #analytics-status:empty{display:none}.analytics-actions{flex:none;gap:10px;display:flex}.analytics-actions button{white-space:nowrap}#analytics-settings{font-size:inherit}@media (max-width:680px){.analytics-banner{flex-direction:column;align-items:stretch;gap:12px;padding:16px;font-size:13px;inset:auto 12px 12px}.analytics-actions button{flex:1;justify-content:center}}
