Need to write a complete Tetris-like game. Single HTML file, canvas, dark theme. Let me write clean code.

Pieces: I, O, T, S, Z, J, L — four squares each (tetrominoes), different colors.

Rotation: rotation by offset model. Define rotation states or use matrix rotation. Simplest: define each piece as matrix and rotate by matrix rotation, then do wall-kick attempts for x offset (0, -1, +1, -2, +2). For I piece which is 4x4 matrix rotation.

Let me define pieces as matrices:
- I: 4x4
- O: 2x2 (rotation effectively does nothing)
- T, S, Z, J, L: 3x3

Rotate matrix clockwise: newMatrix[x][y] = old[N-1-y][x].

Wall kicks: try offsets [0,-1,1,-2,2], check validity. Also small upward kick (dy -1) maybe. Keep simple.

Game loop: requestAnimationFrame and drop timer. Level speed: dropInterval = max(100, 800 - (level-1)*70) or use standard formula.

Scoring: 40, 100, 300, 1200 per level times line-clear multiplier.

Next-piece preview: separate small canvas.

Game over: overlay text on canvas, restart with R key.

Hard drop: instant drop, lock, plus score. Soft drop speeds up.

Let me write it. Clean dark style. Canvas 10x20, cell 30px → 300x600.

Implement ghost? Not required. Keep simple but polished.

Draw blocks with slight bevel highlight.

Prevent key repeat issues with arrow keys — use e.preventDefault.

Spawn piece at top center. Game over if spawn collides.

Lock: when piece can't move down, gravity-timer handles. On hard-drop, lock immediately.

Let me code:

```js
const COLS=10, ROWS=20, SIZE=30;
const pieces = { I:{color:'#00d9f5',shape:[[0,0,0,0],[1,1,1,1],[0,0,0,0],[0,0,0,0]]}, O:{...}, T, S, Z, J, L }
```

Valid check: iterate cells of matrix, if filled and (x<0 || x>=COLS || y>=ROWS) return false; if y>=0 && board[y][x] return false.

Rotate: rotate matrix clockwise, try kicks.

Soft drop: move down; if invalid, lock. Add points on soft/hard drop.

Level: lines / 10 + 1.

Next piece: random.

Draw grid, blocks, piece.

Game over state: boolean, draw overlay.

Restart: R key or Enter.

Let me write complete file.

For keyboard handling: keydown listener, check keys based on state.

Alright, code carefully.

Drop timer based: lastTime, currentTime, accum dropInterval. Use fixed step maybe: setInterval style with delta in rAF.

Also handle piece lock-out: when piece locks, if any of cells is at y<0 (spawn area above), game over? Standard: if spawn collides game over. Let's do this: if new piece collides at spawn, game over.

Rows above come down when line is cleared: standard splice.

Flash effect on line clear? Optional; skip for simplicity, or add short flash. Let's keep simple — immediate clear.

Let me write the HTML now.