:root{color:#344659;background:#edf2f7;font:15px/1.6 Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{margin:0}header,main{max-width:1280px;margin:auto;padding:22px}header{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-bottom:0}header p{max-width:420px;color:#66768a}h1{margin:4px 0;font-size:26px}h2{font-size:18px;margin:0 0 12px}p{margin:8px 0}small{color:#6b7c91}.toolbar,.details{background:#ffffffb8;border:1px solid #d4e0eb;border-radius:16px;padding:18px}.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}.toolbar label{display:flex;align-items:center;gap:8px}.toolbar .slider{flex-wrap:wrap;width:260px}.slider input{width:100%}output{margin-left:auto;font-variant-numeric:tabular-nums}input,select,button{accent-color:#527aa3;font:inherit}button,select{border:1px solid #bccddd;border-radius:8px;background:#fff;padding:8px 12px}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}input:focus-visible,button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #6e9ecd;outline-offset:3px}#status{padding:8px;color:#546e8b}#status.error{color:#a5223d}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:24px}.comparison section{min-width:0}.canvas-wrap{border:1px solid #ccd8e5;border-radius:12px;overflow:hidden;line-height:0}canvas{width:100%;height:auto;display:block;aspect-ratio:2/3}.checker{background-color:#fafafa;background-image:conic-gradient(#e2e7ee 25%,transparent 0 50%,#e2e7ee 0 75%,transparent 0);background-size:20px 20px}.light{background:#fff}.dark{background:#1d2b3f}.details{margin-top:22px}#layers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.layer-card{display:flex;align-items:center;gap:12px;border:1px solid #d7e1ea;border-radius:10px;padding:10px;overflow-wrap:anywhere}.layer-card img{width:58px;height:58px;object-fit:contain;background:#e4eaf1;border-radius:6px}.layer-card small{display:block;font-size:11px}.layer-card input{flex-shrink:0}a{color:#38648c;margin-right:22px}@media(max-width:760px){header{display:block}header,main{padding:14px}h1{font-size:22px}.comparison{gap:12px}.comparison h2{font-size:14px}#layers{grid-template-columns:1fr}.toolbar{gap:12px}}