.native-compression,.native-compression-response{font-family:Meiryo,Arial,sans-serif;color:#24483f;box-sizing:border-box;max-width:100%}.native-compression-label{font-weight:700;display:block;margin:12px 0}.native-compression-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;border:2px dashed #a9c7bb;border-radius:20px;background:#f3f8f5;padding:28px 14px;min-height:170px;box-sizing:border-box}.native-compression-drop>i{font-size:40px;color:#408875}.native-compression input[type=file]{display:block;width:100%;max-width:100%;min-width:0;font-size:16px;white-space:normal;overflow-wrap:anywhere}.native-compression-drop p{font-size:13px;margin:0;text-align:center}.native-compression-actions{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:14px 0}.native-compression-actions small{overflow-wrap:anywhere;min-width:0}.native-compression button,.native-compression-auth a,.native-compression-item a,.native-compression-limit{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:44px;height:auto;white-space:normal;overflow-wrap:anywhere;padding:10px 16px;border-radius:14px;text-align:center;border:1px solid #367f6c;color:white;background:#367f6c;text-decoration:none;max-width:100%;box-shadow:0 5px 12px #24483f13}.native-compression button:disabled{background:#dedede!important;color:#858585!important;border-color:#dedede!important;box-shadow:none}.native-compression-result{width:100%;border:0;min-height:1px;height:1px;display:block}.native-compression-response{margin:0;padding:8px;font-size:14px;overflow-wrap:anywhere}.native-compression-item{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px;background:#eff6f2;border:1px solid #c9dcd3;border-radius:14px;margin:8px 0}.native-compression-item span{flex:1;min-width:0;overflow-wrap:anywhere}.native-compression-auth{display:flex;gap:8px;flex-wrap:wrap}.native-compression-auth a{flex:1}.native-compression-error{padding:12px;border:1px solid #dda4a4;color:#9b3434;border-radius:12px;background:#fff5f5;line-height:1.7}.native-compression-loading{display:none;line-height:1.6}.is-processing .native-compression-loading{display:block}.is-processing button[type=submit]{pointer-events:none;opacity:.6}@media(prefers-reduced-motion:no-preference){.is-processing .native-compression-loading{animation:compressPulse 1s ease-in-out infinite alternate}@keyframes compressPulse{to{opacity:.45}}}

/* Preserve the original upload surface; the native picker keeps PHP's file-count bounds. */
.native-compression-toolbar{display:flex;justify-content:flex-end;margin:12px 0 18px;gap:12px}.native-compression-upload{display:inline-flex;align-items:center;justify-content:center;gap:9px;text-align:center;min-height:44px;height:auto;padding:12px 18px;max-width:100%;box-sizing:border-box;white-space:normal;overflow-wrap:anywhere;border:1px solid #428c72;border-radius:16px;color:#fff;background:linear-gradient(115deg,#4b9c80,#24755d);box-shadow:0 6px 16px #356f4e1a;cursor:pointer;font-weight:700;font-size:14px;line-height:1.6}.native-compression-drop{position:relative;min-height:290px;padding:36px 18px;gap:18px;border-radius:24px;border-color:#b7cbc3;background:#f8faf8}.native-compression-upload-icon{width:46px;height:46px;color:#79a693}.native-compression-placeholder{font:500 clamp(18px,4.8vw,24px)/1.6 Meiryo,"メイリオ",sans-serif;color:#879a90;text-align:center;max-width:100%;margin:0;overflow-wrap:anywhere}.native-compression input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;padding:0;margin:0;z-index:1}.native-compression-drop:focus-within{outline:3px solid #3f947c;outline-offset:4px}.native-compression-drop p{font-size:12px;color:#7e9489}.native-compression-actions{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:12px;margin:16px 0}.native-compression-actions small{font-size:12px;line-height:1.65;flex:1}.native-compression .native-compression-cancel{background:#ededed;color:#929292;border-color:#dadfdb;box-shadow:none;font-size:13px;gap:6px;flex-shrink:0;padding:9px 13px;min-height:42px;pointer-events:none}.native-compression:has(input[type=file]:valid:not(:disabled)) .native-compression-cancel{pointer-events:auto;background:#fff8f8;border-color:#dd7076;color:#ad4049}.native-compression:has(input[type=file]:valid:not(:disabled)) .native-compression-drop{background:#eef7f1;border-color:#549a7f}.native-compression .native-compression-submit{display:none;width:100%;margin:8px 0 12px}.native-compression:has(input[type=file]:valid:not(:disabled)) .native-compression-submit{display:flex}.native-compression:has(input[type=file]:disabled) .native-compression-upload{background:#e2e6e3;color:#969f9a;border-color:#dbe1dd;box-shadow:none;pointer-events:none}.native-compression input[type=file]:disabled{cursor:not-allowed}.is-processing .native-compression-upload,.is-processing input[type=file]{pointer-events:none;opacity:.5}.is-processing input[type=file]{opacity:0}@media(max-width:390px){.native-compression-drop{min-height:235px}.native-compression-upload{font-size:13px;padding:11px 14px}.native-compression-actions{gap:9px}.native-compression .native-compression-cancel{padding:9px 11px}}@media(prefers-reduced-motion:no-preference){.native-compression:has(input[type=file]:valid:not(:disabled)) .native-compression-cancel{animation:compress-cancel-glow 2s ease-in-out infinite}@keyframes compress-cancel-glow{50%{box-shadow:0 0 0 4px #d9636315}}}

/* Compression progress and measured results; no simulated percentages. */
.native-compression-toolbar{justify-content:flex-start}
body.index-page #tab3 .native-compression-toolbar{padding-right:150px}
.native-compression-upload{min-width:0}
.native-compression-progress{position:relative;display:block;width:100%;height:10px;min-height:10px;border-radius:999px;background:#e2eee7;overflow:hidden;box-sizing:border-box}
.native-compression-progress>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#67bd9f,#287b60)}
.native-compression-progress.is-indeterminate>span{width:36%;animation:native-compression-working 1.3s ease-in-out infinite}
.native-compression-progress.is-complete>span{width:100%}
.native-compression-loading{padding:17px 15px;border:1px solid #d0e3d8;border-radius:16px;background:#f0f8f3;color:#336c56}
.native-compression-loading p{margin:0 0 11px;font-weight:700;line-height:1.7;overflow-wrap:anywhere}
.native-compression-loading small{display:block;margin-top:10px;font-size:12px;line-height:1.8;overflow-wrap:anywhere}
.is-processing .native-compression-cancel{pointer-events:none;opacity:.5}
.native-compression-item.native-compression-complete{display:block;padding:17px;line-height:1.7}
.native-compression-result-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.native-compression-result-heading strong{flex:1;min-width:0;overflow-wrap:anywhere;color:#254e40;font-size:14px}
.native-compression-result-heading>span{flex:0 1 auto;font-size:12px;border:1px solid #bddcc9;padding:5px 9px;border-radius:10px;background:#fff;box-sizing:border-box;white-space:normal;overflow-wrap:anywhere}
.native-compression-result-heading b{color:#288465}
.native-compression-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:14px 0}
.native-compression-metrics>div{min-width:0;padding:11px 8px;border:1px solid #d4e4da;border-radius:12px;background:#fff;text-align:center;box-sizing:border-box}
.native-compression-metrics dt{font-size:11px;font-weight:500;color:#6c8177;line-height:1.65;white-space:normal;overflow-wrap:anywhere}
.native-compression-metrics dd{margin:5px 0 0;font-size:clamp(13px,3.4vw,17px);font-weight:700;line-height:1.6;color:#296e53;white-space:normal;overflow-wrap:anywhere}
.native-compression-metrics del{color:#84948c;font-weight:500}
.native-compression-metrics .native-compression-reduction{background:#e3f3e9;border-color:#aaceb8}
.native-compression-size-note{font-size:12px;line-height:1.8;color:#7c6240;overflow-wrap:anywhere}
.native-compression-complete>a{display:flex;width:100%;min-height:44px;align-items:center;justify-content:center;line-height:1.6;white-space:normal}
@keyframes native-compression-working{0%{transform:translateX(-110%)}100%{transform:translateX(390%)}}
@media(max-width:575px){body.index-page #tab3 .native-compression-toolbar{padding-right:124px}.native-compression-metrics{gap:6px}.native-compression-item.native-compression-complete{padding:13px}.native-compression-metrics>div{padding:10px 5px}}
@media(prefers-reduced-motion:reduce){.native-compression-progress.is-indeterminate>span{animation:none;width:100%;background:repeating-linear-gradient(120deg,#76b99d 0 12px,#a8d4be 12px 24px)}}

/* Native form stays disabled until accepted files are selected. */
.native-compression .native-compression-submit{display:flex;align-items:center;justify-content:center;min-height:46px}
.native-compression .native-compression-submit:disabled{cursor:not-allowed;opacity:1}
.native-compression.has-selected-files .native-compression-placeholder,.native-compression.has-selected-files .native-compression-upload-icon{display:none}
.native-compression-files{position:relative;z-index:2;display:grid;gap:8px;list-style:none;padding:0;margin:0;width:100%;max-width:440px;max-height:180px;overflow:auto}
.native-compression-files[hidden]{display:none}
.native-compression-files li{display:flex;align-items:center;gap:10px;min-width:0;padding:8px 10px;box-sizing:border-box;border:1px solid #cbded2;border-radius:12px;background:#fff;color:#325947;text-align:left;font:12px/1.6 Meiryo,Arial,sans-serif}
.native-compression-files img,.native-compression-file-icon{display:flex;align-items:center;justify-content:center;flex:0 0 38px;width:38px;height:38px;object-fit:contain;border-radius:7px;background:#e6f2eb;color:#3d7c5c;font-size:10px}
.native-compression-files li>span:last-child{min-width:0;overflow-wrap:anywhere}
.native-compression-drop.is-drag-over{border-color:#248562;background:#e5f4eb;box-shadow:inset 0 0 0 2px #24856233}
.native-compression-selection-modal .modal-dialog{max-width:420px;margin-left:auto;margin-right:auto;padding:10px}
.native-compression-selection-modal .modal-content{border:1px solid #c9ded3;border-radius:24px;background:#f8fcf9;color:#315e4e;font-family:Meiryo,Arial,sans-serif}
.native-compression-selection-modal .modal-body{padding:28px 22px;text-align:center;overflow-wrap:anywhere}
.native-compression-selection-modal h2{font-size:20px;font-weight:700;line-height:1.65;margin:0 0 16px}
.native-compression-selection-modal p{padding:14px;border:1px solid #c7dcd0;border-radius:14px;line-height:1.8;background:#edf6f0}
.native-compression-selection-modal button{display:flex;align-items:center;justify-content:center;min-height:44px;height:auto;max-width:100%;margin:20px auto 0;padding:10px 24px;border:1px solid #3a8266;border-radius:12px;background:#3a8266;color:white;font:700 14px/1.6 Meiryo,Arial,sans-serif;white-space:normal;text-align:center}
@media(prefers-reduced-motion:no-preference){.native-compression.has-selected-files .native-compression-submit:not(:disabled){animation:native-compression-ready 1.8s ease-in-out infinite}@keyframes native-compression-ready{50%{box-shadow:0 0 0 4px #368b6520;transform:translateY(-1px)}}}