*{margin:0;padding:0;box-sizing:border-box}body{background:#0a0a0a;color:#888;font-family:SF Mono,Fira Code,monospace;display:flex;flex-direction:column;align-items:center;padding:24px 16px;min-height:100vh}h1{font-size:13px;font-weight:400;letter-spacing:.15em;text-transform:uppercase;color:#555;margin-bottom:6px}.specs{font-size:11px;color:#444;margin-bottom:20px}.canvas-container{position:relative;margin-bottom:4px;cursor:default}.canvas-container canvas{display:block;image-rendering:pixelated;image-rendering:crisp-edges}.axis-label{font-size:10px;color:#333;display:flex;justify-content:space-between;margin-bottom:8px}.control-section button{background:#1a1a1a;border:1px solid #333;color:#888;padding:3px 10px;font-family:inherit;font-size:10px;cursor:pointer;border-radius:3px}.control-section button:hover{border-color:#555;color:#bbb}.section-buttons{display:flex;gap:6px}.control-section .info{font-size:10px;color:#555}.control-section .drag-hint{font-size:9px;color:#393939}.controls{display:flex;gap:0;justify-content:center;margin-bottom:16px}.control-section{display:flex;flex-direction:column;gap:6px;padding:0 14px;border-left:1px solid #222}.control-section:first-child{border-left:none;padding-left:0}.control-section:last-child{padding-right:0}.control-section-label{font-size:11px;font-weight:600;color:#555;text-transform:uppercase;letter-spacing:.12em;margin-bottom:4px}.control-group{display:flex;flex-direction:column;gap:3px}.control-group label{font-size:10px;color:#444;text-transform:uppercase;letter-spacing:.08em}.control-group input[type=range]{width:110px;accent-color:#555}.control-group .val{font-size:10px;color:#666;text-align:right}.record-group{display:flex;gap:6px;align-items:center}.record-group input[type=number]{width:60px;background:#1a1a1a;border:1px solid #333;color:#888;padding:2px 6px;font-family:inherit;font-size:10px;border-radius:3px;text-align:right}.fps{font-size:10px;color:#333;margin-top:8px}