@layer resize-base{.resize-page{gap:28px;width:100%;padding:128px 0 28px;display:grid}.resize-page>*{min-width:0}.resize-page [hidden]{display:none!important}.resize-page h1,.resize-page h2{color:var(--ink)}.resize-intro{justify-content:space-between;align-items:center;gap:42px;min-height:230px;padding:42px clamp(32px,5vw,78px);display:flex}.tool-label,.panel-step,.result-eyebrow,.faq-copy>p,.guide-heading>p{color:var(--blue);letter-spacing:.12em;font-size:.78rem;font-weight:900}.tool-label{align-items:center;gap:8px;margin-bottom:12px;display:flex}.tool-label i{font-size:1.35rem}.resize-intro h1{text-align:left;margin:0;font-size:clamp(2.6rem,4vw,4.6rem)}.intro-description{color:var(--muted);margin-top:14px;font-size:clamp(1rem,1.35vw,1.28rem)}.privacy-note{color:#14775d;align-items:center;gap:7px;margin-top:18px;font-size:.92rem;font-weight:800;display:flex}.ratio-guide{border:1px solid var(--line);background:#f7f9ff;border-radius:20px;align-items:center;gap:18px;max-width:480px;padding:14px 20px 14px 12px;display:flex}.ratio-guide img{flex:none;width:108px}.ratio-guide strong,.ratio-guide span{display:block}.ratio-guide strong{font-size:1rem}.ratio-guide span{color:var(--muted);margin-top:6px;font-size:.82rem;line-height:1.5}.resize-workflow{padding:34px clamp(26px,4vw,64px) 52px}.step-list{justify-content:center;align-items:center;max-width:880px;margin:0 auto 38px;padding:0;list-style:none;display:flex}.step-item{color:#8b9ab5;white-space:nowrap;align-items:center;gap:10px;display:flex}.step-item>span{border:1px solid var(--line);background:#f5f7fc;border-radius:50%;place-items:center;width:38px;height:38px;font-size:.9rem;font-weight:900;display:grid}.step-item strong{font-size:.96rem}.step-item.is-active{color:var(--blue)}.step-item.is-active>span{color:#fff;border-color:var(--blue);background:var(--blue);box-shadow:0 8px 18px #118cf33d}.step-item.is-complete{color:#168867}.step-item.is-complete>span{color:#fff;border-color:var(--green);background:var(--green)}.step-line{background:var(--line);width:120px;height:1px;margin:0 18px}.selection-state{text-align:center;max-width:820px;margin:0 auto;padding:58px 28px 28px}.selection-icon{width:78px;height:78px;color:var(--blue);background:#edf5ff;border-radius:22px;place-items:center;margin:0 auto 20px;display:grid}.selection-icon i{font-size:2.9rem}.selection-copy h2{font-size:clamp(1.7rem,2.5vw,2.45rem)}.selection-copy p{color:var(--muted);margin-top:10px;line-height:1.6}.file-select-button{color:#fff;cursor:pointer;background:#086fee;border-radius:17px;justify-content:center;align-items:center;gap:14px;width:min(100%,520px);min-height:86px;margin-top:32px;padding:18px 28px;font-size:clamp(1.08rem,1.8vw,1.45rem);font-weight:900;display:inline-flex;box-shadow:0 14px 28px #086fee3d}.file-select-button:hover{background:#045fce}.file-select-button i{font-size:2rem}.format-note{color:var(--muted);margin-top:16px;font-size:.9rem}.selection-error,.settings-error{color:#b52626;margin-top:14px;font-weight:750}.editing-state{grid-template-columns:minmax(0,1.15fr) minmax(390px,.85fr);gap:24px;display:grid}.editing-state[hidden]{display:none}.source-panel,.settings-panel{border:1px solid var(--line);background:#fbfcff;border-radius:22px;min-width:0;padding:28px}.panel-heading-row{justify-content:space-between;align-items:center;gap:18px;display:flex}.panel-heading-row h2{margin-top:7px;font-size:1.55rem}.add-images-button{border:1px solid var(--line);color:#175fb9;cursor:pointer;background:#fff;border-radius:12px;align-items:center;gap:7px;min-height:42px;padding:0 14px;font-size:.85rem;font-weight:850;display:inline-flex}.preview-frame{background:#eef3fb;border:1px solid #d9e5f7;border-radius:18px;height:370px;margin-top:22px;position:relative;overflow:hidden}.active-file-meta{justify-content:space-between;align-items:center;gap:16px;margin-top:16px;display:flex}.active-file-meta strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.active-file-meta span{color:var(--muted);flex:none;font-size:.82rem}.source-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px;display:grid}.source-item-wrap{min-width:0;position:relative}.source-item{border:1px solid var(--line);width:100%;min-width:0;color:var(--ink);text-align:left;cursor:pointer;background:#fff;border-radius:12px;grid-template-columns:48px 1fr;align-items:center;gap:9px;padding:8px 30px 8px 8px;display:grid}.source-item.is-active{border-color:var(--blue);box-shadow:0 0 0 2px #118cf31f}.source-item img{object-fit:cover;border-radius:8px;width:48px;height:48px}.source-item span,.source-item strong,.source-item small{min-width:0;display:block}.source-item strong{text-overflow:ellipsis;white-space:nowrap;font-size:.78rem;overflow:hidden}.source-item small{color:var(--muted);margin-top:4px;font-size:.68rem}.source-remove{color:#667895;cursor:pointer;background:#eff3fa;border:0;border-radius:50%;place-items:center;width:25px;height:25px;display:grid;position:absolute;top:5px;right:5px}.source-remove:hover{color:#b52626;background:#fff0f0}.settings-heading{align-items:flex-start}.local-badge{color:#14775d;background:#eaf9f4;border-radius:10px;align-items:center;gap:6px;padding:8px 10px;font-size:.72rem;font-weight:850;display:inline-flex}.mode-tabs{background:#edf2fb;border-radius:13px;grid-template-columns:1fr 1fr;gap:6px;margin-top:28px;padding:5px;display:grid}.mode-button{min-height:44px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:10px;font-weight:850}.mode-button.is-active{color:var(--blue);background:#fff;box-shadow:0 4px 12px #224d9917}.dimension-grid{grid-template-columns:1fr 38px 1fr;align-items:end;gap:8px;margin-top:26px;display:grid}.dimension-grid label>span:first-child,.percent-input-label{color:var(--muted);margin-bottom:8px;font-size:.82rem;font-weight:800;display:block}.input-with-unit{background:#fff;border:1px solid #cbd9ee;border-radius:12px;align-items:center;gap:8px;min-height:54px;padding:0 14px;display:flex}.input-with-unit:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px #118cf31f}.input-with-unit input{width:100%;min-width:0;color:var(--ink);background:0 0;border:0;outline:0;font-size:1.18rem;font-weight:850}.input-with-unit small{color:var(--muted);font-size:.8rem}.lock-mark{width:38px;height:38px;color:var(--blue);background:#edf5ff;border-radius:50%;place-items:center;margin-bottom:8px;display:grid}.percent-settings{margin-top:26px}.percent-input-wrap{width:170px}.preset-buttons{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;display:grid}.preset-buttons button{border:1px solid var(--line);min-height:44px;color:var(--ink);cursor:pointer;background:#fff;border-radius:11px;font-weight:850}.preset-buttons button:hover,.preset-buttons button.is-active{color:var(--blue);background:#edf6ff;border-color:#8fc9ff}.ratio-lock-note,.quality-warning{border-radius:13px;align-items:flex-start;gap:10px;margin-top:24px;padding:14px;font-size:.82rem;line-height:1.5;display:flex}.ratio-lock-note{color:#29456e;background:#eef4ff}.ratio-lock-note i{color:var(--blue);flex:none;font-size:1.3rem}.ratio-lock-note strong{display:block}.quality-warning{color:#7b5200;background:#fff7db}.quality-warning i{flex:none;font-size:1.2rem}.resize-button,.primary-action,.secondary-action{cursor:pointer;border:0}.resize-button{color:#fff;background:#086fee;border-radius:14px;justify-content:center;align-items:center;gap:10px;width:100%;min-height:62px;margin-top:26px;font-size:1.05rem;font-weight:900;display:flex;box-shadow:0 12px 22px #086fee33}.resize-button:disabled{cursor:wait;opacity:.65}.processing-status{color:var(--muted);justify-content:center;align-items:center;gap:9px;margin-top:14px;font-size:.82rem;display:flex}.spinner{border:2px solid #cfe1fa;border-top-color:var(--blue);border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result-save-panel{border-radius:var(--panel-radius);width:min(1680px,100% - 32px);min-width:0;box-shadow:var(--shadow);background:#fff;border:1px solid #bde8da;margin-inline:auto;padding:42px clamp(26px,4vw,60px)}.result-heading{justify-content:space-between;align-items:flex-start;gap:22px;display:flex}.result-heading h2{margin-top:8px;font-size:clamp(1.7rem,2.5vw,2.5rem)}.result-heading p:last-child{color:var(--muted);margin-top:10px}.result-status{color:#14775d;background:#eaf9f4;border-radius:11px;align-items:center;gap:7px;padding:10px 13px;font-size:.8rem;font-weight:900;display:inline-flex}.result-status i{font-size:1.25rem}.result-actions{flex-wrap:wrap;gap:10px;margin-top:28px;display:flex}.primary-action,.secondary-action{border-radius:13px;justify-content:center;align-items:center;gap:9px;min-height:52px;padding:0 20px;font-weight:900;display:inline-flex}.primary-action{color:#fff;background:#086fee}.secondary-action{color:#175fb9;border:1px solid var(--line);background:#fff}.save-help{color:var(--muted);margin-top:14px;font-size:.82rem}.result-preview{border:1px solid var(--line);background:#f8faff;border-radius:18px;min-width:0;margin-top:24px;padding:18px}.result-preview-heading{justify-content:space-between;align-items:center;gap:18px;display:flex}.result-preview-heading strong{color:var(--ink);font-size:1rem}.result-preview-heading span{color:var(--muted);font-size:.78rem}.result-preview-frame{background-color:#eaf0fa;background-image:linear-gradient(45deg,#ffffffb3 25%,#0000 25%),linear-gradient(-45deg,#ffffffb3 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ffffffb3 75%),linear-gradient(-45deg,#0000 75%,#ffffffb3 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;border:1px solid #d9e5f7;border-radius:14px;height:clamp(320px,45vw,560px);margin-top:14px;position:relative;overflow:hidden}.result-preview-frame img{object-fit:contain;object-position:center;width:100%;height:100%;position:absolute;inset:0}.result-preview-meta{justify-content:space-between;align-items:center;gap:16px;min-width:0;margin-top:13px;display:flex}.result-preview-meta strong{min-width:0;color:var(--ink);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.result-preview-meta span{color:var(--muted);flex:none;font-size:.8rem}.result-list{gap:10px;min-width:0;margin-top:24px;display:grid}.result-card{border:1px solid var(--line);background:#fbfcff;border-radius:14px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;min-width:0;padding:10px;display:grid}.result-card.is-active{background:#f5f9ff;border-color:#79bbfa;box-shadow:0 0 0 2px #118cf317}.result-select{min-width:0;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:16px;padding:2px;display:grid}.result-select img{object-fit:contain;background:#eef3fb;border-radius:10px;width:72px;height:72px}.result-select>div{gap:5px;min-width:0;display:grid}.result-select strong{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.result-select small{min-width:0;color:var(--muted);overflow-wrap:anywhere}.result-select:focus-visible{outline-offset:3px;border-radius:10px;outline:3px solid #118cf340}.result-download{border:1px solid var(--line);color:#175fb9;cursor:pointer;background:#fff;border-radius:11px;align-items:center;gap:7px;min-height:42px;padding:0 14px;font-weight:850;display:inline-flex}.resize-guide,.resize-faq{padding:58px clamp(28px,5vw,72px)}.guide-heading{max-width:780px}.guide-heading h2,.faq-copy h2{margin-top:9px;font-size:clamp(2rem,3vw,3.3rem)}.guide-heading>span,.faq-copy>span{color:var(--muted);margin-top:12px;line-height:1.65;display:block}.guide-grid{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px;display:grid}.guide-grid article{border:1px solid var(--line);background:#f8faff;border-radius:18px;min-height:190px;padding:24px}.guide-grid i{color:var(--blue);font-size:2rem}.guide-grid h3{margin-top:18px;font-size:1.15rem}.guide-grid p{color:var(--muted);margin-top:10px;font-size:.9rem;line-height:1.65}.resize-faq{grid-template-columns:minmax(240px,.68fr) minmax(520px,1.32fr);gap:clamp(36px,7vw,100px);display:grid}.resize-faq-list{border:1px solid var(--line);border-radius:18px;overflow:hidden}.resize-faq-list details+details{border-top:1px solid var(--line)}.resize-faq-list summary{cursor:pointer;align-items:center;gap:14px;min-height:78px;padding:16px 20px;list-style:none;display:flex}.resize-faq-list summary::-webkit-details-marker{display:none}.resize-faq-list summary>span{width:36px;height:36px;color:var(--violet);background:#f1f3ff;border-radius:50%;flex:none;place-items:center;font-weight:900;display:grid}.resize-faq-list summary strong{flex:1}.resize-faq-list summary i{transition:transform .16s}.resize-faq-list details[open] summary i{color:var(--violet);transform:rotate(180deg)}.resize-faq-list details>p{color:#29456e;background:#f4f7ff;border-radius:13px;margin:0 20px 18px 70px;padding:18px;line-height:1.65}.resize-footer{justify-content:space-between;align-items:center;gap:20px;min-height:110px;margin-bottom:18px;padding:24px 40px;display:flex}.resize-footer-brand{letter-spacing:-.06em;font-size:1.7rem;font-weight:900}.resize-footer p{color:var(--muted);font-size:.9rem}.resize-footer>a:last-child{color:#175fb9;align-items:center;gap:6px;font-size:.85rem;font-weight:850;display:inline-flex}}@layer resize-components;@layer resize-responsive{@media (width<=980px){.resize-faq{grid-template-columns:1fr;gap:30px}}@media (width<=1100px) and (width>=821px){.source-list{grid-template-columns:1fr}}@media (width<=820px){.resize-intro{align-items:flex-end}.ratio-guide{max-width:370px}.ratio-guide img{width:84px}.editing-state{grid-template-columns:1fr}.preview-frame{height:330px}.resize-faq{grid-template-columns:1fr;gap:30px}}@media (width<=720px){.resize-page{gap:18px;padding-top:96px}.resize-intro{min-height:auto;padding:28px 20px;display:block}.resize-intro h1{font-size:2.2rem}.intro-description{margin-top:10px;font-size:.95rem}.privacy-note{margin-top:13px;font-size:.78rem}.ratio-guide{display:none}.resize-workflow{padding:24px 14px 18px}.step-list{margin-bottom:24px}.step-item{white-space:normal;text-align:center;flex-direction:column;flex:1 1 0;gap:5px;min-width:0}.step-item>span{width:31px;height:31px;font-size:.75rem}.step-item strong{font-size:.72rem;line-height:1.3}.step-line{flex:0 36px;width:auto;min-width:8px;margin:0 3px 20px}.selection-state{padding:30px 2px 18px}.selection-icon{border-radius:18px;width:64px;height:64px;margin-bottom:16px}.selection-copy h2{font-size:1.45rem}.selection-copy p{padding-inline:12px;font-size:.83rem}.file-select-button{border-radius:14px;min-height:68px;margin-top:24px;padding:14px 12px;font-size:1.02rem}.file-select-button i{font-size:1.7rem}.format-note{font-size:.78rem}.source-panel,.settings-panel{border-radius:17px;padding:18px 14px}.panel-heading-row h2{font-size:1.28rem}.add-images-button{padding-inline:10px;font-size:.75rem}.preview-frame{border-radius:14px;height:250px;margin-top:16px}.active-file-meta{flex-direction:column;align-items:flex-start;gap:5px}.active-file-meta strong{width:100%}.source-list{scroll-snap-type:x proximity;padding:2px 2px 8px;display:flex;overflow-x:auto}.source-item-wrap{scroll-snap-align:start;min-width:180px}.local-badge{font-size:.65rem}.dimension-grid{grid-template-columns:1fr 30px 1fr}.input-with-unit{min-height:50px;padding-inline:10px}.input-with-unit input{font-size:1rem}.lock-mark{width:30px;height:30px}.resize-button{z-index:8;min-height:58px;position:sticky;bottom:10px}.result-save-panel{border-radius:22px;width:calc(100% - 20px);padding:28px 16px}.result-heading{display:block}.result-status{margin-top:16px}.result-actions{grid-template-columns:1fr;display:grid}.primary-action,.secondary-action{width:100%}.result-preview{padding:12px}.result-preview-heading{flex-direction:column;align-items:flex-start;gap:4px}.result-preview-frame{height:min(76vw,320px)}.result-preview-meta{flex-direction:column;align-items:flex-start;gap:5px}.result-preview-meta strong{width:100%}.result-preview-meta span{overflow-wrap:anywhere;flex:none;width:100%;font-size:.72rem;line-height:1.45}.result-card{grid-template-columns:1fr;gap:8px}.result-select{grid-template-columns:58px minmax(0,1fr);gap:10px}.result-select img{width:58px;height:58px}.result-select strong{font-size:.8rem}.result-select small{font-size:.68rem}.result-download{grid-column:1/-1;justify-content:center}.resize-guide,.resize-faq{padding:38px 18px}.guide-heading h2,.faq-copy h2{font-size:1.85rem}.guide-grid{grid-template-columns:1fr;gap:10px;margin-top:26px}.guide-grid article{min-height:auto;padding:18px}.resize-faq-list summary{gap:10px;min-height:70px;padding:14px 10px}.resize-faq-list summary>span{width:32px;height:32px}.resize-faq-list summary strong{font-size:.84rem;line-height:1.45}.resize-faq-list details>p{margin:0 10px 12px;padding:15px;font-size:.82rem}.resize-footer{text-align:center;flex-direction:column;min-height:auto;margin-bottom:10px;padding:28px 20px}}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:.01ms}}}#active-preview{object-fit:contain;object-position:center;width:100%;max-width:none;height:100%;max-height:none;position:absolute;inset:0}