:root{--spacing-1: 4px;--spacing-2: 8px;--spacing-3: 16px;--spacing-4: 32px;--spacing-5: 64px}#controls{position:absolute;bottom:var(--spacing-4);left:var(--spacing-4);z-index:1000;display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-2);gap:var(--spacing-4)}html,body,#root{position:fixed;top:0;left:0;width:100%;height:100%;background:ivory;font-family:sans-serif}.logo{position:absolute;top:var(--spacing-4);left:var(--spacing-4);width:180px;height:auto;z-index:10}.audioControls{position:absolute;bottom:0;right:0;z-index:10;width:388px;height:198px;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:0px;overflow:hidden;padding:3%}.audioControls #spline-canvas{width:100%;height:auto}.btn{background-color:navy;color:#fff;border:none;border-radius:4px;padding:4px 8px;cursor:pointer;transition:background-color .15s ease-in-out}.btn:hover{background-color:#0000b3}.keyBoardControls{display:grid;grid-template-columns:repeat(3,32px);grid-template-rows:repeat(2,1fr);gap:0px}.keyBoardControls__key{display:flex;justify-content:center;align-items:center;width:100%;height:100%;background-color:#f0f0f0;padding:var(--spacing-2)}.keyBoardControls__key.keyBoardControls__key--w{grid-column:2;grid-row:1}.miniMap{width:208px;height:208px;background-color:red;border-radius:100%;display:flex;align-items:center;justify-content:center}