Refactor desktop codebase to reduce LOC and dead code

.gitignore

@@ -42,6 +42,9 @@ next-env.d.ts
 
 # wrangler
 .wrangler/
+.dev.vars
+.dev.vars.*
 
 github-banner.html
-clash-api-player-response.json
+clash-api-player-response.json
+.claude/

CLAUDE.md

@@ -12,24 +12,29 @@ bun run preview      # Build and preview Cloudflare deployment locally
 bun run deploy       # Build and deploy to Cloudflare Pages
 ```
 
+### Dev server is always running
+Assume `bun run dev` is already running in another terminal. Do **not** start it yourself. If you need to verify changes, ask the user to check in the browser, or use `bunx tsc --noEmit` for a type-only check.
+
 ## Architecture
 
 This is a minimal "coming soon" portfolio site themed after **Mac OS System 1 (1984)**. It has a single page with two states:
 
-1. **Boot Sequence** — Terminal-style loading animation (black background, white monospace text, sequential line reveals). Stored in `sessionStorage` so it only plays once per session.
+1. **Boot Sequence** — CRT flicker → Happy Mac icon on dithered gray background with startup sound. Stored in `sessionStorage` so it only plays once per session.
 2. **Welcome Screen** — "Welcome to Macintosh." dialog on a dithered gray desktop background with a decorative menu bar.
 
 ### Key Files
-- `app/page.tsx` — Client component with `BootSequence` and `WelcomeScreen` components
+- `app/page.tsx` — Client component with `BootScreen` and `WelcomeScreen` components
 - `app/global.css` — Mac OS 1984 theme (Chicago font, crosshatch pattern, dialog/menu styles)
 - `app/layout.tsx` — Minimal root layout with JetBrains Mono font
 - `app/lib/use-reduced-motion.ts` — Accessibility hook for animation preferences
-- `app/lib/utils.ts` — `cn()` utility (clsx + tailwind-merge)
 - `app/not-found.tsx` — Mac-style "system error" 404 page
 
 ### Content Archive
 All previous site content (projects, blog posts, timeline, skills) is preserved in `CONTENT-ARCHIVE.md` at the project root.
 
+### Implementation Plan
+The full desktop experience implementation plan is in `DESKTOP-PLAN.md` at the project root. Reference this file when creating plans, working on implementation, or briefing subagents. It contains all design decisions, architecture details, git/PR strategy, subagent contracts, and a progress tracker.
+
 ## Code Style
 
 ### Collocate Everything
@@ -47,10 +52,7 @@ This project uses **Tailwind CSS v4 alpha** with `@tailwindcss/postcss`. There i
 There is only one theme. CSS variables use standard hex values (not RGB triplets). There are no `data-theme` attributes, no theme switcher, no localStorage theme state.
 
 ### Chicago Bitmap Font
-The site uses ChicagoFLF (`public/fonts/ChicagoFLF.woff2`) for the Mac OS look. `--font-chicago` falls back to VT323 then monospace. Anti-aliasing is disabled (`-webkit-font-smoothing: none`) to preserve the bitmap aesthetic.
-
-### Two Wrangler Configs
-Both `wrangler.toml` and `wrangler.jsonc` exist at the root with identical settings. Edit both or consolidate.
+The site uses ChicagoFLF (`public/fonts/ChicagoFLF.woff`) for the Mac OS look. `--font-chicago` falls back to VT323 then monospace. Anti-aliasing is disabled (`-webkit-font-smoothing: none`) to preserve the bitmap aesthetic.
 
 ### No Test Framework
 There are no tests, no test runner, no test dependencies. Do not assume you can validate changes with automated tests.

CONTENT-ARCHIVE.md

@@ -342,15 +342,15 @@ Source: `app/blog/utils.ts`
 ### Post 1: Building Product for Humans, Not Metrics
 
 - **slug:** `building-for-humans`
-- **publishedAt:** 2025-01-15
+- **publishedAt:** 2026-01-15
 - **summary:** The best products measure success by whether people grew, not just whether numbers went up.
 
 **Full MDX content:**
 
 ```mdx
 ---
 title: 'Building Product for Humans, Not Metrics'
-publishedAt: '2025-01-15'
+publishedAt: '2026-01-15'
 summary: 'The best products measure success by whether people grew, not just whether numbers went up.'
 ---
 
@@ -949,7 +949,7 @@ googleBot:
 - `https://curlycloud.dev/history`
 
 **Blog routes (from posts):**
-- `https://curlycloud.dev/blog/building-for-humans` (lastModified: 2025-01-15)
+- `https://curlycloud.dev/blog/building-for-humans` (lastModified: 2026-01-15)
 - `https://curlycloud.dev/blog/generalism-future` (lastModified: 2025-02-10)
 - `https://curlycloud.dev/blog/physical-digital-tension` (lastModified: 2025-03-05)
 

MOBILE-PLAN.md

@@ -0,0 +1,42 @@
+# Mobile Experience — iPhone OS 1 (2007) Style
+
+> **Status**: Planning — to be built after desktop experience is complete.
+
+---
+
+## Vision
+
+On mobile viewports, replace the current welcome screen with an iPhone OS 1 (original iPhone, 2007) experience. Same apps as desktop, but wrapped in iPhone-native chrome instead of Mac OS windows.
+
+---
+
+## Key Differences from Desktop
+
+- **No draggable windows** — apps open full-screen, one at a time
+- **Springboard** — home screen with rounded app icon grid (4 columns)
+- **Slide to unlock** — replaces the boot sequence on mobile
+- **Status bar** — top bar with carrier name, time, battery (styled, not real)
+- **Home button** — tap to return to springboard
+- **No menu bar** — apps have their own navigation (back button, title bar)
+
+---
+
+## Assets
+
+User has assets ready: phone screen frame, logos, icons. To be shared when mobile phase begins.
+
+---
+
+## Shared Components
+
+App content components (Calculator logic, Notepad text area, etc.) should be reusable between desktop and mobile. Only the shell/chrome differs:
+- Desktop: `Window` component wraps app content
+- Mobile: full-screen view with iPhone OS navigation wraps same app content
+
+---
+
+## Implementation
+
+- Separate phase after desktop is fully merged to `main`
+- Own branch: `feat/mobile-iphone-os`
+- Responsive detection in `page.tsx` already exists (`isDesktop` state)

README.md

@@ -1,56 +1,26 @@
-# Portfolio & Blog
+# curlycloud.dev
 
-Personal portfolio and blog site showcasing my work as a generalist builder—bridging the gap between physical experiences and digital infrastructure.
+A Mac OS System 1 (1984) themed "coming soon" site for [curlycloud.dev](https://curlycloud.dev).
 
-Visit at: **https://curlycloud.dev**
+## Stack
 
-## About
+- Next.js 15 (App Router) + TypeScript
+- Tailwind CSS v4 alpha
+- Chicago bitmap font (`public/fonts/ChicagoFLF.woff`)
+- Deployed to Cloudflare Pages via OpenNext
 
-I build experiences—both digital and physical—for people who want more from life. Engineering background. Founder at ARK Experiences. Engineer, Developer and Entrepreneur.
-
-## Features
-
-- **Portfolio Showcase**: Interactive carousel displaying my projects and work
-- **Blog**: MDX and Markdown support for writing and sharing thoughts
-- **SEO Optimized**: Complete with sitemap, robots.txt, and JSON-LD schema
-- **RSS Feed**: Subscribe to stay updated with new posts
-- **Dynamic OG Images**: Automatically generated Open Graph images for social sharing
-- **Syntax Highlighting**: Beautiful code blocks in blog posts
-- **Dark Mode**: Theme switching with smooth transitions
-- **Modern Stack**: Built with Next.js 16, Tailwind v4, and TypeScript
-- **Performance**: Vercel Speed Insights and Web Analytics integrated
-
-## Tech Stack
-
-- **Framework**: Next.js 16 (App Router)
-- **Styling**: Tailwind CSS v4
-- **Content**: MDX with next-mdx-remote
-- **Deployment**: Cloudflare Pages (via OpenNext)
-- **Fonts**: Geist Sans & Geist Mono
-- **UI Components**: shadcn/ui
-
-## Development
-
-Install dependencies:
+## Develop
 
 ```bash
 bun install
+bun run dev      # http://localhost:3000
 ```
 
-Run the development server:
+## Build & deploy
 
 ```bash
-bun run dev
+bun run build    # Next.js production build
+bun run deploy   # OpenNext → Cloudflare Pages
 ```
 
-Build for production:
-
-```bash
-bun run build
-```
-
-Deploy to Cloudflare:
-
-```bash
-bun run deploy
-```
+See `CLAUDE.md` for architecture notes and `DESKTOP-PLAN.md` for the full implementation plan.

app/api/spotify/now-playing/route.ts

@@ -0,0 +1,164 @@
+export const dynamic = 'force-dynamic'
+export const revalidate = 0
+export const fetchCache = 'force-no-store'
+
+// Response headers that prevent both browser and Cloudflare edge from
+// caching the response. Without these, the Recently Played list can get
+// stuck on a stale copy from the first request even though the client
+// polls every 10s.
+const NO_CACHE_HEADERS = {
+  'Cache-Control': 'no-store, no-cache, must-revalidate, max-age=0',
+  'CDN-Cache-Control': 'no-store',
+  'Cloudflare-CDN-Cache-Control': 'no-store',
+} as const
+
+function json(body: unknown) {
+  return Response.json(body, { headers: NO_CACHE_HEADERS })
+}
+
+const bearerOpts = (token: string) =>
+  ({ headers: { Authorization: `Bearer ${token}` }, cache: 'no-store' as const })
+
+interface TopData {
+  genres: { name: string; count: number }[]
+  artists: { name: string; image: string | null; spotifyUrl: string | null }[]
+}
+
+function makeTrack(item: any, nowPlaying?: { progressMs: number }) {
+  return {
+    name: item.name ?? 'Unknown',
+    artist: (item.artists ?? []).map((a: any) => a.name).join(', '),
+    album: item.album?.name ?? '',
+    albumArt: item.album?.images?.[0]?.url ?? null,
+    spotifyUrl: item.external_urls?.spotify ?? null,
+    ...(nowPlaying && { progressMs: nowPlaying.progressMs, durationMs: item.duration_ms ?? 0 }),
+  }
+}
+
+async function fetchTopData(accessToken: string): Promise<TopData> {
+  try {
+    const opts = bearerOpts(accessToken)
+    // Two separate calls: short_term for genres (recent listening), long_term for artists (all time)
+    const [genreRes, artistRes] = await Promise.all([
+      fetch('https://api.spotify.com/v1/me/top/artists?limit=50&time_range=short_term', opts),
+      fetch('https://api.spotify.com/v1/me/top/artists?limit=50&time_range=long_term', opts),
+    ])
+
+    // Top 10 artists from long_term
+    let artists: TopData['artists'] = []
+    if (artistRes.ok) {
+      const data = await artistRes.json() as any
+      artists = (data.items ?? []).slice(0, 10).map((a: any) => ({
+        name: a.name ?? 'Unknown',
+        image: a.images?.[0]?.url ?? null,
+        spotifyUrl: a.external_urls?.spotify ?? null,
+      }))
+    }
+
+    // Top 10 genres from short_term, deduplicated
+    let genres: TopData['genres'] = []
+    if (genreRes.ok) {
+      const data = await genreRes.json() as any
+      const items: any[] = data.items ?? []
+
+      const raw = new Map<string, number>()
+      for (const artist of items) {
+        for (const genre of artist.genres ?? []) {
+          const key = genre.toLowerCase()
+          raw.set(key, (raw.get(key) ?? 0) + 1)
+        }
+      }
+
+      // Merge entries where one is the other + trailing "s"
+      const merged = new Map<string, number>()
+      const keys = Array.from(raw.keys()).sort((a, b) => (raw.get(b) ?? 0) - (raw.get(a) ?? 0))
+      const consumed = new Set<string>()
+      for (const key of keys) {
+        if (consumed.has(key)) continue
+        let count = raw.get(key) ?? 0
+        const singular = key.endsWith('s') ? key.slice(0, -1) : null
+        const plural = key + 's'
+        if (singular && raw.has(singular) && !consumed.has(singular)) {
+          count += raw.get(singular) ?? 0
+          consumed.add(singular)
+        }
+        if (raw.has(plural) && !consumed.has(plural)) {
+          count += raw.get(plural) ?? 0
+          consumed.add(plural)
+        }
+        consumed.add(key)
+        const label = key.charAt(0).toUpperCase() + key.slice(1)
+        merged.set(label, count)
+      }
+
+      genres = Array.from(merged.entries())
+        .sort((a, b) => b[1] - a[1])
+        .slice(0, 5)
+        .map(([name, count]) => ({ name, count }))
+    }
+
+    return { genres, artists }
+  } catch {
+    return { genres: [], artists: [] }
+  }
+}
+
+export async function GET() {
+  const clientId = process.env.SPOTIFY_CLIENT_ID
+  const clientSecret = process.env.SPOTIFY_CLIENT_SECRET
+  const refreshToken = process.env.SPOTIFY_REFRESH_TOKEN
+
+  if (!clientId || !clientSecret || !refreshToken) {
+    return json({ error: 'Spotify env vars not configured', isPlaying: false, track: null })
+  }
+
+  // 1. Exchange refresh token for access token
+  const tokenRes = await fetch('https://accounts.spotify.com/api/token', {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded',
+      'Authorization': 'Basic ' + btoa(`${clientId}:${clientSecret}`),
+    },
+    body: new URLSearchParams({ grant_type: 'refresh_token', refresh_token: refreshToken }),
+  })
+
+  if (!tokenRes.ok) return json({ error: 'Spotify token refresh failed', isPlaying: false, track: null })
+
+  const { access_token } = await tokenRes.json() as { access_token: string }
+
+  // 2. Fetch currently playing
+  const nowRes = await fetch('https://api.spotify.com/v1/me/player/currently-playing', bearerOpts(access_token))
+
+  // Fetch top genres in parallel with the currently-playing check
+  const topPromise = fetchTopData(access_token)
+
+  // 204 = nothing playing, 202 = processing
+  if (nowRes.status === 204 || nowRes.status === 202) {
+    const recentRes = await fetch('https://api.spotify.com/v1/me/player/recently-played?limit=1', bearerOpts(access_token))
+    let lastTrack: any = null
+    if (recentRes.ok) {
+      const data = await recentRes.json() as any
+      const first = (data.items ?? [])[0]
+      if (first?.track) lastTrack = makeTrack(first.track)
+    }
+    return json({ isPlaying: false, track: lastTrack, ...await topPromise })
+  }
+
+  if (!nowRes.ok) {
+    const top = await topPromise
+    return json({ error: 'Spotify currently-playing failed', isPlaying: false, track: null, ...top })
+  }
+
+  const nowData = await nowRes.json() as any
+  const item = nowData?.item
+  if (!item) {
+    const top2 = await topPromise
+    return json({ isPlaying: false, track: null, ...top2 })
+  }
+
+  return json({
+    isPlaying: nowData.is_playing === true,
+    track: makeTrack(item, { progressMs: nowData.progress_ms ?? 0 }),
+    ...await topPromise,
+  })
+}