diff --git a/app/base.tsx b/app/base.tsx
index e1da5a6..b2c36f3 100644
--- a/app/base.tsx
+++ b/app/base.tsx
@@ -275,7 +275,7 @@ function RenderedTreeNode({
       return <GooeyTextarea props={props} state={state} />;
     }
     case "input": {
-      const className = `gui-input gui-input-${props.type}`;
+      const className = `gui-input gui-input-${props.type} ${props.className ?? ""}`;
       const id = inputId(props);
       switch (props.type) {
         case "range":
diff --git a/app/styles/app.css b/app/styles/app.css
index 13c80e2..a8d02de 100644
--- a/app/styles/app.css
+++ b/app/styles/app.css
@@ -287,6 +287,10 @@ div[id^="react-select-"][id$="-listbox"] {
   margin: 0 1rem;
 }
 
-.gui-input-number input {
-  padding: 0.5rem;
+.gui-input-smaller input {
+  width: 5rem;
+}
+
+.gui-input-smaller label {
+  display: none;
 }