.compressor-page{gap:1.5rem;display:grid}.compressor-shell,body>main .section{background:radial-gradient(circle at top left, #007bf029, transparent 26%), linear-gradient(180deg, #ffffff05, #fff0), var(--background-two);border:1px solid #8fd3ff29;border-radius:24px;box-shadow:0 18px 40px #00000038}.compressor-eyebrow{color:#9fd4ff;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.4rem;font-size:.82rem;font-weight:700}.compressor-shell__header h2,.comparison-head h3{font-family:var(--heading-font);line-height:1.15}.compressor-shell{padding:1.5rem}.compressor-shell__header,.comparison-head,.preview-card__head,.control-block__head,.field-row{justify-content:space-between;align-items:start;gap:1rem;display:flex}.compressor-shell__header{margin-bottom:1.25rem}.compressor-shell__note,.comparison-head__hint,.control-block__head p,.stat-card__meta,.preview-card__head p,.upload-area__subtitle,.result-banner{color:#f2f2f2b8}.compressor-grid{grid-template-columns:minmax(320px,.96fr) minmax(0,1.24fr);align-items:start;gap:1.25rem;display:grid}.compressor-panel{background:linear-gradient(180deg, #ffffff08, #ffffff03), var(--background-three);border:1px solid #ffffff0f;border-radius:22px;min-width:0;padding:1.1rem}.compressor-panel--controls{position:sticky;top:1rem}.upload-area{width:100%;color:var(--text-color);cursor:pointer;background:radial-gradient(circle at top,#007bf02e,#0000 58%),#111c298c;border:1px dashed #8fd3ff7a;border-radius:20px;margin-bottom:1.15rem;padding:1.3rem 1rem;transition:transform .2s,border-color .2s,background-color .2s,box-shadow .2s}.upload-area:hover,.upload-area.is-dragover{border-color:#b8e4ffdb;transform:translateY(-1px);box-shadow:0 14px 28px #00000038}.upload-area__icon{color:#b8e4ff;background:#007bf038;border-radius:50%;place-items:center;width:3rem;height:3rem;margin:0 auto .85rem;font-size:1.15rem;display:inline-grid}.upload-area__title,.upload-area__subtitle{text-align:center;display:block}.upload-area__title{font-size:1.05rem;font-weight:700}#fileInput{display:none}.control-block+.control-block{margin-top:1rem}.control-block{background:#ffffff06;border:1px solid #ffffff0d;border-radius:18px;padding:1rem}.control-block__head h3,.preview-card__head h4{font-size:1rem}.preset-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;margin-top:.85rem;display:grid}.preset-chip{width:100%;min-height:3rem;color:var(--text-color);text-align:center;cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:999px;padding:.75rem .85rem;transition:border-color .2s,transform .2s,background-color .2s,box-shadow .2s}.preset-chip:hover,.preset-chip:focus-visible{border-color:#8fd3ff85;transform:translateY(-1px);box-shadow:0 10px 22px #0003}.preset-chip.is-active{background:linear-gradient(#007bf038,#007bf014),#ffffff0a;border-color:#8fd3ffe0}.preset-chip__title,.field-label{font-weight:700;display:block}.field-group+.field-group{margin-top:1rem}.field-select,.value-input{min-height:2.8rem;color:var(--text-color);background:#161616bf;border:1px solid #8fd3ff2e;border-radius:14px}.field-select{width:100%;margin-top:.5rem;padding:.8rem .9rem}.field-row{margin-bottom:.55rem}.value-input{text-align:center;width:6.2rem;padding:.45rem .75rem;font-size:.95rem}.value-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.value-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.value-input{appearance:textfield}.slider-wrapper{align-items:center;height:1.5rem;display:flex;position:relative}.slider{appearance:none;z-index:2;background:#ffffff1f;border-radius:999px;width:100%;height:.35rem;margin:0;position:relative}.slider::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#0d7ef0;border:2px solid #ffffffc7;border-radius:50%;width:1.1rem;height:1.1rem;box-shadow:0 0 0 4px #0d7ef029}.slider::-moz-range-thumb{cursor:pointer;background:#0d7ef0;border:2px solid #ffffffc7;border-radius:50%;width:1.1rem;height:1.1rem;box-shadow:0 0 0 4px #0d7ef029}.slider-fill{pointer-events:none;z-index:1;background:linear-gradient(90deg,#1c93ff,#7bd0ff);border-radius:999px;height:.35rem;position:absolute;left:0}.action-row{grid-template-columns:1fr 1fr;gap:.8rem;margin-top:1rem;display:grid}.action-row .button-simple{width:100%;margin-top:0}.action-row__secondary{background-color:#ffffff0f;background-image:none;border-color:#ffffff24}.action-row__secondary:hover{background-color:#ffffff1f;border-color:#ffffff38}.result-banner{background:#ffffff09;border:1px solid #ffffff0f;border-radius:16px;margin-top:1rem;padding:.95rem 1rem}.result-banner.is-success{color:#d8f7df;background:#2f7d462e;border-color:#68d08b57}.result-banner.is-warning{color:#ffe5b8;background:#7c550d38;border-color:#ffc45852}.result-banner.is-error{color:#ffd1d1;background:#7a1f1f33;border-color:#ff6e6e5c}.stats-grid,.preview-grid{gap:.9rem;display:grid}.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:1.2rem}.stat-card,.preview-card{background:#ffffff08;border:1px solid #ffffff0f;border-radius:18px}.stat-card{padding:1rem}.stat-card--accent{background:linear-gradient(#007bf02e,#007bf00d),#ffffff08;border-color:#8fd3ff47}.stat-card__label{color:#f2f2f2b3;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.35rem;font-size:.86rem;display:block}.stat-card__value{font-size:clamp(1.2rem,3.4vw,1.8rem);line-height:1.1;display:block}.comparison-head{margin-bottom:.9rem}.preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.preview-card{overflow:hidden}.preview-card__head{border-bottom:1px solid #ffffff0f;padding:.95rem 1rem .85rem}.preview-stage{background:linear-gradient(135deg,#ffffff09,#ffffff03),#0d0d0d59;place-items:center;min-height:320px;padding:1rem;display:grid}.preview-stage--empty{color:#f2f2f2a3;text-align:center}.preview-figure{gap:.8rem;width:100%;display:grid}.preview-figure img{object-fit:contain;background-color:#ffffff05;background-image:linear-gradient(45deg,#ffffff0a 25%,#0000 25%),linear-gradient(-45deg,#ffffff0a 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ffffff0a 75%),linear-gradient(-45deg,#0000 75%,#ffffff0a 75%),none;background-position:0 0,0 9px,9px -9px,-9px 0;background-repeat:repeat,repeat,repeat,repeat,repeat;background-size:18px 18px;background-attachment:scroll,scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box,border-box;border-radius:14px;width:100%;max-height:320px}.preview-meta{color:#f2f2f2cc;gap:.3rem;font-size:.93rem;display:grid}.info-box{background:linear-gradient(#ffffff08,#ffffff04),#1010102e;border:1px solid #ffffff0f;border-radius:20px;padding:1.35rem 1.4rem}.info-box h2{font-family:var(--heading-font);margin-bottom:.95rem;line-height:1.2}.info-box h3{margin-top:1.15rem;margin-bottom:.45rem;font-size:1rem;line-height:1.3}.info-box p{color:#f2f2f2db;margin:0}.info-box p+p{margin-top:.9rem}.info-box--faq p+h3{margin-top:1.25rem}.sr-only{clip:rect(0, 0, 1px, 1px);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=1100px){.compressor-grid,.preview-grid,.stats-grid,.action-row{grid-template-columns:1fr}.compressor-panel--controls{position:static}}@media (width<=768px){.compressor-shell,body>main .section{border-radius:20px}.compressor-shell{padding:1rem}.compressor-shell__header,.comparison-head,.preview-card__head,.control-block__head,.field-row{flex-direction:column;align-items:stretch}.preview-stage{min-height:260px}.preset-grid{grid-template-columns:1fr}.info-box{padding:1rem}}