@charset "UTF-8";
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.compressor-title{padding:34px 0 44px}.breadcrumbs{display:flex;align-items:center;gap:9px;margin-bottom:48px;color:var(--muted);font-size:12px}.breadcrumbs strong{color:var(--ink)}.title-row{display:flex;justify-content:space-between;align-items:flex-end;gap:35px}.title-row h1{margin:0;font-size:clamp(45px,5vw,68px);line-height:1.05;letter-spacing:-.07em}.title-row h1 em{font-style:normal;color:var(--blue)}.title-row>div:first-child>p:last-child{margin:21px 0 0;color:var(--muted);font-size:15px;line-height:1.75}.public-stats{display:flex;align-items:center;gap:12px;padding-bottom:7px;font:600 12px monospace}.public-stats button{min-width:58px;min-height:42px;border:1px solid var(--ink);background:var(--white);padding:0 13px;font:600 12px monospace;white-space:nowrap}.public-stats button.liked{background:var(--coral)}.public-stats .share-button{background:var(--ink);color:#fff;font-weight:800}.share-button b{margin-left:7px}
.compressor-workspace{display:grid;grid-template-columns:1.08fr .92fr;margin-bottom:82px;border:1.5px solid var(--ink);background:var(--white);box-shadow:9px 9px 0 var(--ink)}.upload-panel,.setting-panel{padding:28px}.setting-panel{background:var(--blue);color:#fff;border-left:1.5px solid var(--ink)}.panel-label{display:flex;align-items:center;gap:12px;margin-bottom:23px;font-size:15px}.panel-label>span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:var(--ink);color:#fff;font:800 11px monospace}.panel-label small{margin-left:auto;color:var(--muted);font-size:12px}.panel-label.light>span{background:var(--lime);color:var(--ink)}.panel-label.light small{color:#e4e7ff;font-size:12px;font-weight:700}
.drop-zone{min-height:285px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;border:1.5px dashed var(--ink);background:var(--paper);text-align:center;cursor:pointer;transition:.18s}.drop-zone:hover,.drop-zone:focus,.drop-zone.dragging{background:var(--lime);border-style:solid;outline:0}.drop-icon{display:grid;place-items:center;width:64px;height:64px;margin-bottom:20px;border-radius:50%;background:var(--blue);color:#fff;font-size:36px;font-weight:300;box-shadow:5px 5px 0 var(--ink)}.drop-zone strong{font-size:20px}.drop-zone p{margin:9px 0 20px;color:var(--muted);font-size:14px}.drop-zone small{font-size:12px;color:var(--muted)}.privacy-note{display:flex;gap:10px;margin-top:17px;padding:14px;background:#eef8c8;font-size:12px;line-height:1.6}.privacy-note>span{display:grid;place-items:center;flex:0 0 20px;width:20px;height:20px;border-radius:50%;background:var(--lime);font-weight:900}.privacy-note p{margin:0}.selected-summary{display:flex;align-items:center;justify-content:space-between;margin-top:23px;padding-bottom:12px;border-bottom:1px solid var(--ink)}.selected-summary>div{display:flex;align-items:baseline;gap:10px}.selected-summary strong{font-size:15px}.selected-summary span{color:var(--muted);font:700 12px monospace}.selected-summary button{border:0;border-bottom:1px solid var(--ink);background:none;padding:4px 0;font-size:12px}.selected-list{list-style:none;margin:0;padding:0}.selected-list li{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.selected-list img{width:48px;height:48px;object-fit:cover;border:1px solid var(--ink)}.selected-list strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.selected-list small{display:block;margin-top:5px;color:var(--muted);font-size:11px}.selected-list button{width:36px;height:36px;border:1px solid var(--ink);background:var(--white);font-size:17px}
.format-control{margin:0;padding:0;border:0}.format-control legend,.quality-control label>span,.width-control>span{margin-bottom:10px;font-size:13px;font-weight:800}.format-control>div{display:grid;grid-template-columns:repeat(3,1fr)}.format-control label{position:relative}.format-control input{position:absolute;opacity:0}.format-control label span{min-height:48px;display:flex;align-items:center;justify-content:center;border:1px solid var(--ink);border-right:0;background:var(--white);color:var(--ink);font-size:13px;font-weight:800}.format-control label:last-child span{border-right:1px solid var(--ink)}.format-control input:checked+span{background:var(--lime)}.format-control input:focus-visible+span{outline:3px solid var(--coral);outline-offset:2px}.format-control span b{margin-left:5px;color:var(--blue);font-size:10px}.format-control>p{min-height:38px;margin:9px 0 22px;color:#e4e7ff;font-size:12px;line-height:1.55}.quality-control{padding:20px 0;border-block:1px solid rgba(255,255,255,.45)}.quality-control label{display:flex;justify-content:space-between;align-items:center}.quality-control output{color:var(--lime);font:850 17px monospace}.quality-control input{width:100%;height:28px;accent-color:var(--lime)}.quality-control>div{display:flex;justify-content:space-between;color:#dfe2ff;font-size:11px}.quality-control.disabled{opacity:.45}.width-control{display:flex;flex-direction:column;margin-top:21px}.width-control select{min-height:49px;border:1px solid var(--ink);background:var(--white);padding:0 12px;font-size:14px}.width-control small{margin-top:8px;color:#e4e7ff;font-size:11px;line-height:1.5}.compress-button{width:100%;min-height:58px;margin-top:25px;display:flex;align-items:center;justify-content:space-between;border:1.5px solid var(--ink);background:var(--lime);box-shadow:5px 5px 0 var(--ink);padding:0 17px;font-size:15px;font-weight:850}.compress-button b{font-size:20px}.compress-button:disabled{opacity:.45;cursor:not-allowed}.setting-tip{margin:14px 0 0;text-align:center;color:#e4e7ff;font-size:12px}
.result-section{margin-bottom:90px;padding:46px;background:var(--coral);border:1.5px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}.result-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}.section-label{margin:0 0 12px;color:var(--blue);font:800 11px monospace;letter-spacing:.13em}.result-heading h2,.compressor-guide h2,.format-heading h2,.faq-heading h2,.related-tools h2{margin:0;font-size:clamp(31px,4vw,46px);line-height:1.08;letter-spacing:-.06em}.result-total{min-width:180px;padding:17px;background:var(--white);border:1px solid var(--ink)}.result-total span,.result-total small{display:block;color:var(--muted);font-size:11px}.result-total strong{display:block;margin:8px 0 5px;font:850 25px monospace}.result-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:30px 0 14px}.result-actions p{margin:0;font-size:13px}.result-actions button{min-height:45px;border:1px solid var(--ink);background:var(--ink);color:#fff;padding:0 15px;font-size:12px;font-weight:800}.result-actions b{margin-left:18px}.result-list{border-top:1px solid var(--ink);border-left:1px solid var(--ink)}.result-card{display:grid;grid-template-columns:104px 1fr auto;gap:18px;align-items:center;padding:15px;background:var(--white);border-right:1px solid var(--ink);border-bottom:1px solid var(--ink)}.result-card img{width:104px;height:78px;object-fit:contain;background:#e9e6de;border:1px solid var(--ink)}.result-copy{min-width:0}.result-copy h3{margin:0 0 9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px}.size-comparison{display:flex;align-items:center;gap:9px;font:700 12px monospace}.size-comparison i{font-style:normal;color:var(--blue)}.result-copy p{margin:8px 0 0;color:var(--muted);font-size:11px}.result-copy p.good{color:#278043;font-weight:750}.result-copy p.larger{color:#c13e2e;font-weight:750}.result-download{min-width:108px;min-height:44px;border:1px solid var(--ink);background:var(--lime);font-size:12px;font-weight:850}.result-error{padding:25px;background:#fff1ed;border-right:1px solid var(--ink);border-bottom:1px solid var(--ink);font-size:13px}
.ad-slot{min-height:112px;margin-bottom:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed #aaa69e;color:#77746d;background:#ece9e1}.ad-slot span{font:700 10px monospace;letter-spacing:.15em}.ad-slot p{margin:8px 0 0;font-size:12px}.compressor-guide{display:grid;grid-template-columns:.7fr 1.3fr;gap:80px;margin-bottom:100px}.compressor-guide ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}.compressor-guide li{display:grid;grid-template-columns:52px 1fr;gap:12px;padding:21px 0;border-bottom:1px solid var(--line)}.compressor-guide li>b{color:var(--blue);font:800 12px monospace}.compressor-guide strong{font-size:17px}.compressor-guide li p{margin:8px 0 0;color:var(--muted);font-size:13px;line-height:1.7}.format-guide{padding:90px 0;background:var(--white);border-block:1px solid var(--line)}.format-guide>.tool-wrap{display:grid;grid-template-columns:.65fr 1.35fr;gap:75px}.format-cards{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);border-left:1px solid var(--ink)}.format-cards article{min-height:240px;padding:20px;border-right:1px solid var(--ink);border-bottom:1px solid var(--ink)}.format-cards span{color:var(--blue);font:800 11px monospace}.format-cards h3{margin:58px 0 12px;font-size:17px}.format-cards p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}.faq-section{padding:100px 0;display:grid;grid-template-columns:.65fr 1.35fr;gap:80px}.faq-list{border-top:1px solid var(--ink)}.faq-list details{border-bottom:1px solid var(--ink)}.faq-list summary{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;list-style:none;font-size:15px;font-weight:700}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{font-size:22px}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list details p{margin:-4px 40px 20px 0;color:var(--muted);font-size:13px;line-height:1.75}.related-tools{margin-bottom:100px;padding:47px;background:var(--lime);border:1.5px solid var(--ink);box-shadow:8px 8px 0 var(--blue)}.related-tools>div:first-child{margin-bottom:32px}.related-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink);border-left:1px solid var(--ink)}.related-grid a{min-height:205px;padding:20px;display:flex;flex-direction:column;background:var(--white);border-right:1px solid var(--ink);border-bottom:1px solid var(--ink)}.related-grid a:hover{background:var(--paper)}.related-grid span{color:var(--blue);font:800 10px monospace}.related-grid h3{margin:25px 0 9px;font-size:19px}.related-grid p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.related-grid b{margin-top:auto;padding-top:18px;font-size:12px}.compressor-toast{position:fixed;z-index:60;left:50%;bottom:24px;padding:12px 18px;background:var(--ink);color:#fff;box-shadow:4px 4px 0 var(--coral);font-size:12px;transform:translate(-50%,130px);transition:.22s}.compressor-toast.show{transform:translate(-50%,0)}
@media(max-width:900px){.title-row{align-items:flex-start;flex-direction:column}.public-stats{align-self:flex-end}.compressor-workspace{grid-template-columns:1fr}.setting-panel{border-left:0;border-top:1.5px solid var(--ink)}.result-heading{align-items:flex-start;flex-direction:column}.compressor-guide,.format-guide>.tool-wrap,.faq-section{grid-template-columns:1fr;gap:38px}}
@media(max-width:600px){.compressor-title{padding-top:23px}.breadcrumbs{margin-bottom:38px;font-size:11px}.title-row h1{font-size:clamp(40px,12vw,55px)}.title-row>div:first-child>p:last-child{font-size:14px}.public-stats{width:100%;justify-content:flex-end;flex-wrap:wrap;font-size:11px}.public-stats button{min-height:44px;font-size:11px}.compressor-workspace{width:100%;border-inline:0;box-shadow:none}.upload-panel,.setting-panel{padding:23px 14px}.drop-zone{min-height:250px;padding:20px}.drop-zone strong{font-size:18px}.privacy-note{font-size:11px}.selected-list strong{max-width:180px}.result-section{width:calc(100% - 28px);padding:28px 18px;margin-bottom:75px}.result-total{width:100%}.result-actions{align-items:flex-start;flex-direction:column}.result-actions button{width:100%}.result-card{grid-template-columns:76px 1fr}.result-card img{width:76px;height:62px}.result-download{grid-column:1/-1;width:100%}.compressor-guide{margin-bottom:75px}.compressor-guide li p,.format-cards p{font-size:12px}.format-guide{padding:72px 0}.format-cards{grid-template-columns:1fr}.format-cards article{min-height:180px}.format-cards h3{margin-top:35px}.faq-section{padding:75px 0}.faq-list summary{padding:14px 0;font-size:13px;line-height:1.4}.faq-list details p{font-size:12px}.related-tools{width:calc(100% - 28px);padding:30px 23px;margin-bottom:80px}.related-grid{grid-template-columns:1fr}.related-grid p{font-size:12px}.compressor-toast{width:max-content;max-width:calc(100% - 28px);text-align:center;font-size:11px}}
.preset-control{margin-bottom:22px}.preset-control>strong{display:block;margin-bottom:10px;font-size:13px}.preset-control>div{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.preset-control button{min-height:68px;padding:10px 8px;border:1px solid var(--ink);background:var(--white);color:var(--ink);text-align:left}.preset-control button:hover,.preset-control button.selected{background:var(--coral);box-shadow:3px 3px 0 var(--ink)}.preset-control button span{display:block;font-size:13px;font-weight:850}.preset-control button small{display:block;margin-top:6px;color:var(--muted);font-size:11px;line-height:1.35}
.target-control{margin-bottom:22px}.target-control>strong{display:block;margin-bottom:10px;font-size:13px}.target-control>div{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.target-control button{min-height:66px;padding:10px 8px;border:1px solid var(--ink);background:var(--white);color:var(--ink);text-align:left}.target-control button:hover,.target-control button.selected{background:var(--lime);box-shadow:3px 3px 0 var(--ink)}.target-control button:focus-visible{outline:3px solid var(--coral);outline-offset:2px}.target-control button span{display:block;font-size:13px;font-weight:850}.target-control button small{display:block;margin-top:6px;color:var(--muted);font-size:11px;line-height:1.35}.target-control>p{margin:10px 0 0;color:#e4e7ff;font-size:12px;line-height:1.5}.result-copy p.target-good{color:#16753a;font-weight:850}.result-copy p.target-fail{color:#bd3927;font-weight:850}
.compression-explain{margin-bottom:100px}.explain-heading{display:grid;grid-template-columns:.7fr 1fr;column-gap:80px;align-items:end;margin-bottom:35px}.explain-heading .section-label{grid-column:1}.explain-heading h2{grid-column:1;margin:0;font-size:clamp(31px,4vw,46px);line-height:1.08;letter-spacing:-.06em}.explain-heading>p:last-child{grid-column:2;grid-row:1/3;margin:0;color:var(--muted);font-size:15px;line-height:1.8}.explain-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);border-left:1px solid var(--ink)}.explain-grid article{min-height:265px;padding:22px;border-right:1px solid var(--ink);border-bottom:1px solid var(--ink);background:var(--white)}.explain-grid article:nth-child(2){background:var(--lime)}.explain-grid span{color:var(--blue);font:800 11px monospace}.explain-grid h3{margin:58px 0 13px;font-size:19px;line-height:1.4}.explain-grid p{margin:0;color:var(--muted);font-size:14px;line-height:1.75}.explain-note{display:grid;grid-template-columns:.55fr 1.45fr;gap:40px;margin-top:16px;padding:22px 25px;background:var(--ink);color:#fff}.explain-note strong{font-size:17px}.explain-note p{margin:0;color:#d4d2cc;font-size:14px;line-height:1.7}
.setting-guide{padding:100px 0}.setting-guide-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:34px}.setting-guide-head h2{margin:0;font-size:clamp(31px,4vw,46px);line-height:1.08;letter-spacing:-.06em}.setting-table{border-top:1px solid var(--ink);border-left:1px solid var(--ink)}.setting-row{display:grid;grid-template-columns:1.45fr 1fr .75fr 1fr;min-height:68px}.setting-row>*{display:flex;align-items:center;padding:14px 17px;border-right:1px solid var(--ink);border-bottom:1px solid var(--ink);font-size:14px}.setting-row strong{font-size:15px}.setting-labels{min-height:44px;background:var(--blue);color:#fff}.setting-labels span{font:800 11px monospace;letter-spacing:.05em}.setting-warning{margin:17px 0 0;padding:17px 20px;background:#fff1ed;border-left:5px solid var(--coral);font-size:14px;line-height:1.75}.setting-warning b{color:#c73722}
.format-control>p,.width-control small,.setting-tip,.panel-label small,.drop-zone small{font-size:13px}.quality-control>div{font-size:12px}.privacy-note{font-size:13px}.selected-list small{font-size:12px}.result-copy p,.result-total span,.result-total small{font-size:12px}.faq-list details p,.format-cards p,.compressor-guide li p,.related-grid p{font-size:14px}
.compressor-reading{display:grid;grid-template-columns:.65fr 1.35fr;gap:75px;margin-bottom:100px}.compressor-reading>div:first-child>p:last-child{max-width:360px;color:var(--muted);font-size:14px;line-height:1.75}.compressor-reading h2{margin:0;font-size:clamp(31px,4vw,46px);line-height:1.08;letter-spacing:-.06em}.reading-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);border-left:1px solid var(--ink)}.reading-grid a{min-height:260px;padding:23px;display:flex;flex-direction:column;background:var(--white);border-right:1px solid var(--ink);border-bottom:1px solid var(--ink)}.reading-grid a:hover{background:var(--lime)}.reading-grid span{color:var(--blue);font:800 12px monospace}.reading-grid h3{margin:43px 0 12px;font-size:19px;line-height:1.45}.reading-grid p{margin:0;color:var(--muted);font-size:14px;line-height:1.7}.reading-grid b{margin-top:auto;padding-top:20px;font-size:13px}
@media(max-width:900px){.explain-heading{grid-template-columns:1fr;gap:20px}.explain-heading .section-label,.explain-heading h2,.explain-heading>p:last-child{grid-column:1;grid-row:auto}.explain-grid{grid-template-columns:1fr}.explain-grid article{min-height:210px}.explain-grid h3{margin-top:35px}.setting-guide-head{align-items:flex-start;flex-direction:column;gap:15px}}
@media(max-width:600px){.target-control>div{grid-template-columns:1fr 1fr}.target-control button{min-height:62px}.preset-control>div{grid-template-columns:1fr}.preset-control button{min-height:62px}.compression-explain{width:calc(100% - 28px);margin-bottom:75px}.explain-heading>p:last-child,.explain-grid p,.explain-note p{font-size:13px}.explain-note{grid-template-columns:1fr;gap:10px}.setting-guide{padding:75px 0}.setting-table{overflow-x:auto}.setting-row{min-width:650px}.setting-warning{font-size:13px}.format-control>p,.width-control small,.setting-tip,.panel-label small,.drop-zone small{font-size:12px}.faq-list details p,.format-cards p,.compressor-guide li p,.related-grid p{font-size:13px}.compressor-reading{width:calc(100% - 28px);grid-template-columns:1fr;gap:32px;margin-bottom:75px}.reading-grid{grid-template-columns:1fr}.reading-grid a{min-height:210px}.reading-grid p{font-size:13px}}
.width-control select,.width-control select option{color:var(--ink);background:var(--white)}
.png-warning{margin:-8px 0 20px;padding:17px;background:#fff1ed;color:var(--ink);border:1px solid var(--ink);box-shadow:4px 4px 0 var(--coral)}.png-warning[hidden]{display:none}.png-warning strong{display:block;color:#bd3927;font-size:15px}.png-warning p{margin:7px 0 13px;font-size:13px;line-height:1.65}.png-warning button{min-height:40px;border:1px solid var(--ink);background:var(--lime);padding:0 12px;font-size:12px;font-weight:850}.result-total.negative{background:#fff1ed}.result-total.negative strong,.result-total.negative small{color:#bd3927}
@media(max-width:600px){.png-warning p{font-size:12px}.png-warning button{width:100%;min-height:44px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important}}