:root{--leftbar-width: 300px;--leftbar-height: 100svh;--bottombar-width: 100svw;--bottombar-height: 300px;--icon-size: 40px}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.three-scene{position:fixed;top:0;right:0;width:100svw;height:100svh;transition:all .3s}.three-scene.active{width:calc(100svw - var(--leftbar-width))}.parametric-input-top-level{z-index:10;position:fixed;display:grid;grid-template-columns:var(--icon-size) auto;left:0;bottom:0;width:var(--icon-size);height:var(--leftbar-height);transition:all .3s;transform:translateY(0)}.parametric-input-top-level.active{transform:translateY(0);width:var(--leftbar-width)}.parametric-input-icons{display:flex;flex-direction:column;gap:4}.icon-button{cursor:pointer;width:20px;height:20px;padding:10px;background-color:#fff;transition:all .3s}.icon-button:hover{background-color:#c1b8ff}.icon-button.active{background-color:#2a15b4;color:#fff}.parametric-input-content{background-color:#ffffffb3;width:0;transition:all .3s}.parametric-input-content.active{display:grid;grid-template-rows:30px calc(100svh - 39px);padding:8px;width:calc(100% - 16px)}.parametric-input-fields{overflow-y:auto;overflow-x:hidden;padding:8px 2px}.parametric-input-icon{padding:4px;background-color:#fff;color:#00008b}.parametric-input-icon .active{background-color:#add8e6;color:#000}.parametric-input-title{display:flex;flex-direction:row;justify-content:space-between;padding:0 4px;border-bottom:1px solid black}@media (max-width: 650px){.three-scene{width:100svw;height:100svh}.three-scene.active{width:100svw;height:calc(100svh - var(--bottombar-height) + var(--icon-size))}.parametric-input-top-level{grid-template-rows:var(--icon-size) auto;grid-template-columns:auto;width:var(--bottombar-width);height:var(--bottombar-height);grid-row:2;transform:translateY(calc(var(--bottombar-height) - var(--icon-size)))}.parametric-input-icons{flex-direction:row;grid-template-rows:30px calc(var(--bottombar-height) - 30px);width:100svw}.parametric-input-icons.active{grid-template-rows:30px calc(var(--bottombar-height) - 30px);width:100svw}.parametric-input-content{grid-template-rows:30px calc(var(--bottombar-height) - var(--icon-size) - 39px);transition:all .3s}.parametric-input-content.active{grid-template-rows:30px calc(var(--bottombar-height) - var(--icon-size) - 39px);padding:8px}.parametric-input-content{width:var(--bottombar-width)}}
