html,body{height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif}.toolbar{display:flex;gap:8px;padding:8px 12px;background:#f3f4f6;align-items:center;border-bottom:1px solid #e5e7eb}.toolbar button{padding:6px 12px;border:1px solid #d1d5db;background:#fff;border-radius:4px;cursor:pointer;font-size:14px}.toolbar button:hover{background:#f9fafb}.toolbar button:active{background:#e5e7eb}.toolbar .spacer{flex:1}@media(width <= 565px){.toolbar .text{display:none}}.status{font-size:14px;color:#374151;min-width:60px}.viewer{display:flex;align-items:flex-start;height:calc(100% - 53px);overflow:auto;background:#9ca3af;padding:12px;box-sizing:border-box;cursor:grab;user-select:none}.viewer.dragging{cursor:grabbing}.viewer canvas{display:block;margin:0 auto;flex:none;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.2)}@media(width <= 565px){.viewer{padding:8px}}#print-area{display:none}@media print{.toolbar,.viewer{display:none !important}#print-area{display:block}#print-area canvas{display:block;width:100%;height:auto;page-break-after:always}#print-area canvas:last-child{page-break-after:avoid}}