:root{color-scheme:light;--ink:#202832;--muted:#66737f;--steel:#526d81;--steel-dark:#334b60;--ice:#b1c2ce;--gold:#dfbf69;--border:#dce1e7;--soft:#f5f6f9;--white:#fff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5}
button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:inherit;text-decoration:none}svg{display:block}button:focus-visible,select:focus-visible,input:focus-visible,.drop-area:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.hidden,.hidden-select{display:none!important}
.site-header{height:82px;background:var(--white);border-bottom:1px solid var(--border);position:relative;z-index:3}
.header-inner{max-width:1420px;margin:0 auto;padding:0 35px;height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;gap:8px;flex-shrink:0}
.brand-logo{width:54px;height:54px;object-fit:contain}
.brand-name{display:flex;flex-direction:column;line-height:1;letter-spacing:-.025em}
.brand-name strong{font-weight:1000;font-size:29px;color:#161b21}
.brand-name>span{font-weight:900;font-size:13px;color:var(--steel);letter-spacing:.085em;margin-top:4px}
.brand-period{color:var(--gold)}
.main-nav{display:flex;gap:14px;align-items:center;height:100%}
.nav-choice{height:100%;border:0;border-bottom:3px solid transparent;background:none;color:#39434e;font-size:14px;font-weight:780;padding:4px 21px 0}
.nav-choice:hover{color:var(--steel)}
.nav-choice.active{color:var(--steel-dark);border-bottom-color:var(--gold)}
.privacy-header{display:flex;align-items:center;gap:7px;white-space:nowrap;font-size:12px;color:#526477;font-weight:670}
.privacy-header svg{width:19px;height:19px;stroke:#6e9582;fill:none;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
main{min-height:calc(100vh - 136px)}
.landing{min-height:calc(100vh - 136px);background:#f8f9fc;text-align:center;padding:69px 24px 50px;display:flex;flex-direction:column;align-items:center}
.type-tabs{display:flex;gap:4px;border-radius:9px;background:#e9edf1;padding:4px;margin-bottom:35px}
.type-tab{display:flex;align-items:center;gap:7px;padding:9px 18px;background:transparent;border:0;border-radius:7px;color:#667381;font-size:13px;font-weight:780}
.type-tab svg{height:17px;width:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.type-tab.active{background:#fff;color:var(--steel-dark);box-shadow:0 1px 7px #1d2d3b1a}
.landing h1{font-size:clamp(37px,4.2vw,61px);font-weight:850;line-height:1.12;letter-spacing:-.053em;color:#2b3039;margin:0 0 16px}
.landing-description{max-width:790px;font-size:clamp(16px,1.55vw,20px);line-height:1.65;color:#4f5b67;margin:0 auto 38px}
.drop-area{display:flex;align-items:center;flex-direction:column;min-width:min(100%,550px);padding:0 20px 20px;border:2px dashed transparent;border-radius:14px;transition:.15s}
.drop-area.dragover{background:#eaf0f5;border-color:#91a9ba}
.select-files{width:min(460px,100%);min-height:91px;border:none;border-radius:10px;background:var(--steel);box-shadow:0 5px 0 var(--steel-dark),0 10px 24px rgba(28,43,54,.14);color:#fff;display:flex;gap:13px;align-items:center;justify-content:center;font-weight:810;font-size:clamp(16px,2vw,23px);transition:background .15s,transform .15s}
.select-files:hover{background:#628198;transform:translateY(-2px)}
.select-files svg{width:26px;height:26px;stroke:var(--gold);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.drop-subtext{font-size:14px;color:#596672;margin-top:21px}.drop-feedback{font-size:11px;color:#99a2ad;margin-top:11px}
.landing-privacy{display:flex;align-items:center;gap:8px;color:#7a8792;font-size:12px;margin-top:23px}
.landing-privacy svg{width:15px;height:15px;fill:none;stroke:#789c85;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.results{background:var(--soft);min-height:calc(100vh - 136px)}body.has-files .landing{display:none}
.workspace-grid{display:grid;grid-template-columns:minmax(0,1fr) 410px;min-height:calc(100vh - 136px)}
.files-pane{padding:45px clamp(20px,5vw,90px) 38px;background:#f7f8fb;min-width:0}
.files-pane-top{display:flex;align-items:center;justify-content:space-between;gap:20px}
.files-pane-top h2{font-size:26px;font-weight:820;letter-spacing:-.045em;margin:5px 0 0}
.step-label{color:#73889b;font-size:10px;font-weight:830;letter-spacing:.14em}
.add-files{background:#fff;border:1px solid #cdd6df;border-radius:8px;color:var(--steel-dark);display:flex;align-items:center;gap:8px;padding:10px 13px;white-space:nowrap;font-size:12px;font-weight:800}
.add-files:hover{border-color:#8da3b5;background:#edf3f7}
.add-files svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round}
.file-list{display:flex;flex-wrap:wrap;gap:18px;padding:34px 0 24px}
.file-row{background:#fff;width:195px;min-height:245px;border:1px solid #e5e9ed;border-radius:12px;display:flex;flex-direction:column;gap:0;align-items:center;text-align:center;padding:19px 13px 13px;box-shadow:0 3px 14px rgba(30,48,65,.06)}
.file-thumb{width:138px;height:138px;border-radius:5px;background:#edf1f5;color:#647a8d;object-fit:contain;display:grid;place-items:center;font-size:24px;font-weight:1000;letter-spacing:.08em;border:1px solid #edf0f3}
.file-data{min-width:0;max-width:100%;margin:10px 0 2px}
.file-name{font-size:12px;font-weight:780;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:165px}
.file-meta{font-size:11px;color:#677687;white-space:nowrap}.file-meta .arrow{margin:0 5px;color:#909ba6}
.file-state{font-size:11px;color:#72808c;min-height:17px}
.file-state.done{color:#277c5d;font-weight:750}.file-state.warn{color:#967329}.file-state.error{color:#ad3f36}
.file-actions{display:flex;align-items:center;gap:5px;margin-top:auto;padding-top:8px}
.small-download,.remove-file{background:#edf2f6;border:1px solid #d4dde5;color:#3c5266;border-radius:5px;padding:7px 10px;font-size:10px;font-weight:790}
.small-download:hover:not(:disabled){background:#dfe9f0}.small-download:disabled{opacity:.35}
.remove-file{padding:7px}.remove-file svg{height:14px;width:14px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round}
.progress-wrap{max-width:760px;background:#fff;border:1px solid #dbe4ec;border-radius:9px;padding:16px 19px;margin-bottom:22px}
.progress-text{display:flex;justify-content:space-between;gap:10px;font-size:12px;font-weight:740;color:#4e657a;margin-bottom:9px}
.progress-track{width:100%;height:7px;background:#e6ebf0;border-radius:20px;overflow:hidden}
.progress-bar{height:100%;width:0;background:var(--steel);transition:width .18s}
.download-panel{max-width:690px;background:#fff;border:1px solid #e1e6eb;border-radius:14px;padding:26px 28px 22px;margin:15px 0 24px;text-align:center;box-shadow:0 5px 25px rgba(32,48,63,.04)}
.success-icon{width:40px;height:40px;margin:0 auto 7px;display:grid;place-items:center;background:#e9f6ef;color:#2d9266;border-radius:50%}
.success-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.download-panel h3{font-size:23px;letter-spacing:-.04em;margin:3px 0 4px}.download-panel>p{font-size:13px;color:#71808f;margin:0 0 18px}
.download-primary{display:flex;align-items:center;justify-content:center;gap:13px;width:100%;min-height:68px;border-radius:8px;border:0;background:var(--steel);color:#fff;font-weight:850;font-size:18px;box-shadow:0 4px 0 var(--steel-dark)}
.download-primary:hover{background:#678398}.download-primary svg{width:23px;height:23px;stroke:var(--gold);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.summary-card{display:flex;align-items:center;justify-content:center;gap:22px;padding:19px 10px 0}
.summary-meter{flex-shrink:0;width:85px;height:85px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;background:#dce4eb;color:#263b4a}
.summary-meter:before{content:"";position:absolute;inset:8px;background:#fff;border-radius:50%}
.summary-meter strong,.summary-meter span{position:relative;z-index:1}.summary-meter strong{font-size:20px;line-height:1.15}.summary-meter span{font-size:8px;font-weight:850;letter-spacing:.09em;color:#79909c}
.summary-text{text-align:left;font-size:13px;color:#52616d}.summary-text>div{display:flex;align-items:center;gap:9px;font-size:16px;color:#2a3846;margin:3px 0}.summary-text small{font-size:11px}
.file-pane-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:15px;color:#85909b;font-size:11px}
.clear-button{padding:0;border:0;background:none;color:#7a8692;text-decoration:underline;text-underline-offset:3px;font-size:11px}.clear-button:hover{color:#a54438}
.settings{min-width:0;display:flex;flex-direction:column;border-left:1px solid #dce2e8;background:#fff}
.settings>h2{font-size:24px;letter-spacing:-.035em;line-height:1.3;text-align:center;font-weight:810;padding:29px 20px 26px;margin:0;border-bottom:1px solid var(--border)}
.setting-section{display:none;padding:25px 29px 22px;border-bottom:1px solid #e9edf1}body.has-pdf .pdf-settings,body.has-images .image-settings{display:block}
.setting-title{display:flex;align-items:baseline;gap:9px;margin:0 0 14px}.setting-kicker{color:#718495;font-size:9px;letter-spacing:.12em;font-weight:850}.setting-title strong{font-size:14px}
.mode-cards{display:flex;flex-direction:column;gap:10px}
.mode-card{display:flex;gap:13px;align-items:center;padding:13px 14px;border:1px solid #d7dde3;border-radius:9px;cursor:pointer}
.mode-card:hover{border-color:#829caf}.mode-card.selected{border-color:var(--steel);background:#f5f8fa}
.pdf-settings .mode-card{cursor:default}
.mode-card input{position:absolute;opacity:0;width:1px;height:1px}
.mode-card input:focus-visible+.radio-style{outline:3px solid var(--gold);outline-offset:3px}
.radio-style{width:22px;height:22px;border:1.5px solid #94a3af;border-radius:50%;flex-shrink:0;display:grid;place-items:center}
.mode-card.selected .radio-style{border-color:var(--steel-dark)}.mode-card.selected .radio-style:after{content:"";width:12px;height:12px;border-radius:50%;background:var(--steel-dark)}
.mode-card>span:last-child{display:flex;flex-direction:column;text-align:left}.mode-card strong{font-size:13px;line-height:1.4}.mode-card small{font-size:11px;color:#697783}
.field-hint{font-size:11px;color:#7b8793;line-height:1.5;margin:12px 0 0}
.setting-label{font-size:12px;display:flex;justify-content:space-between;font-weight:800;margin-top:7px;margin-bottom:8px}.setting-label output{color:var(--steel-dark)}
input[type=range]{accent-color:var(--steel);cursor:pointer;width:100%;height:7px}
.range-ends{display:flex;justify-content:space-between;font-size:10px;color:#95a1ac}
.select-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.field{display:flex;flex-direction:column;gap:7px;color:#586773;font-size:11px;font-weight:780;min-width:0}
.field select{width:100%;min-height:39px;background:#fff;color:#2f3e4c;border:1px solid #d3dce4;border-radius:6px;padding:0 8px;font-size:11px}
.pdf-resolution{margin-top:13px}
.settings-bottom{margin-top:auto;padding:25px 28px 22px}
.compress-button{width:100%;height:74px;border:0;border-radius:9px;background:var(--steel);color:#fff;box-shadow:0 4px 0 var(--steel-dark);font-size:18px;font-weight:850;display:flex;align-items:center;justify-content:center;gap:14px}
.compress-button:hover:not(:disabled){background:#648199}.compress-button:disabled{opacity:.5;box-shadow:none}
.compress-button svg{width:23px;height:23px;fill:none;stroke:var(--gold);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.download-all{margin-top:15px;width:100%;background:#fff;border:1px solid #cbd7e1;color:var(--steel-dark);border-radius:8px;font-weight:780;font-size:12px;padding:12px}
.settings-bottom p{display:flex;justify-content:center;align-items:center;gap:7px;color:#83919c;text-align:center;font-size:10px;margin:22px 0 0;line-height:1.5}
.settings-bottom p svg{width:22px;height:22px;flex-shrink:0;fill:none;stroke:#77a58b;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
footer{min-height:54px;background:#fff;border-top:1px solid #e2e6ea;display:flex;align-items:center;justify-content:space-between;padding:0 35px;color:#7a8590;font-size:11px}
#toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,24px);background:#263744;color:#fff;border-radius:7px;padding:11px 18px;font-size:12px;box-shadow:0 9px 30px #0003;opacity:0;visibility:hidden;z-index:20;transition:.2s}
#toast.visible{opacity:1;visibility:visible;transform:translate(-50%,0)}
@media(max-width:1000px){.workspace-grid{grid-template-columns:minmax(0,1fr) 350px}.header-inner{padding:0 20px}.nav-choice{padding:0 12px}.files-pane{padding:35px 30px}.settings>h2{font-size:21px}.setting-section{padding:23px 20px}.settings-bottom{padding:24px 20px}.file-list{gap:10px}.file-row{width:175px}.file-thumb{width:130px;height:130px}}
@media(max-width:740px){.site-header{height:73px}.header-inner{padding:0 16px;gap:7px}.brand-logo{height:45px;width:45px}.brand-name strong{font-size:21px}.brand-name>span{font-size:10px}.main-nav{display:none}.privacy-header{font-size:0}.privacy-header svg{width:20px;height:20px}.landing{padding:60px 15px;min-height:calc(100vh - 127px)}.landing h1{font-size:clamp(34px,8vw,49px)}.landing-description{font-size:16px;margin-bottom:35px}.select-files{min-height:78px;font-size:18px;box-shadow:0 4px 0 var(--steel-dark)}.select-files svg{width:22px;height:22px}.drop-area{min-width:0;width:100%;padding:0 3px 14px}.landing-privacy{font-size:11px;text-align:center}.results{min-height:calc(100vh - 127px)}.workspace-grid{grid-template-columns:1fr}.files-pane{padding:25px 17px 30px;min-height:250px}.files-pane-top h2{font-size:24px}.file-list{justify-content:center;gap:11px;padding:20px 0}.file-row{width:calc(50% - 6px);min-width:145px;max-width:230px}.file-thumb{width:100%;height:130px}.settings{border-left:0;border-top:1px solid #dde4ea}.settings>h2{padding:20px}.settings-bottom{position:sticky;bottom:0;background:#fff;border-top:1px solid #e1e7ed;z-index:2;padding:15px 18px 17px}.compress-button{height:60px;font-size:17px}.settings-bottom p{margin-top:11px}.download-panel{padding:22px 14px}.file-pane-bottom{align-items:start;flex-direction:column;gap:9px}footer{min-height:54px;padding:0 17px;gap:10px;font-size:10px}}
@media(max-width:390px){.file-row{min-width:0}.select-files{font-size:15px}.type-tabs{margin-bottom:29px}.summary-card{gap:10px}.summary-meter{height:71px;width:71px}.summary-text>div{font-size:13px}}
