.optimizer-page{max-width:88rem;margin:0 auto;padding:1.5rem 1.5rem 3rem}.optimizer-page-header{margin-block-end:1.5rem}.optimizer-breadcrumb{color:#0071e3;flex-wrap:wrap;align-items:center;gap:.5rem;margin-block-end:.625rem;font-size:.75rem;font-weight:700;display:inline-flex}.optimizer-page-heading{flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;display:flex}.optimizer-page-title{color:#1d1d1f;letter-spacing:-.04em;font-size:clamp(1.875rem,2.8vw,2.5rem);font-weight:800;line-height:1.25}[dir=rtl] .optimizer-page-title{letter-spacing:normal}.optimizer-page-description{color:#626267;max-width:72rem;margin-block-start:.625rem;font-size:.875rem;line-height:1.7}.optimizer-privacy-badge{color:#167049;background:#e7f5ed;border-radius:9999px;align-items:center;gap:.5rem;margin:0;padding:.375rem .75rem;font-size:.75rem;font-weight:600;display:inline-flex}.optimizer-page-grid{grid-template-columns:minmax(0,1fr);align-items:start;gap:0;display:grid}.optimizer-ad-rail{min-width:0}.image-optimizer{color:#1d1d1f;min-width:0;container:image-tool/inline-size}.optimizer-workspace{flex-direction:column;gap:1rem;display:flex}.optimizer-upload{background:#fafcff;border:2px dashed #c9d4e2;border-radius:1.125rem;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.5rem .875rem;min-width:0;padding:1rem 1.125rem;transition:background .15s,border-color .15s;display:grid}.optimizer-upload.is-dragging{background:#eaf4ff;border-color:#0071e3}.optimizer-upload-icon{color:#0071e3;width:2rem;height:2rem}.optimizer-upload-description{min-width:0}.optimizer-upload h2{font-size:1rem;font-weight:750;line-height:1.5}.optimizer-upload p{color:#626267;font-size:.75rem;line-height:1.6}.optimizer-upload .optimizer-local-note{color:#167049;grid-column:2/-1}.optimizer-settings{background:#fff;border:1px solid #e6e6e9;border-radius:1.125rem;flex-direction:column;gap:.75rem;min-width:0;padding:1rem;display:flex}.optimizer-settings h2,.optimizer-results-heading h2,.optimizer-tips h2{font-size:1rem;font-weight:750;line-height:1.5}.optimizer-settings fieldset{border:0;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:.75rem;min-width:0;margin:0;padding:0;display:grid}.optimizer-setting-group{flex-direction:column;gap:.5rem;min-width:0;display:flex}.optimizer-png-options{display:contents}.optimizer-png-guidance{border-top:1px solid #eef0f3;flex-wrap:wrap;grid-column:1/-1;gap:.25rem .5rem;padding-block-start:.5rem;display:flex}.optimizer-setting-group .optimizer-field-note{margin-bottom:0}.optimizer-settings label{font-size:.8125rem;font-weight:650}.optimizer-settings select{color:#1d1d1f;background:#fafafa;border:1px solid #d9d9df;border-radius:.625rem;width:100%;min-width:0;min-height:2.5rem;padding:.5rem;font-size:.8125rem}.optimizer-settings input[type=range]{accent-color:#0071e3;cursor:pointer;width:100%;min-height:2.5rem;margin:0}.optimizer-quality-label{justify-content:space-between;align-items:center;gap:1rem;display:flex}.optimizer-quality-label output{color:#0071e3;font-size:.8125rem;font-weight:700}.optimizer-field-note{color:#73737a;font-size:.75rem;line-height:1.75}.optimizer-button{text-align:center;cursor:pointer;white-space:normal;border:1px solid #0000;border-radius:.875rem;justify-content:center;align-items:center;gap:.5rem;min-width:0;min-height:2.75rem;padding:.75rem 1.125rem;font-size:.8125rem;font-weight:650;line-height:1.5;display:inline-flex}.optimizer-button-primary{color:#fff;background:#0071e3}.optimizer-button-primary:hover{background:#0063c7}.optimizer-button-secondary{color:#393941;background:#fff;border-color:#dedee4}.optimizer-button-secondary:hover{background:#f3f3f6}.optimizer-button:disabled,.optimizer-file-label:has(input:disabled){opacity:.45;cursor:not-allowed}.optimizer-button:focus-visible,.optimizer-settings :is(select,input):focus-visible,.optimizer-remove:focus-visible,.optimizer-file-label:focus-within{outline-offset:3px;outline:2px solid #0071e3}.optimizer-file-label{position:relative;overflow:hidden}.optimizer-file-label input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.optimizer-error{color:#a52121;white-space:pre-line;overflow-wrap:anywhere;background:#fff3f3;border:1px solid #f5c5c5;border-radius:.875rem;margin-top:1rem;padding:1rem;font-size:.8125rem;line-height:1.7}.optimizer-results-section{margin-top:1rem}.optimizer-results-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.optimizer-results-heading h2 span{color:#0071e3;margin-inline-start:.375rem}.optimizer-results-heading [role=status]{color:#73737a;margin-top:.25rem;font-size:.8125rem}.optimizer-actions{flex-wrap:wrap;gap:.5rem;display:flex}.optimizer-empty{color:#86868b;text-align:center;background:#fff;border:1px solid #e5e5ea;border-radius:1rem;padding:1.5rem 1rem;font-size:.875rem}.optimizer-summary{color:#167049;margin-bottom:1rem;font-size:.875rem;font-weight:600}.optimizer-results{flex-direction:column;gap:.625rem;padding:0;list-style:none;display:flex}.optimizer-results:focus-visible{outline-offset:4px;border-radius:1rem;outline:2px solid #0071e3}.optimizer-result{background:#fff;border:1px solid #e5e5ea;border-radius:1rem;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:.875rem;min-width:0;padding:.75rem;display:grid}.optimizer-result-file{align-items:center;gap:.875rem;min-width:0;display:flex}.optimizer-file-icon{color:#0071e3;background:#eef5ff;border-radius:.75rem;flex-shrink:0;place-items:center;width:2.75rem;height:2.75rem;font-size:1.5rem;display:grid}.optimizer-result-file>div{min-width:0}.optimizer-result-file strong{overflow-wrap:anywhere;font-size:.875rem;font-weight:650;display:block}.optimizer-result-status,.optimizer-result-dimensions{color:#73737a;margin-top:.25rem;font-size:.75rem;line-height:1.6;display:block}.optimizer-result[data-status=done] .optimizer-result-status{color:#167049}.optimizer-result[data-status=error] .optimizer-result-status{color:#b32626}.optimizer-result[data-status=processing]{border-color:#95bff0}.optimizer-result-sizes{gap:1.25rem;font-size:.75rem;display:flex}.optimizer-result-sizes dt{color:#86868b}.optimizer-result-sizes dd{white-space:nowrap;margin-top:.25rem;font-weight:650}.optimizer-result-actions{align-items:center;gap:.5rem;display:flex}.optimizer-result-actions .optimizer-button{min-height:2.5rem;padding:.625rem .875rem}.optimizer-remove{color:#73737a;cursor:pointer;border-radius:50%;flex-shrink:0;place-items:center;width:2.5rem;height:2.5rem;font-size:1.375rem;display:grid}.optimizer-remove:hover{background:#f3f3f6}.optimizer-remove:disabled{opacity:.4;cursor:not-allowed}.optimizer-tips{background:#eaeef4;border-radius:1.25rem;margin-top:2rem;padding:1.5rem}.optimizer-tips ol{color:#51515b;gap:.625rem;margin-block:1rem;padding-inline-start:1.25rem;font-size:.875rem;line-height:1.8;list-style:decimal;display:grid}.optimizer-tips p{color:#73737a;margin-top:.5rem;font-size:.75rem;line-height:1.8}.image-optimizer [hidden]{display:none!important}@container image-tool (width<=42rem){.optimizer-settings fieldset{grid-template-columns:repeat(2,minmax(0,1fr))}.optimizer-results-heading>div{min-width:0}.optimizer-results-heading .optimizer-actions{width:100%}}@media (width>=1024px){.optimizer-page-grid{grid-template-columns:minmax(0,1fr) 18rem;column-gap:2.5rem}.optimizer-page-grid .optimizer-ad-rail .content-ad{margin:0}.optimizer-results{scrollbar-gutter:stable;overscroll-behavior-y:contain;max-height:22rem;overflow-y:auto}}@media (width>=1280px){.optimizer-page-grid{grid-template-columns:minmax(0,1fr) 20rem}}@media (width<=767px){.optimizer-page{padding:1.5rem 1rem 3rem}.optimizer-page-heading{align-items:flex-start}.optimizer-upload{grid-template-columns:auto minmax(0,1fr);padding:1.125rem}.optimizer-upload .optimizer-file-label,.optimizer-upload .optimizer-local-note{grid-column:1/-1}.optimizer-settings{padding:1.25rem}.optimizer-settings fieldset{grid-template-columns:minmax(0,1fr)}.optimizer-result{grid-template-columns:minmax(0,1fr);gap:.75rem}.optimizer-result-sizes{padding-inline-start:3.625rem}.optimizer-result-actions{justify-content:flex-end}.optimizer-actions{width:100%}.optimizer-actions .optimizer-button{flex:auto}}
