Luma Lamp

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Rebuild a responsive mobile-first lamp-control game/app titled "Luma Lamp". It is a single-screen interactive lamp interface, not an action game: the player controls whether a stylized lamp is on, its brightness, and its light color. Use Indonesian UI text exactly as shown in the source: header title "💡 Luma Lamp" on the left and a status on the right that is "Mati" when off and "Menyala" when on; the large toggle button says "Nyalakan" when off and "Matikan" when on; controls say "Kecerahan" with a live percentage and "Warna cahaya"; color choices are "Hangat", "Putih", and "Dingin"; footer says "Tekan tombol besar untuk mengontrol lampu".

Visual layout: fill the viewport with a very dark navy-black background (#090b12), white/light gray system sans-serif text, and a centered narrow app column (on desktop constrain it to roughly 560px wide; on mobile use about 20px side padding). Put a header at the top with the lamp emoji and title in a larger font and a muted gray status label. In the central area, vertically stack a large lamp illustration, the main toggle, and a rounded settings panel. The lamp illustration is centered in a roughly square responsive area (about 68vw, capped near 300px): make a large circular/rounded bulb with a dark brown thick outline, warm radial shading from nearly white at the upper-left/center to golden brown at the bottom/right, an inset dark shading edge, and a small dark brown rounded rectangular base beneath it with a darker lower shadow. Behind the bulb, show a soft radial halo/glow that fades outward. When the lamp is on, the bulb is fully opaque and the halo is prominent; when off, dim the bulb to about 28% opacity and reduce the halo to a barely visible glow. The page background should also have subtle large radial illumination around the lamp when on.

Place a large pill-shaped button below the lamp, around 180px by 64px. When off it is dark slate with white text; when on it uses the current color accent (warm yellow for Hangat, pale blue for Putih, blue for Dingin), dark text, and a subtle accent glow. Clicking/tapping it toggles the lamp state and immediately updates the button label, header status, bulb opacity, halo, and overall glow. The source starts with the lamp off, brightness 70%, and the warm color selected.

Below the toggle, create a translucent dark slate settings card about 420px wide maximum, with rounded corners around 24px, a subtle light border, internal padding, and a slightly glassy/backdrop-blurred appearance. The first row contains the label "Kecerahan" plus a bold live value such as "70%" and a horizontal range slider. The slider must accept values from 10 to 100, start at 70, display the current percentage continuously, and use the currently selected accent color. Changing brightness changes the lamp's computed glow intensity while on (higher brightness means stronger glow); the brightness value remains editable even when off. Add the "Warna cahaya" label, then three equal-width rounded buttons in one row: Hangat uses lamp color #fff7d1 and accent #ffd35a, Putih uses lamp color #ffffff and accent #b8d7ff, and Dingin uses lamp color #d9e9ff and accent #8db9ff. The warm button is initially active with an accent-colored border/text; selecting another mode changes the bulb/halo tint, range accent, active button styling, and on-state toggle accent.

Keep the composition vertically centered in the available main area with generous spacing, and put the muted gray footer at the bottom. Use smooth approximately 0.3-second transitions for glow, opacity, colors, and button appearance. The lamp can be created entirely with CSS gradients, borders, shadows, and rounded shapes; do not add characters, enemies, scores, inventory, levels, or other gameplay elements because this experience is only the interactive lamp controller.