*{box-sizing:border-box}body{color:#222;background:#f2f2f4;margin:0;font-family:system-ui,sans-serif}header{z-index:1;background:#fff;border-bottom:1px solid #ddd;align-items:center;gap:8px;padding:12px 16px;display:flex;position:sticky;top:0}#status{color:#666;flex:1;font-size:14px}button,.button{font:inherit;cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:6px;padding:8px 14px;font-size:14px}button.primary{color:#fff;background:#2563eb;border-color:#2563eb}button:disabled{opacity:.5;cursor:default}main{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));align-content:start;gap:16px;min-height:calc(100vh - 60px);padding:16px;display:grid}main.dragover{outline-offset:-8px;outline:3px dashed #2563eb}#empty{text-align:center;color:#888;grid-column:1/-1;margin-top:80px}.page{cursor:grab;-webkit-user-select:none;user-select:none;background:#fff;border-radius:8px;padding:8px;position:relative;box-shadow:0 1px 3px #00000026}.page canvas{border:1px solid #eee;width:100%;height:auto;display:block}.page .label{color:#666;white-space:nowrap;text-overflow:ellipsis;margin-top:6px;font-size:12px;overflow:hidden}.page .remove{opacity:0;border-radius:50%;width:28px;height:28px;padding:0;font-size:16px;line-height:1;position:absolute;top:4px;right:4px}.page:hover .remove{opacity:1}.page.ghost{opacity:.3}