[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_190":191,"_192":193},"routes/_app.x.$handle.$name",{"_101":100,"_32":46,"_110":91,"_27":111,"_13":14,"_112":-5,"_11":113,"_114":115,"_116":117,"_118":119,"_120":121,"_20":-5,"_122":-5,"_123":-5,"_124":25,"_125":126,"_127":60,"_128":-5,"_129":-5,"_130":131},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_44":45,"_32":46,"_39":47,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":54,"_55":-5,"_18":56,"_57":58,"_59":60,"_61":-5,"_62":-5,"_63":64,"_65":66,"_67":68,"_69":70,"_71":72,"_73":-5,"_74":75,"_76":75,"_77":78,"_79":78,"_80":78,"_81":75,"_82":75,"_83":84,"_85":86,"_87":88,"_89":25},"version",8,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":38,"_39":40,"_41":14,"_42":43,"_24":25},"previous",{"_30":31,"_32":33,"_34":35,"_36":37},"deleted",false,"deletedHere","path","frontend/App.tsx","latestPath","fileId","1bc2a470-42f5-11f1-b3b6-42b51c65c3df","name","App.tsx","fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { useState, useEffect, useRef } from \"https://esm.sh/react@18.2.0\";\n\n// ── Types ─────────────────────────────────────────────────────────────────────\ntype SegType = \"warmup\" | \"run\" | \"walk\" | \"cooldown\";\ntype Seg = { type: SegType; secs: number };\ntype SessionPlan = { segments: Seg[] };\ntype LoggedSession = {\n id: number; week: number; session: number;\n completed_at: string; effort: number | null; notes: string | null;\n};\ntype View = \"home\" | \"timer\" | \"log\";\n\n// ── Palette ───────────────────────────────────────────────────────────────────\nconst P = {\n bg: \"#111318\",\n surface: \"#1a1d24\",\n surfaceHi: \"#21252e\",\n border: \"#282c35\",\n borderHi: \"#363c48\",\n text: \"#f4f6fa\",\n textSub: \"#8892a4\",\n textMut: \"#525c6e\",\n run: \"#ff6535\",\n walk: \"#00c8e0\",\n neutral: \"#6b7a8d\",\n done: \"#34d399\",\n doneBg: \"#0d2018\",\n doneBdr: \"#1a4030\",\n cta: \"#ff6535\",\n ctaText: \"#ffffff\",\n};\n\n// ── Plan data ─────────────────────────────────────────────────────────────────\nconst R = (s: number): Seg => ({ type: \"run\", secs: s });\nconst W = (s: number): Seg => ({ type: \"walk\", secs: s });\nconst WU: Seg = { type: \"warmup\", secs: 300 };\nconst CD: Seg = { type: \"cooldown\", secs: 300 };\nconst rep = (segs: Seg[], n: number): Seg[] => Array.from({ length: n }, () => segs).flat();\nconst mk = (segs: Seg[]): SessionPlan => ({ segments: [WU, ...segs, CD] });\nconst x3 = (s: SessionPlan): SessionPlan[] => [s, s, s];\n\nconst PLAN: SessionPlan[][] = [\n x3(mk(rep([R(60), W(90)], 8))),\n x3(mk(rep([R(90), W(120)], 6))),\n x3(mk(rep([R(90), W(90), R(180), W(180)], 2))),\n x3(mk([R(180), W(90), R(300), W(150), R(180), W(90), R(300)])),\n [\n mk([R(300), W(180), R(300), W(180), R(300)]),\n mk([R(480), W(300), R(480)]),\n mk([R(1200)]),\n ],\n [\n mk([R(300), W(180), R(480), W(180), R(300)]),\n mk([R(600), W(180), R(600)]),\n mk([R(1500)]),\n ],\n x3(mk([R(1500)])),\n x3(mk([R(1800)])),\n];\n\n// ── Helpers ───────────────────────────────────────────────────────────────────\nconst fmt = (s: number) => `${Math.floor(s / 60)}:${(s % 60).toString().padStart(2, \"0\")}`;\nconst totalSecs = (p: SessionPlan) => p.segments.reduce((a, s) => a + s.secs, 0);\nconst totalRunSecs = (p: SessionPlan) => p.segments.filter(s => s.type === \"run\").reduce((a, s) => a + s.secs, 0);\n\nconst SEG_COLOR: Record = {\n run: P.run, walk: P.walk, warmup: P.neutral, cooldown: P.neutral,\n};\nconst SEG_LABEL: Record = {\n run: \"RUN\", walk: \"WALK\", warmup: \"WARM UP\", cooldown: \"COOL DOWN\",\n};\nconst EFFORT_ICONS = [\"😴\", \"😐\", \"🙂\", \"💪\", \"🔥\"];\n\n// ── App ───────────────────────────────────────────────────────────────────────\nfunction App() {\n const [view, setView] = useState(\"home\");\n const [week, setWeek] = useState(1);\n const [sessionIdx, setSessionIdx] = useState(0);\n const [logs, setLogs] = useState([]);\n\n const [segIdx, setSegIdx] = useState(0);\n const [secsLeft, setSecsLeft] = useState(0);\n const [paused, setPaused] = useState(false);\n const intervalRef = useRef(null);\n\n const [effort, setEffort] = useState(3);\n const [notes, setNotes] = useState(\"\");\n\n useEffect(() => { fetchLogs(); }, []);\n\n async function fetchLogs() {\n const r = await fetch(\"/api/sessions\");\n setLogs(await r.json());\n }\n\n const isDone = (w: number, s: number) => logs.some(l => l.week === w && l.session === s);\n const getLog = (w: number, s: number) => logs.find(l => l.week === w && l.session === s);\n\n function startSession(w: number, si: number) {\n const plan = PLAN[w - 1][si];\n setWeek(w); setSessionIdx(si);\n setSegIdx(0); setSecsLeft(plan.segments[0].secs);\n setPaused(false);\n setView(\"timer\");\n }\n\n useEffect(() => {\n if (view !== \"timer\" || paused) {\n if (intervalRef.current) clearInterval(intervalRef.current);\n return;\n }\n intervalRef.current = window.setInterval(() => {\n setSecsLeft(p => (p <= 1 ? 0 : p - 1));\n }, 1000);\n return () => { if (intervalRef.current) clearInterval(intervalRef.current); };\n }, [view, paused, segIdx]);\n\n useEffect(() => {\n if (view !== \"timer\" || secsLeft !== 0) return;\n const plan = PLAN[week - 1][sessionIdx];\n const next = segIdx + 1;\n if (next >= plan.segments.length) {\n setView(\"log\");\n } else {\n setSegIdx(next); setSecsLeft(plan.segments[next].secs);\n }\n }, [secsLeft]);\n\n async function saveLog() {\n await fetch(\"/api/sessions\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ week, session: sessionIdx + 1, effort, notes }),\n });\n await fetchLogs();\n setNotes(\"\"); setEffort(3);\n setView(\"home\");\n }\n\n if (view === \"timer\") return (\n setPaused(p => !p)}\n onStop={() => { setPaused(true); setView(\"home\"); }}\n onDone={() => setView(\"log\")}\n />\n );\n\n if (view === \"log\") return (\n setView(\"home\")}\n />\n );\n\n const weekLogs = logs.filter(l => l.week === week).length;\n\n return (\n

\n\n {/* Header */}\n

C25K

GTN · 8 WEEKS · 3×/WEEK

\n source\n

\n\n \n\n {/* Week grid */}\n

\n SELECT WEEK\n

\n {Array.from({ length: 8 }, (_, i) => {\n const w = i + 1;\n const done = logs.filter(l => l.week === w).length >= 3;\n const active = w === week;\n return (\n \n );\n })}\n

\n\n {/* Session cards */}\n

\n WEEK {week} · {weekLogs}/3 DONE\n

\n {PLAN[week - 1].map((plan, si) => (\n startSession(week, si)}\n />\n ))}\n

\n );\n}\n\n// ── Session Card ──────────────────────────────────────────────────────────────\nfunction SessionCard({ plan, idx, done, log, onStart }: {\n plan: SessionPlan; idx: number; done: boolean;\n log: LoggedSession | undefined; onStart: () => void;\n}) {\n return (\n

\n {done ? \"✓\" : idx + 1}\n

\n\n

\n Session {idx + 1}\n

\n {fmt(totalSecs(plan))}\n {fmt(totalRunSecs(plan))} run\n

\n {plan.segments.map((s, i) => (\n

\n ))}\n

\n {log && (\n

\n {new Date(log.completed_at).toLocaleDateString(\"en-IN\", { day: \"numeric\", month: \"short\" })}\n {log.effort ? ` · ${EFFORT_ICONS[log.effort - 1]}` : \"\"}\n {log.notes ? ` · ${log.notes.slice(0, 38)}` : \"\"}\n

\n )}\n

\n\n \n

\n );\n}\n\n// ── Progress Bar ──────────────────────────────────────────────────────────────\nfunction ProgressBar({ logs }: { logs: LoggedSession[] }) {\n if (logs.length === 0) return null;\n return (\n

\n {PLAN.map((_, wi) =>\n [0, 1, 2].map(si => {\n const done = logs.some(l => l.week === wi + 1 && l.session === si + 1);\n return (\n

\n );\n })\n )}\n

\n {logs.length}/24 SESSIONS · {Math.round((logs.length / 24) * 100)}% COMPLETE\n

\n );\n}\n\n// ── Timer View ────────────────────────────────────────────────────────────────\nfunction TimerView({ week, sessionIdx, segIdx, secsLeft, paused, onPause, onStop, onDone }: {\n week: number; sessionIdx: number; segIdx: number; secsLeft: number;\n paused: boolean; onPause: () => void; onStop: () => void; onDone: () => void;\n}) {\n const plan = PLAN[week - 1][sessionIdx];\n const seg = plan.segments[segIdx];\n const nextSeg = plan.segments[segIdx + 1];\n const progress = seg ? 1 - secsLeft / seg.secs : 1;\n const elapsed = plan.segments.slice(0, segIdx).reduce((a, s) => a + s.secs, 0) + (seg ? seg.secs - secsLeft : 0);\n const overallPct = elapsed / totalSecs(plan);\n const C = SEG_COLOR[seg?.type ?? \"run\"];\n const R_C = 84;\n const circ = 2 * Math.PI * R_C;\n\n return (\n

\n \n

\n W{week} · S{sessionIdx + 1} | {segIdx + 1}/{plan.segments.length}\n

\n\n {/* Overall progress */}\n

\n\n

\n {SEG_LABEL[seg?.type ?? \"run\"]}\n

\n\n {/* Ring */}\n

\n \n

\n {fmt(secsLeft)}\n

\n {paused &&

PAUSED

}\n

\n\n {/* Dots */}\n

\n {plan.segments.map((s, i) => (\n

\n ))}\n

\n\n {/* Next */}\n {nextSeg ? (\n

\n NEXT\n

\n \n {SEG_LABEL[nextSeg.type]}\n \n {fmt(nextSeg.secs)}\n

\n ) :

}\n\n \n

\n );\n}\n\n// ── Log View ──────────────────────────────────────────────────────────────────\nfunction LogView({ week, sessionIdx, effort, notes, onEffort, onNotes, onSave, onSkip }: {\n week: number; sessionIdx: number; effort: number; notes: string;\n onEffort: (n: number) => void; onNotes: (s: string) => void;\n onSave: () => void; onSkip: () => void;\n}) {\n return (\n

\n DONE!\n

\n WEEK {week} · SESSION {sessionIdx + 1}\n

\n\n

\n HOW DID IT FEEL?\n

\n {EFFORT_ICONS.map((icon, i) => (\n \n ))}\n

\n\n

\n NOTES\n

onNotes(e.target.value)}\n          placeholder=\"How did the run feel? Any pain? Weather?\"\n          rows={3}\n          style={{\n            width: \"100%\", background: P.surface, border: `1px solid ${P.border}`,\n            borderRadius: 8, padding: \"12px 14px\", color: P.text,\n            fontSize: 14, resize: \"vertical\", outline: \"none\", lineHeight: 1.6,\n          }}\n        />\n      </div>\n\n      <div style={{ display: \"flex\", gap: 10 }}>\n        <button onClick={onSkip} style={{\n          padding: \"15px 18px\", borderRadius: 10, cursor: \"pointer\",\n          border: `1px solid ${P.border}`, background: \"transparent\",\n          color: P.textMut, fontSize: 12, letterSpacing: \"0.08em\",\n        }}>SKIP</button>\n        <button onClick={onSave} style={{\n          flex: 1, padding: \"15px\", borderRadius: 10, cursor: \"pointer\",\n          border: \"none\", background: P.cta,\n          color: P.ctaText, fontSize: 18, fontWeight: 700, letterSpacing: \"0.06em\",\n        }}>SAVE RUN</button>\n      </div>\n    </div>\n  );\n}\n\n// ── Label ─────────────────────────────────────────────────────────────────────\nfunction Label({ children }: { children: React.ReactNode }) {\n  return (\n    <div className=\"tf\" style={{ fontSize: 10, color: P.textMut, letterSpacing: \"0.12em\", marginBottom: 12 }}>\n      {children}\n    </div>\n  );\n}\n\n// ── Mount ─────────────────────────────────────────────────────────────────────\nconst root = createRoot(document.getElementById(\"root\")!);\nroot.render(<App />);\n","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { useState, useEffect, useRef, useCallback } from \"https://esm.sh/react@18.2.0\";\n\n// ── Types ─────────────────────────────────────────────────────────────────────\ntype SegType = \"warmup\" | \"run\" | \"walk\" | \"cooldown\";\ntype Seg = { type: SegType; secs: number };\ntype SessionPlan = { segments: Seg[] };\ntype LoggedSession = {\n  id: number; week: number; session: number;\n  completed_at: string; effort: number | null; notes: string | null;\n};\ntype View = \"home\" | \"timer\" | \"log\";\n\n// ── Palette ───────────────────────────────────────────────────────────────────\nconst P = {\n  bg: \"#111318\", surface: \"#1a1d24\", surfaceHi: \"#21252e\",\n  border: \"#282c35\", borderHi: \"#363c48\",\n  text: \"#f4f6fa\", textSub: \"#8892a4\", textMut: \"#525c6e\",\n  run: \"#ff6535\", walk: \"#00c8e0\", neutral: \"#6b7a8d\",\n  done: \"#34d399\", doneBg: \"#0d2018\", doneBdr: \"#1a4030\",\n  cta: \"#ff6535\", ctaText: \"#ffffff\",\n};\n\n// ── Plan data ─────────────────────────────────────────────────────────────────\nconst R = (s: number): Seg => ({ type: \"run\", secs: s });\nconst W = (s: number): Seg => ({ type: \"walk\", secs: s });\nconst WU: Seg = { type: \"warmup\", secs: 300 };\nconst CD: Seg = { type: \"cooldown\", secs: 300 };\nconst rep = (segs: Seg[], n: number): Seg[] => Array.from({ length: n }, () => segs).flat();\nconst mk = (segs: Seg[]): SessionPlan => ({ segments: [WU, ...segs, CD] });\nconst x3 = (s: SessionPlan): SessionPlan[] => [s, s, s];\n\nconst PLAN: SessionPlan[][] = [\n  x3(mk(rep([R(60), W(90)], 8))),\n  x3(mk(rep([R(90), W(120)], 6))),\n  x3(mk(rep([R(90), W(90), R(180), W(180)], 2))),\n  x3(mk([R(180), W(90), R(300), W(150), R(180), W(90), R(300)])),\n  [\n    mk([R(300), W(180), R(300), W(180), R(300)]),\n    mk([R(480), W(300), R(480)]),\n    mk([R(1200)]),\n  ],\n  [\n    mk([R(300), W(180), R(480), W(180), R(300)]),\n    mk([R(600), W(180), R(600)]),\n    mk([R(1500)]),\n  ],\n  x3(mk([R(1500)])),\n  x3(mk([R(1800)])),\n];\n\n// ── Helpers ───────────────────────────────────────────────────────────────────\nconst fmt = (s: number) => `${Math.floor(s / 60)}:${(s % 60).toString().padStart(2, \"0\")}`;\nconst totalSecs = (p: SessionPlan) => p.segments.reduce((a, s) => a + s.secs, 0);\nconst totalRunSecs = (p: SessionPlan) => p.segments.filter(s => s.type === \"run\").reduce((a, s) => a + s.secs, 0);\n\nconst SEG_COLOR: Record<SegType, string> = {\n  run: P.run, walk: P.walk, warmup: P.neutral, cooldown: P.neutral,\n};\nconst SEG_LABEL: Record<SegType, string> = {\n  run: \"RUN\", walk: \"WALK\", warmup: \"WARM UP\", cooldown: \"COOL DOWN\",\n};\nconst EFFORT_ICONS = [\"😴\", \"😐\", \"🙂\", \"💪\", \"🔥\"];\n\n// ── Audio engine ──────────────────────────────────────────────────────────────\n// Uses Web Audio API oscillators — synthesized tones that MIX with music\n// (no media session interference). Must be initialized on a user gesture.\nfunction createAudioEngine() {\n  let ctx: AudioContext | null = null;\n\n  function getCtx(): AudioContext {\n    if (!ctx || ctx.state === \"closed\") {\n      ctx = new AudioContext();\n    }\n    if (ctx.state === \"suspended\") ctx.resume();\n    return ctx;\n  }\n\n  function beep(\n    freqs: number[],         // sequence of frequencies\n    duration: number,        // ms per tone\n    type: OscillatorType = \"sine\",\n    volume = 0.25,\n  ) {\n    const ac = getCtx();\n    const now = ac.currentTime;\n    freqs.forEach((freq, i) => {\n      const osc = ac.createOscillator();\n      const gain = ac.createGain();\n      osc.connect(gain);\n      gain.connect(ac.destination);\n      osc.type = type;\n      osc.frequency.value = freq;\n      const t = now + i * (duration / 1000);\n      const end = t + duration / 1000 - 0.02;\n      gain.gain.setValueAtTime(0, t);\n      gain.gain.linearRampToValueAtTime(volume, t + 0.01);\n      gain.gain.setValueAtTime(volume, end - 0.05);\n      gain.gain.linearRampToValueAtTime(0, end);\n      osc.start(t);\n      osc.stop(end);\n    });\n  }\n\n  return {\n    // Initialise (call on user gesture so iOS allows audio)\n    init() { getCtx(); },\n\n    // Three rising tones — \"go run\"\n    playRun()     { beep([523, 659, 784], 180, \"triangle\", 0.3); },\n\n    // Two falling tones — \"slow down\"\n    playWalk()    { beep([523, 392], 200, \"triangle\", 0.25); },\n\n    // Single soft beep — warmup/cooldown\n    playNeutral() { beep([440], 200, \"sine\", 0.2); },\n\n    // Three rapid beeps — 10-second warning\n    playWarning() { beep([880, 880, 880], 120, \"sine\", 0.2); },\n\n    // Ascending fanfare — done\n    playDone()    { beep([523, 659, 784, 1047], 220, \"triangle\", 0.3); },\n  };\n}\n\nconst audio = createAudioEngine();\n\nfunction triggerCue(type: SegType) {\n  if      (type === \"run\")      audio.playRun();\n  else if (type === \"walk\")     audio.playWalk();\n  else                          audio.playNeutral();\n  // Vibration: short for walk, double-tap for run (Android only, silent on iOS)\n  if (\"vibrate\" in navigator) {\n    navigator.vibrate(type === \"run\" ? [80, 60, 80] : [120]);\n  }\n}\n\n// ── Wake Lock ─────────────────────────────────────────────────────────────────\n// Keeps screen on while timer runs. Re-acquires on visibility change.\nfunction useWakeLock(active: boolean) {\n  const lockRef = useRef<WakeLockSentinel | null>(null);\n\n  const acquire = useCallback(async () => {\n    if (!(\"wakeLock\" in navigator)) return;\n    try {\n      lockRef.current = await (navigator as any).wakeLock.request(\"screen\");\n    } catch (_) { /* unsupported or denied — silent fail */ }\n  }, []);\n\n  const release = useCallback(() => {\n    lockRef.current?.release();\n    lockRef.current = null;\n  }, []);\n\n  useEffect(() => {\n    if (active) {\n      acquire();\n      // Re-acquire when tab becomes visible again\n      const onVisible = () => { if (document.visibilityState === \"visible\") acquire(); };\n      document.addEventListener(\"visibilitychange\", onVisible);\n      return () => { release(); document.removeEventListener(\"visibilitychange\", onVisible); };\n    } else {\n      release();\n    }\n  }, [active]);\n}\n\n// ── App ───────────────────────────────────────────────────────────────────────\nfunction App() {\n  const [view, setView] = useState<View>(\"home\");\n  const [week, setWeek] = useState(1);\n  const [sessionIdx, setSessionIdx] = useState(0);\n  const [logs, setLogs] = useState<LoggedSession[]>([]);\n\n  const [segIdx, setSegIdx] = useState(0);\n  const [secsLeft, setSecsLeft] = useState(0);\n  const [paused, setPaused] = useState(false);\n  const [muted, setMuted] = useState(false);\n  const intervalRef = useRef<number | null>(null);\n  const mutedRef = useRef(false);\n\n  const [effort, setEffort] = useState(3);\n  const [notes, setNotes] = useState(\"\");\n\n  // Keep mutedRef in sync so timer closure always sees latest value\n  useEffect(() => { mutedRef.current = muted; }, [muted]);\n\n  useEffect(() => { fetchLogs(); }, []);\n\n  async function fetchLogs() {\n    const r = await fetch(\"/api/sessions\");\n    setLogs(await r.json());\n  }\n\n  const isDone = (w: number, s: number) => logs.some(l => l.week === w && l.session === s);\n  const getLog  = (w: number, s: number) => logs.find(l => l.week === w && l.session === s);\n\n  function startSession(w: number, si: number) {\n    audio.init(); // unlock AudioContext on user gesture\n    const plan = PLAN[w - 1][si];\n    setWeek(w); setSessionIdx(si);\n    setSegIdx(0); setSecsLeft(plan.segments[0].secs);\n    setPaused(false);\n    setView(\"timer\");\n    if (!mutedRef.current) triggerCue(plan.segments[0].type);\n  }\n\n  // Timer tick\n  useEffect(() => {\n    if (view !== \"timer\" || paused) {\n      if (intervalRef.current) clearInterval(intervalRef.current);\n      return;\n    }\n    intervalRef.current = window.setInterval(() => {\n      setSecsLeft(p => (p <= 1 ? 0 : p - 1));\n    }, 1000);\n    return () => { if (intervalRef.current) clearInterval(intervalRef.current); };\n  }, [view, paused, segIdx]);\n\n  // 10-second warning\n  useEffect(() => {\n    if (view !== \"timer\" || paused || mutedRef.current) return;\n    if (secsLeft === 10) audio.playWarning();\n  }, [secsLeft]);\n\n  // Segment advance\n  useEffect(() => {\n    if (view !== \"timer\" || secsLeft !== 0) return;\n    const plan = PLAN[week - 1][sessionIdx];\n    const next = segIdx + 1;\n    if (next >= plan.segments.length) {\n      if (!mutedRef.current) audio.playDone();\n      if (\"vibrate\" in navigator) navigator.vibrate([100, 80, 100, 80, 200]);\n      setView(\"log\");\n    } else {\n      setSegIdx(next);\n      setSecsLeft(plan.segments[next].secs);\n      if (!mutedRef.current) triggerCue(plan.segments[next].type);\n    }\n  }, [secsLeft]);\n\n  async function saveLog() {\n    await fetch(\"/api/sessions\", {\n      method: \"POST\",\n      headers: { \"Content-Type\": \"application/json\" },\n      body: JSON.stringify({ week, session: sessionIdx + 1, effort, notes }),\n    });\n    await fetchLogs();\n    setNotes(\"\"); setEffort(3);\n    setView(\"home\");\n  }\n\n  if (view === \"timer\") return (\n    <TimerView\n      week={week} sessionIdx={sessionIdx} segIdx={segIdx}\n      secsLeft={secsLeft} paused={paused} muted={muted}\n      onPause={() => setPaused(p => !p)}\n      onMute={() => setMuted(m => !m)}\n      onStop={() => { setPaused(true); setView(\"home\"); }}\n    />\n  );\n\n  if (view === \"log\") return (\n    <LogView week={week} sessionIdx={sessionIdx} effort={effort} notes={notes}\n      onEffort={setEffort} onNotes={setNotes} onSave={saveLog} onSkip={() => setView(\"home\")}\n    />\n  );\n\n  const weekLogs = logs.filter(l => l.week === week).length;\n\n  return (\n    <div style={{ minHeight: \"100vh\", background: P.bg, maxWidth: 480, margin: \"0 auto\", padding: \"24px 18px\" }}>\n      <div style={{ display: \"flex\", justifyContent: \"space-between\", alignItems: \"flex-start\", marginBottom: 26 }}>\n        <div>\n          <div className=\"tf\" style={{ fontSize: 30, fontWeight: 700, color: P.run, letterSpacing: \"0.06em\", lineHeight: 1 }}>C25K</div>\n          <div style={{ fontSize: 11, color: P.textMut, letterSpacing: \"0.1em\", marginTop: 4 }}>GTN · 8 WEEKS · 3×/WEEK</div>\n        </div>\n        <a href=\"/source\" style={{ fontSize: 10, color: P.textMut, textDecoration: \"none\", marginTop: 6 }}>source</a>\n      </div>\n\n      <ProgressBar logs={logs} />\n\n      <div style={{ marginBottom: 24 }}>\n        <Label>SELECT WEEK</Label>\n        <div style={{ display: \"grid\", gridTemplateColumns: \"repeat(4, 1fr)\", gap: 8 }}>\n          {Array.from({ length: 8 }, (_, i) => {\n            const w = i + 1;\n            const done = logs.filter(l => l.week === w).length >= 3;\n            const active = w === week;\n            return (\n              <button key={w} onClick={() => setWeek(w)} style={{\n                padding: \"12px 0\", borderRadius: 8, cursor: \"pointer\",\n                border: active ? `2px solid ${P.run}` : `1px solid ${done ? P.doneBdr : P.border}`,\n                background: active ? `${P.run}18` : done ? P.doneBg : P.surface,\n                color: active ? P.run : done ? P.done : P.textSub,\n                fontSize: 15, fontWeight: 600, letterSpacing: \"0.04em\", position: \"relative\",\n              }}>\n                W{w}\n                {done && <span style={{ position: \"absolute\", top: 4, right: 5, fontSize: 8, color: P.done }}>✓</span>}\n              </button>\n            );\n          })}\n        </div>\n      </div>\n\n      <div>\n        <Label>WEEK {week}  ·  {weekLogs}/3 DONE</Label>\n        <div style={{ display: \"flex\", flexDirection: \"column\", gap: 8 }}>\n          {PLAN[week - 1].map((plan, si) => (\n            <SessionCard key={si} plan={plan} idx={si}\n              done={isDone(week, si + 1)} log={getLog(week, si + 1)}\n              onStart={() => startSession(week, si)}\n            />\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n}\n\n// ── Session Card ──────────────────────────────────────────────────────────────\nfunction SessionCard({ plan, idx, done, log, onStart }: {\n  plan: SessionPlan; idx: number; done: boolean;\n  log: LoggedSession | undefined; onStart: () => void;\n}) {\n  return (\n    <div style={{\n      background: done ? P.doneBg : P.surface, borderRadius: 10,\n      border: `1px solid ${done ? P.doneBdr : P.border}`,\n      padding: \"14px 16px\", display: \"flex\", alignItems: \"center\", gap: 14,\n    }}>\n      <div className=\"tf\" style={{\n        width: 38, height: 38, borderRadius: 7, flexShrink: 0,\n        border: `1px solid ${done ? P.doneBdr : P.borderHi}`,\n        background: done ? \"#112a1e\" : P.surfaceHi,\n        display: \"flex\", alignItems: \"center\", justifyContent: \"center\",\n        fontSize: 17, fontWeight: 700, color: done ? P.done : P.textMut,\n      }}>\n        {done ? \"✓\" : idx + 1}\n      </div>\n      <div style={{ flex: 1, minWidth: 0 }}>\n        <div style={{ fontSize: 14, fontWeight: 500, color: done ? P.textSub : P.text, marginBottom: 3 }}>\n          Session {idx + 1}\n        </div>\n        <div style={{ fontSize: 12, color: P.textMut, display: \"flex\", gap: 10, marginBottom: 7 }}>\n          <span>{fmt(totalSecs(plan))}</span>\n          <span style={{ color: P.run + \"cc\" }}>{fmt(totalRunSecs(plan))} run</span>\n        </div>\n        <div style={{ display: \"flex\", gap: 2, height: 5 }}>\n          {plan.segments.map((s, i) => (\n            <div key={i} style={{\n              flex: s.secs, height: 5, borderRadius: 3,\n              background: done ? SEG_COLOR[s.type] + \"55\" : SEG_COLOR[s.type] + \"99\",\n            }} />\n          ))}\n        </div>\n        {log && (\n          <div style={{ fontSize: 11, color: P.textMut, marginTop: 6 }}>\n            {new Date(log.completed_at).toLocaleDateString(\"en-IN\", { day: \"numeric\", month: \"short\" })}\n            {log.effort ? ` · ${EFFORT_ICONS[log.effort - 1]}` : \"\"}\n            {log.notes ? ` · ${log.notes.slice(0, 38)}` : \"\"}\n          </div>\n        )}\n      </div>\n      <button onClick={onStart} style={{\n        padding: \"10px 14px\", borderRadius: 8, border: done ? `1px solid ${P.doneBdr}` : \"none\",\n        cursor: \"pointer\", background: done ? P.doneBg : P.cta,\n        color: done ? P.done : P.ctaText,\n        fontSize: 13, fontWeight: 700, letterSpacing: \"0.05em\", flexShrink: 0,\n      }}>\n        {done ? \"REDO\" : \"START\"}\n      </button>\n    </div>\n  );\n}\n\n// ── Progress Bar ──────────────────────────────────────────────────────────────\nfunction ProgressBar({ logs }: { logs: LoggedSession[] }) {\n  if (logs.length === 0) return null;\n  return (\n    <div style={{ marginBottom: 26 }}>\n      <div style={{ display: \"flex\", gap: 3, marginBottom: 6 }}>\n        {PLAN.map((_, wi) =>\n          [0, 1, 2].map(si => {\n            const done = logs.some(l => l.week === wi + 1 && l.session === si + 1);\n            return <div key={`${wi}-${si}`} style={{ flex: 1, height: 5, borderRadius: 3, background: done ? P.done : P.border }} />;\n          })\n        )}\n      </div>\n      <div style={{ fontSize: 11, color: P.textMut, letterSpacing: \"0.08em\" }}>\n        {logs.length}/24 SESSIONS · {Math.round((logs.length / 24) * 100)}% COMPLETE\n      </div>\n    </div>\n  );\n}\n\n// ── Timer View ────────────────────────────────────────────────────────────────\nfunction TimerView({ week, sessionIdx, segIdx, secsLeft, paused, muted, onPause, onMute, onStop }: {\n  week: number; sessionIdx: number; segIdx: number; secsLeft: number;\n  paused: boolean; muted: boolean;\n  onPause: () => void; onMute: () => void; onStop: () => void;\n}) {\n  // Wake lock: keep screen on while timer is active\n  useWakeLock(!paused);\n\n  const plan = PLAN[week - 1][sessionIdx];\n  const seg = plan.segments[segIdx];\n  const nextSeg = plan.segments[segIdx + 1];\n  const progress = seg ? 1 - secsLeft / seg.secs : 1;\n  const elapsed = plan.segments.slice(0, segIdx).reduce((a, s) => a + s.secs, 0) + (seg ? seg.secs - secsLeft : 0);\n  const overallPct = elapsed / totalSecs(plan);\n  const C = SEG_COLOR[seg?.type ?? \"run\"];\n  const R_C = 84;\n  const circ = 2 * Math.PI * R_C;\n  const warning = secsLeft <= 10 && secsLeft > 0 && !paused;\n\n  return (\n    <div style={{\n      minHeight: \"100vh\", background: P.bg, maxWidth: 480, margin: \"0 auto\",\n      display: \"flex\", flexDirection: \"column\", padding: \"20px 18px\",\n    }}>\n      {/* Top bar */}\n      <div style={{ display: \"flex\", justifyContent: \"space-between\", alignItems: \"center\", marginBottom: 14 }}>\n        <button onClick={onStop} style={{\n          background: \"none\", border: `1px solid ${P.border}`, color: P.textSub,\n          padding: \"8px 14px\", borderRadius: 6, cursor: \"pointer\", fontSize: 11, letterSpacing: \"0.08em\",\n        }}>STOP</button>\n        <div style={{ fontSize: 12, color: P.textMut }}>\n          W{week} · S{sessionIdx + 1}  |  {segIdx + 1}/{plan.segments.length}\n        </div>\n        {/* Mute toggle */}\n        <button onClick={onMute} style={{\n          background: muted ? `${P.textMut}22` : \"none\",\n          border: `1px solid ${muted ? P.borderHi : P.border}`,\n          color: muted ? P.textMut : P.textSub,\n          padding: \"8px 12px\", borderRadius: 6, cursor: \"pointer\", fontSize: 14,\n          letterSpacing: \"0.02em\",\n        }} title={muted ? \"Unmute\" : \"Mute\"}>\n          {muted ? \"🔇\" : \"🔔\"}\n        </button>\n      </div>\n\n      {/* Overall progress */}\n      <div style={{ height: 4, background: P.border, borderRadius: 2, marginBottom: 28, overflow: \"hidden\" }}>\n        <div style={{ height: \"100%\", width: `${overallPct * 100}%`, background: P.run, borderRadius: 2, transition: \"width 1s linear\" }} />\n      </div>\n\n      <div style={{ flex: 1, display: \"flex\", flexDirection: \"column\", justifyContent: \"center\", alignItems: \"center\", gap: 20 }}>\n\n        <div className=\"tf\" style={{\n          fontSize: 48, fontWeight: 700, letterSpacing: \"0.08em\",\n          color: C, transition: \"color 0.4s\",\n        }}>\n          {SEG_LABEL[seg?.type ?? \"run\"]}\n        </div>\n\n        {/* Ring */}\n        <div style={{ position: \"relative\", width: 196, height: 196 }}>\n          <svg width=\"196\" height=\"196\" style={{ position: \"absolute\", transform: \"rotate(-90deg)\" }}>\n            <circle cx=\"98\" cy=\"98\" r={R_C} fill=\"none\" stroke={P.border} strokeWidth=\"8\" />\n            <circle cx=\"98\" cy=\"98\" r={R_C} fill=\"none\"\n              stroke={warning ? \"#ffcc00\" : C}\n              strokeWidth=\"8\" strokeLinecap=\"round\"\n              strokeDasharray={circ}\n              strokeDashoffset={circ * (1 - progress)}\n              style={{ transition: \"stroke-dashoffset 1s linear, stroke 0.4s\" }}\n            />\n          </svg>\n          <div style={{ position: \"absolute\", inset: 0, display: \"flex\", flexDirection: \"column\", alignItems: \"center\", justifyContent: \"center\" }}>\n            <div className=\"tf\" style={{\n              fontSize: 54, fontWeight: 700, letterSpacing: \"-0.02em\", lineHeight: 1,\n              color: warning ? \"#ffcc00\" : P.text,\n              transition: \"color 0.3s\",\n            }}>\n              {fmt(secsLeft)}\n            </div>\n            {paused && <div style={{ fontSize: 11, color: P.textMut, letterSpacing: \"0.1em\", marginTop: 6 }}>PAUSED</div>}\n          </div>\n        </div>\n\n        {/* Segment dots */}\n        <div style={{ display: \"flex\", gap: 4, flexWrap: \"wrap\", justifyContent: \"center\", maxWidth: 300 }}>\n          {plan.segments.map((s, i) => (\n            <div key={i} style={{\n              width: i === segIdx ? 14 : 7, height: 7, borderRadius: 4,\n              background: i < segIdx ? SEG_COLOR[s.type] + \"77\" : i === segIdx ? SEG_COLOR[s.type] : P.border,\n              transition: \"all 0.3s\",\n            }} />\n          ))}\n        </div>\n      </div>\n\n      {/* Next segment */}\n      {nextSeg ? (\n        <div style={{\n          background: P.surface, borderRadius: 10, padding: \"11px 16px\",\n          marginBottom: 14, display: \"flex\", alignItems: \"center\", gap: 12,\n          border: `1px solid ${P.border}`,\n        }}>\n          <span style={{ fontSize: 10, color: P.textMut, letterSpacing: \"0.1em\" }}>NEXT</span>\n          <div style={{ width: 1, height: 14, background: P.borderHi }} />\n          <span className=\"tf\" style={{ fontSize: 15, fontWeight: 600, color: SEG_COLOR[nextSeg.type] }}>\n            {SEG_LABEL[nextSeg.type]}\n          </span>\n          <span style={{ fontSize: 12, color: P.textSub, marginLeft: \"auto\" }}>{fmt(nextSeg.secs)}</span>\n        </div>\n      ) : <div style={{ marginBottom: 14, height: 44 }} />}\n\n      <button onClick={onPause} style={{\n        width: \"100%\", padding: \"17px\", borderRadius: 12, cursor: \"pointer\",\n        border: paused ? `2px solid ${P.run}` : `1px solid ${P.border}`,\n        background: paused ? `${P.run}18` : P.surface,\n        color: paused ? P.run : P.textSub,\n        fontSize: 17, fontWeight: 700, letterSpacing: \"0.08em\",\n      }}>\n        {paused ? \"▶  RESUME\" : \"⏸  PAUSE\"}\n      </button>\n    </div>\n  );\n}\n\n// ── Log View ──────────────────────────────────────────────────────────────────\nfunction LogView({ week, sessionIdx, effort, notes, onEffort, onNotes, onSave, onSkip }: {\n  week: number; sessionIdx: number; effort: number; notes: string;\n  onEffort: (n: number) => void; onNotes: (s: string) => void;\n  onSave: () => void; onSkip: () => void;\n}) {\n  return (\n    <div style={{ minHeight: \"100vh\", background: P.bg, maxWidth: 480, margin: \"0 auto\", padding: \"44px 20px\" }}>\n      <div className=\"tf\" style={{ fontSize: 44, fontWeight: 700, color: P.done, lineHeight: 1, marginBottom: 6 }}>DONE!</div>\n      <div style={{ fontSize: 13, color: P.textMut, letterSpacing: \"0.06em\", marginBottom: 40 }}>\n        WEEK {week} · SESSION {sessionIdx + 1}\n      </div>\n      <div style={{ marginBottom: 28 }}>\n        <Label>HOW DID IT FEEL?</Label>\n        <div style={{ display: \"flex\", gap: 8 }}>\n          {EFFORT_ICONS.map((icon, i) => (\n            <button key={i} onClick={() => onEffort(i + 1)} style={{\n              flex: 1, padding: \"12px 4px\", borderRadius: 8, cursor: \"pointer\",\n              border: effort === i + 1 ? `2px solid ${P.run}` : `1px solid ${P.border}`,\n              background: effort === i + 1 ? `${P.run}1a` : P.surface,\n              display: \"flex\", flexDirection: \"column\", alignItems: \"center\", gap: 5,\n            }}>\n              <span style={{ fontSize: 22 }}>{icon}</span>\n              <span className=\"tf\" style={{ fontSize: 9, color: effort === i + 1 ? P.run : P.textMut, letterSpacing: \"0.06em\" }}>{i + 1}</span>\n            </button>\n          ))}\n        </div>\n      </div>\n      <div style={{ marginBottom: 36 }}>\n        <Label>NOTES</Label>\n        <textarea value={notes} onChange={e => onNotes(e.target.value)}\n          placeholder=\"How did the run feel? Any pain? Weather?\"\n          rows={3}\n          style={{\n            width: \"100%\", background: P.surface, border: `1px solid ${P.border}`,\n            borderRadius: 8, padding: \"12px 14px\", color: P.text,\n            fontSize: 14, resize: \"vertical\", outline: \"none\", lineHeight: 1.6,\n          }}\n        />\n      </div>\n      <div style={{ display: \"flex\", gap: 10 }}>\n        <button onClick={onSkip} style={{\n          padding: \"15px 18px\", borderRadius: 10, cursor: \"pointer\",\n          border: `1px solid ${P.border}`, background: \"transparent\",\n          color: P.textMut, fontSize: 12, letterSpacing: \"0.08em\",\n        }}>SKIP</button>\n        <button onClick={onSave} style={{\n          flex: 1, padding: \"15px\", borderRadius: 10, cursor: \"pointer\",\n          border: \"none\", background: P.cta, color: P.ctaText,\n          fontSize: 18, fontWeight: 700, letterSpacing: \"0.06em\",\n        }}>SAVE RUN</button>\n      </div>\n    </div>\n  );\n}\n\n// ── Label ─────────────────────────────────────────────────────────────────────\nfunction Label({ children }: { children: React.ReactNode }) {\n  return (\n    <div className=\"tf\" style={{ fontSize: 10, color: P.textMut, letterSpacing: \"0.12em\", marginBottom: 12 }}>\n      {children}\n    </div>\n  );\n}\n\n// ── Mount ─────────────────────────────────────────────────────────────────────\nconst root = createRoot(document.getElementById(\"root\")!);\nroot.render(<App />);\n","createdAt",["D",1777376795019],"branchVersion","branchId","dd65daa8-42f4-11f1-a29c-42b51c65c3df","id","dd653044-42f4-11f1-a29c-42b51c65c3df","c25k",["D",1777375487900],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","C25K tracker — week selector, interval timer, session log","imageUrl","3ee322c5-8742-48e0-86c7-5f3ae129683b","pinnedFileId","dd6cd380-42f4-11f1-a29c-42b51c65c3df","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","f427167a-3263-4778-81d8-f79626323ff5","tursoName","dd65304442f411f1a29c42b51c65c3df","tursoHostname","dd65304442f411f1a29c42b51c65c3df-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789494036282],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_101":100,"_109":105},"org",{"_101":100,"_102":103,"_104":105,"_18":56,"_106":107,"_108":25},"branch",{"_13":90,"_32":91,"_44":43,"_92":45,"_93":-5,"_94":-5,"_95":-5,"_96":-5,"_97":-5,"_98":46,"_99":100},"isOwned",21,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","kamalnrf","handle","displayName","Kamal","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yaVpXT3l1d2hWSFdtWTNoZFIwZ0lFUUhOd2oifQ","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_44":45,"_32":46,"_39":185,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":54,"_55":-5,"_18":56,"_57":58,"_59":60,"_61":-5,"_62":-5,"_63":64,"_65":66,"_67":68,"_69":70,"_71":186,"_73":-5,"_74":75,"_76":75,"_77":78,"_79":78,"_80":78,"_81":75,"_82":75,"_83":187,"_85":188,"_87":189,"_89":25},"tree",[162,165],"files",[162,163,164,165],"counts",{"_152":64,"_153":140,"_154":64,"_155":156,"_157":158},"contents",[132,133],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_44":145,"_32":146,"_30":147,"_136":-5,"_42":43,"_41":148,"_138":60,"_39":149,"_13":64,"_34":150,"_36":-5,"_24":25,"_143":-5,"_27":151},{"_44":134,"_32":135,"_30":58,"_136":-5,"_42":43,"_41":137,"_138":25,"_39":139,"_13":140,"_34":141,"_36":142,"_24":25,"_143":46,"_27":144},"e60e3eac-42f4-11f1-b999-42b51c65c3df","main.tsx","parentId",2,"latest",["D",1777375502356],1,"http","import { Hono } from \"npm:hono@4\";\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nimport { serveFile, parseVal } from \"https://esm.town/v/std/utils/index.ts\";\n\nconst app = new Hono();\napp.onError((err) => Promise.reject(err));\n\nawait sqlite.execute(`\n  CREATE TABLE IF NOT EXISTS c25k_sessions (\n    id INTEGER PRIMARY KEY AUTOINCREMENT,\n    week INTEGER NOT NULL,\n    session INTEGER NOT NULL,\n    completed_at TEXT NOT NULL,\n    effort INTEGER,\n    notes TEXT\n  )\n`);\n\napp.get(\"/api/sessions\", async (c) => {\n  const result = await sqlite.execute(\n    \"SELECT * FROM c25k_sessions ORDER BY completed_at DESC\"\n  );\n  return c.json(result.rows);\n});\n\napp.post(\"/api/sessions\", async (c) => {\n  const { week, session, effort, notes } = await c.req.json();\n  await sqlite.execute({\n    sql: \"INSERT INTO c25k_sessions (week, session, completed_at, effort, notes) VALUES (?, ?, ?, ?, ?)\",\n    args: [week, session, new Date().toISOString(), effort ?? null, notes ?? \"\"],\n  });\n  return c.json({ ok: true });\n});\n\napp.delete(\"/api/sessions/:id\", async (c) => {\n  const id = c.req.param(\"id\");\n  await sqlite.execute({ sql: \"DELETE FROM c25k_sessions WHERE id = ?\", args: [id] });\n  return c.json({ ok: true });\n});\n\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path));\napp.get(\"*\", (c) => serveFile(\"/frontend/index.html\"));\n\nexport default app.fetch;\n","label",[135],"e92cb8c0-42f4-11f1-877a-42b51c65c3df","frontend","e92cb99c-42f4-11f1-877a-42b51c65c3df",3,["D",1777375507659],"directory",[146],"pulls","branches","forks","envVars",{"_159":140,"_161":64},"connections",{"_159":64,"_160":64},"count","unfilledCount","emptyCount",{"_44":145,"_32":146,"_30":147,"_136":-5,"_42":43,"_41":148,"_138":60,"_39":182,"_13":64,"_34":150,"_36":-5,"_24":25,"_143":-5,"_167":183,"_27":184},{"_44":178,"_32":33,"_30":31,"_136":147,"_42":43,"_41":14,"_138":25,"_39":179,"_13":137,"_34":35,"_36":38,"_24":25,"_143":-5,"_167":180,"_27":181},{"_44":170,"_32":171,"_30":172,"_136":147,"_42":43,"_41":173,"_138":25,"_39":174,"_13":140,"_34":20,"_36":175,"_24":25,"_143":-5,"_167":176,"_27":177},{"_44":134,"_32":135,"_30":58,"_136":-5,"_42":43,"_41":137,"_138":25,"_39":166,"_13":140,"_34":141,"_36":142,"_24":25,"_143":46,"_167":168,"_27":169},["D",1777375502356],"children",[],[135],"589ddb10-42f7-11f1-ae59-42b51c65c3df","index.html","eefedc1a-42f4-11f1-a29c-42b51c65c3df",7,["D",1777376553609],"<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n  <meta charset=\"UTF-8\">\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no\">\n  <title>C25K</title>\n  <link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">\n  <link href=\"https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;600;700&family=DM+Sans:wght@300;400;500&display=swap\" rel=\"stylesheet\">\n  <script src=\"https://cdn.twind.style\" crossorigin></script>\n  <script src=\"https://esm.town/v/std/catch\"></script>\n  <style>\n    *, *::before, *::after { box-sizing: border-box; }\n    html, body { margin: 0; padding: 0; height: 100%; }\n    body {\n      font-family: 'DM Sans', sans-serif;\n      background: #111318;\n      color: #f4f6fa;\n      -webkit-font-smoothing: antialiased;\n    }\n    .tf { font-family: 'Oswald', sans-serif; }\n    button { font-family: 'Oswald', sans-serif; }\n    textarea, input { font-family: 'DM Sans', sans-serif; }\n    ::-webkit-scrollbar { width: 4px; }\n    ::-webkit-scrollbar-track { background: #1a1d24; }\n    ::-webkit-scrollbar-thumb { background: #363c48; border-radius: 2px; }\n  </style>\n</head>\n<body>\n  <div id=\"root\"></div>\n  <script src=\"/frontend/App.tsx\" type=\"module\"></script>\n</body>\n</html>\n",[],[146,171],"e88194a6-42f7-11f1-bbaa-42b51c65c3df",["D",1777376795019],[],[146,33],["D",1777375507659],[163,164],[146],["D",1777375487900],["D",1789494036282],{"_101":100,"_109":105},{"_101":100,"_102":103,"_104":105,"_18":56,"_106":107,"_108":25},{"_13":90,"_32":91,"_44":43,"_92":45,"_93":-5,"_94":-5,"_95":-5,"_96":-5,"_97":-5,"_98":46,"_99":100},"ctx",{"_83":-5,"_129":223,"_224":225,"_226":227,"_228":25,"_229":25,"_230":25,"_231":60,"_232":-5,"_233":-7,"_234":-7,"_235":64,"_236":25,"_237":25,"_238":-5,"_239":25,"_240":25,"_241":25,"_242":-5},"ENV",{"_194":195,"_196":197,"_198":91,"_199":200,"_201":202,"_203":204,"_205":206,"_207":208,"_209":210,"_211":212,"_213":214,"_215":216,"_217":218,"_219":220,"_221":222},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]
</article></body></html>

Diff · v8