*{box-sizing:border-box}body{margin:0;font-family:PingFang SC,Microsoft YaHei,system-ui,sans-serif;color:#222;background:#f4f2f3}header{padding:10px 18px;background:#e8467c;color:#fff;display:flex;align-items:baseline;gap:14px}header h1{margin:0;font-size:20px}header .sub{opacity:.85;font-size:13px}main{display:flex;height:calc(100vh - 46px)}#panel{width:300px;flex:none;overflow-y:auto;padding:10px 14px;background:#fff;border-right:1px solid #ddd}#panel section{border-bottom:1px solid #eee;padding:8px 0}#panel h3,.side h3{font-size:14px;margin:4px 0 6px}#panel label{display:block;font-size:13px;margin:4px 0}.row{display:flex!important;align-items:center;gap:6px;font-size:13px;margin:4px 0}.row input[type=number]{width:60px}.row input[type=range]{flex:1}.drop{border:2px dashed #e8467c;border-radius:8px;padding:18px 8px;text-align:center;font-size:13px;color:#666}.drop.over{background:#fde7ef}.link{color:#e8467c;cursor:pointer;text-decoration:underline;display:inline!important}#source{width:100%;margin-top:8px;image-rendering:pixelated;display:none}#source.picking{cursor:crosshair;outline:3px solid #e8467c}button{font:inherit;font-size:13px;padding:4px 10px;border:1px solid #ccc;border-radius:5px;background:#fff;cursor:pointer;margin:2px 0}button:hover{border-color:#e8467c}button.active{background:#e8467c;color:#fff;border-color:#e8467c}button.small{padding:1px 6px;font-size:12px}.swatch{display:inline-block;width:18px;height:18px;border:1px solid #333;vertical-align:middle;background:repeating-conic-gradient(#ccc 0,#ccc 25%,#fff 0,#fff 50%) 0 0 / 8px 8px}#workspace{flex:1;display:flex;flex-direction:column;min-width:0}.status{padding:6px 14px;font-size:13px;background:#fff8e1;border-bottom:1px solid #eee}.toolbar{display:flex;justify-content:space-between;align-items:center;padding:6px 14px;background:#fff;border-bottom:1px solid #ddd;flex-wrap:wrap;gap:6px}.tools{display:flex;align-items:center;gap:6px;font-size:13px}.views{flex:1;display:flex;min-height:0}.canvas-wrap{flex:1;overflow:auto;padding:10px}.canvas-wrap canvas{background:#fff;box-shadow:0 1px 4px #00000026;cursor:crosshair}.side{width:270px;flex:none;overflow-y:auto;padding:8px 12px;background:#fff;border-left:1px solid #ddd}#legend .item{display:flex;align-items:center;gap:6px;font-size:12px;padding:2px 0}#legend .item .code{width:34px;font-weight:700;cursor:pointer}#legend .item .count{margin-left:auto}#legend .total{font-weight:700;margin:6px 0;font-size:13px}#palette{display:grid;grid-template-columns:repeat(8,1fr);gap:3px}#palette div{aspect-ratio:1;border:1px solid #999;cursor:pointer;font-size:8px;display:flex;align-items:flex-end;justify-content:center}#palette div.sel{outline:3px solid #e8467c;z-index:1}#paletteFilter{width:100px;font-size:12px;margin-left:6px}