:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;color:#202124;background:#f7f7f5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,select{font:inherit}button{min-height:38px;border:1px solid #d7d9d4;border-radius:8px;background:#fff;color:#202124;padding:0 13px;cursor:pointer;transition:transform .12s ease,border-color .12s ease,background .12s ease}button:hover:not(:disabled){border-color:#8a9289;transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.52}button.primary{border-color:#184c43;background:#184c43;color:#fff}button.active{border-color:#184c43;background:#ecf4f1}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(24,76,67,.24);outline-offset:2px}.app-shell{min-height:100vh;padding:24px;background:linear-gradient(180deg,#fffffff5,#f7f7f5f0),linear-gradient(135deg,rgba(30,119,103,.12),transparent 45%),linear-gradient(315deg,rgba(63,132,204,.1),transparent 38%)}.workspace{width:min(1240px,100%);margin:0 auto}.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:16px}.title-block{max-width:820px}.eyebrow{margin:0 0 6px;color:#66706d;font-size:.76rem;font-weight:760;letter-spacing:0;text-transform:uppercase}h1,p{margin-top:0}h1{margin-bottom:8px;font-size:clamp(2rem,4.4vw,3.35rem);line-height:1.02;letter-spacing:0}.lead{margin-bottom:0;color:#555f5b;line-height:1.75}.tool-layout{display:grid;grid-template-columns:minmax(330px,440px) minmax(0,1fr);gap:16px;align-items:start}.panel,.metrics article{border:1px solid rgba(30,34,30,.1);border-radius:8px;background:#ffffffe6;box-shadow:0 18px 48px #1c241f14;backdrop-filter:blur(16px)}.control-panel{padding:18px}.upload-box{position:relative;display:grid;gap:6px;min-height:118px;border:1px dashed #aeb7b2;border-radius:8px;background:#fbfcfb;padding:16px;cursor:pointer}.upload-box input{position:absolute;inset:0;opacity:0;cursor:pointer}.upload-box span,label span,.section-title,.metrics span{color:#59635f;font-size:.82rem;font-weight:760}.upload-box strong{align-self:end;color:#184c43;font-size:1.02rem}.upload-box small,.preset-grid small,.metrics small,.preview-card p{color:#6b7470;font-size:.78rem}.section-title{margin:18px 0 9px}.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.preset-grid button{display:grid;gap:4px;min-height:62px;justify-items:start;padding:10px;text-align:left}.preset-grid span{color:#202124;font-weight:760}.field-grid{display:grid;gap:10px}.field-grid.two{grid-template-columns:1fr 1fr}.field-grid.three{grid-template-columns:1fr 1fr 1fr;margin-top:12px}label{display:grid;gap:7px}input,select{width:100%;min-height:38px;border:1px solid #d7d9d4;border-radius:8px;background:#fff;color:#202124;padding:0 10px}.range{margin:12px 0}input[type=range]{padding:0}.wide{width:100%}.result-area{display:grid;gap:16px}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.metrics article{min-height:106px;padding:14px}.metrics strong{display:block;margin:6px 0 2px;color:#184c43;font-size:1.65rem;line-height:1.05}.preview-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}.preview-card{display:grid;align-content:start;min-height:430px;margin:0;padding:16px}figcaption{margin-bottom:12px;color:#202124;font-weight:800}.preview-card img{width:100%;max-height:330px;object-fit:contain;border:1px solid #e2e4df;border-radius:8px;background:linear-gradient(45deg,#f3f4f1 25%,transparent 25%),linear-gradient(-45deg,#f3f4f1 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f3f4f1 75%),linear-gradient(-45deg,transparent 75%,#f3f4f1 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.preview-card img.id-preview{width:auto;max-width:100%;justify-self:center;background:#eef1ee}.empty-state{display:grid;place-items:center;min-height:310px;border:1px dashed #cbd0cb;border-radius:8px;color:#6b7470;padding:24px;text-align:center}.status-panel{padding:15px 16px}.status-panel strong{display:block;margin-bottom:6px}.status-panel p{margin-bottom:0;color:#59635f;line-height:1.65}.status-panel.ok{border-color:#184c4338;background:#eff7f4}.status-panel.error{border-color:#b6542a47;background:#fff5ed}@media(prefers-color-scheme:dark){:root{color:#f5f6f2;background:#121512}.app-shell{background:linear-gradient(180deg,#121412f5,#181b18f0),linear-gradient(135deg,rgba(76,158,139,.16),transparent 45%),linear-gradient(315deg,rgba(86,142,210,.12),transparent 38%)}.panel,.metrics article,button,input,select,.upload-box{border-color:#ffffff1f;background:#222622e6;color:#f5f6f2}button.primary{border-color:#e8f1ec;background:#e8f1ec;color:#10251f}button.active,.status-panel.ok{background:#61b39f24}.lead,.preset-grid span,figcaption,.status-panel p{color:#d9ddd8}.eyebrow,.upload-box span,label span,.section-title,.metrics span,.upload-box small,.preset-grid small,.metrics small,.preview-card p,.empty-state{color:#aab2ad}.upload-box strong,.metrics strong{color:#a8dfd0}.preview-card img{border-color:#ffffff1f}.status-panel.error{background:#b6542a21}}@media(max-width:980px){.tool-layout,.preview-grid{grid-template-columns:1fr}}@media(max-width:720px){.app-shell{padding:16px}.topbar{align-items:stretch;flex-direction:column}.preset-grid,.field-grid.two,.field-grid.three,.metrics{grid-template-columns:1fr}}