:root{font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;color:#263832;background:#f7f8f5;font-synthesis:none;color-scheme:light}
*{box-sizing:border-box}body{margin:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}button,select{font:inherit}button,a,select,.drop{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,select:focus-visible,.drop:focus-visible{outline:3px solid #98baa9;outline-offset:4px}[hidden]{display:none!important}
.community{position:absolute;top:24px;right:30px;display:flex;gap:16px;align-items:center;padding:10px 16px;border:1px solid #d8e1d8;border-radius:8px;color:#456856;background:#fff;text-decoration:none;font-size:13px}.community:hover{border-color:#94ae9d}.community span{color:#7f9587}
main{width:100%;flex:1;display:flex;justify-content:center;align-items:center;padding:100px 28px 60px}.screen{width:100%;animation:appear .2s ease-out}header{margin-bottom:36px}h1{margin:0;font-size:36px;line-height:1.4;font-weight:600;letter-spacing:1px}header p{margin:12px 0 0;color:#7c887e;font-size:14px;line-height:1.7}p{line-height:1.8}.upload-screen{text-align:center;max-width:590px}.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:310px;border:1.5px dashed #b8cbbd;border-radius:16px;padding:28px 18px;background:#fff;cursor:pointer;transition:background .2s,border-color .2s}.drop:hover,.drop.drag{border-color:#5c8a6e;background:#f2f8f2}.upload-symbol{font-size:28px;color:#6c9479;line-height:1;margin-bottom:18px}.drop strong{font-size:16px;font-weight:500}.formats{margin-top:17px;font-size:12px;color:#8b968c;line-height:1.9}.upload-note{font-size:12px;color:#8b968c;margin-top:10px}.range{margin-top:20px;color:#6d8372;font-size:12px;line-height:1.8}code{font-family:ui-monospace,Consolas,monospace;font-size:12px;overflow-wrap:anywhere}
.options-screen{max-width:440px}.options-screen h1{font-size:28px}.filename{overflow-wrap:anywhere}.options-screen header{margin-bottom:28px}form label{display:block;font-size:14px;margin-bottom:23px}select{display:block;width:100%;margin-top:10px;padding:13px 15px;border:1px solid #d7e0d8;border-radius:8px;background:#fff;color:#324f3c}button{border:1px solid #3d7052;border-radius:8px;background:#3d7052;color:#fff;padding:13px 23px;font-size:14px;cursor:pointer;transition:background .15s}button:hover{background:#315e43}button:disabled{opacity:.45;cursor:wait}#generate{width:100%;margin-top:12px}.muted{color:#869188;font-size:12px;margin:0}.error{color:#a7463b;background:#fff0ed;border:1px solid #efd4cd;border-radius:8px;padding:14px 16px;text-align:left;font-size:14px;overflow-wrap:anywhere}
.progress-screen{max-width:700px}.progress-panel{width:100%}.progress-caption{display:flex;justify-content:space-between;gap:18px;align-items:baseline;margin-bottom:17px}.progress-caption strong{font-size:16px;font-weight:500}#estimated-time{font-size:13px;color:#839086}.progress{height:10px;background:#e2e9e1;border-radius:8px;overflow:hidden}.progress>div{height:100%;width:0;background:#548263;border-radius:8px;transition:width .35s ease-out}.metadata{margin-top:22px;color:#829086;font-size:13px}.metadata p{margin:5px 0}.metadata .filename{color:#4a6352}.separator{padding:0 12px;color:#b2bdb2}
.result-screen{max-width:1240px}.result-metadata{margin:0 0 28px}.result-metadata h1{font-size:23px;letter-spacing:0}.images{display:grid;grid-template-columns:1fr 1fr;gap:24px}figure{margin:0;min-width:0}figcaption{font-size:14px;color:#6d8172;margin-bottom:12px}.image-surface{background-color:#fff;background-image:linear-gradient(45deg,#f1f3ef 25%,transparent 25%),linear-gradient(-45deg,#f1f3ef 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f1f3ef 75%),linear-gradient(-45deg,transparent 75%,#f1f3ef 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;border:1px solid #e0e6dc;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:300px;aspect-ratio:1.15}.image-surface img{display:block;width:100%;height:100%;max-height:65vh;object-fit:contain}.actions{display:flex;justify-content:center;gap:14px;margin-top:34px}.secondary{background:transparent;color:#557260;border-color:#c6d5c7}.secondary:hover{background:#eaf0e8}footer{text-align:center;color:#a1a8a0;font-size:12px;padding:18px 20px 25px}
@keyframes appear{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:720px){main{padding:96px 20px 35px}.community{top:18px;right:20px;font-size:12px;padding:8px 12px}h1{font-size:30px}.drop{min-height:310px}.progress-caption{flex-direction:column;gap:8px}.images{grid-template-columns:1fr;gap:28px}.image-surface{min-height:240px}.actions{flex-direction:column}.actions button{width:100%}.result-metadata h1{font-size:20px}.separator{padding:0 8px}}
.upload-warning{color:#bb3b35;font-size:13px;margin:-12px 0 22px;line-height:1.8}.history-button{position:absolute;left:30px;top:24px;padding:10px 16px;font-size:13px}.download{display:inline-block;color:#3d7052;font-size:13px;margin-top:14px;text-underline-offset:4px}.expiry{text-align:center;margin-top:25px}.history-screen{max-width:760px}.history-screen h1{font-size:28px}.history-entry{position:relative;background:#fff;border:1px solid #dfe6dd;border-radius:10px;padding:20px 130px 20px 22px;margin-bottom:14px}.history-entry strong{font-size:15px;font-weight:500}.history-entry p{font-size:12px;color:#829086;margin:8px 0 0}.history-entry button{position:absolute;right:20px;top:50%;transform:translateY(-50%);padding:9px 14px;font-size:12px}#history-list{color:#829086;font-size:14px}@media(max-width:720px){.history-button{top:18px;left:20px;font-size:12px;padding:8px 12px}.upload-warning{font-size:12px}.history-entry{padding:18px}.history-entry button{position:static;transform:none;margin-top:14px}}
