diff --git a/templates/index.html b/templates/index.html
new file mode 100644
index 0000000..06f3743
--- /dev/null
+++ b/templates/index.html
@@ -0,0 +1,152 @@
+{% extends "base.html" %}
+
+{% block title %}Raccoon Timekeeper - Log Time{% endblock %}
+
+{% block content %}
+<div class="content-grid">
+    <!-- Time Entry Form -->
+    <section class="card">
+        <div class="card-header">
+            <h2>Log Time</h2>
+        </div>
+        <div class="card-body">
+            <form id="timeEntryForm" class="time-entry-form">
+                <div class="form-row">
+                    <div class="form-group flex-2">
+                        <label for="taskSelect">Task</label>
+                        <select id="taskSelect" required>
+                            <option value="">Select a task...</option>
+                        </select>
+                    </div>
+                    <div class="form-group flex-1">
+                        <label for="dateInput">Date</label>
+                        <input type="date" id="dateInput" required>
+                    </div>
+                    <div class="form-group flex-1">
+                        <label for="timeInput">Time</label>
+                        <input type="text" id="timeInput" placeholder="1:30, 1.5, 90m" required>
+                        <span class="hint">Formats: 1:30, 1.5, 90m, 1h 30m</span>
+                    </div>
+                </div>
+                <div class="form-group">
+                    <label for="notesInput">Notes (optional)</label>
+                    <input type="text" id="notesInput" placeholder="Brief description of work done...">
+                </div>
+                <div class="form-actions">
+                    <button type="submit" class="btn btn-primary">
+                        <span>+</span> Add Entry
+                    </button>
+                </div>
+            </form>
+        </div>
+    </section>
+
+    <!-- Weekly Summary -->
+    <section class="card">
+        <div class="card-header">
+            <h2>Weekly Summary</h2>
+            <div class="week-navigator">
+                <button class="btn btn-icon" id="prevWeek" title="Previous Week">◀</button>
+                <span id="weekLabel">Loading...</span>
+                <button class="btn btn-icon" id="nextWeek" title="Next Week">▶</button>
+            </div>
+        </div>
+        <div class="card-body">
+            <div id="summaryContent">
+                <div class="loading">Loading summary...</div>
+            </div>
+            <div class="summary-actions">
+                <button class="btn btn-secondary" id="printTimesheetBtn">
+                    🖨️ Print Timesheet
+                </button>
+            </div>
+        </div>
+    </section>
+
+    <!-- Recent Entries -->
+    <section class="card">
+        <div class="card-header">
+            <h2>Recent Entries</h2>
+            <span class="badge" id="entryCount">0 entries</span>
+        </div>
+        <div class="card-body">
+            <div id="recentEntries">
+                <div class="loading">Loading entries...</div>
+            </div>
+        </div>
+    </section>
+</div>
+
+<!-- New Task Modal -->
+<div id="newTaskModal" class="modal">
+    <div class="modal-content">
+        <div class="modal-header">
+            <h3>Add New Task</h3>
+            <button class="modal-close" onclick="closeModal('newTaskModal')">&times;</button>
+        </div>
+        <div class="modal-body">
+            <form id="newTaskForm">
+                <div class="form-group">
+                    <label for="newTaskName">Task Name</label>
+                    <input type="text" id="newTaskName" required placeholder="Enter task name...">
+                </div>
+            </form>
+        </div>
+        <div class="modal-footer">
+            <button class="btn btn-secondary" onclick="closeModal('newTaskModal')">Cancel</button>
+            <button class="btn btn-primary" onclick="submitNewTask()">Add Task</button>
+        </div>
+    </div>
+</div>
+
+<!-- Edit Entry Modal -->
+<div id="editEntryModal" class="modal">
+    <div class="modal-content">
+        <div class="modal-header">
+            <h3>Edit Entry</h3>
+            <button class="modal-close" onclick="closeModal('editEntryModal')">&times;</button>
+        </div>
+        <div class="modal-body">
+            <form id="editEntryForm">
+                <input type="hidden" id="editEntryId">
+                <div class="form-group">
+                    <label for="editTaskSelect">Task</label>
+                    <select id="editTaskSelect" required></select>
+                </div>
+                <div class="form-row">
+                    <div class="form-group flex-1">
+                        <label for="editDateInput">Date</label>
+                        <input type="date" id="editDateInput" required>
+                    </div>
+                    <div class="form-group flex-1">
+                        <label for="editTimeInput">Time</label>
+                        <input type="text" id="editTimeInput" required>
+                    </div>
+                </div>
+                <div class="form-group">
+                    <label for="editNotesInput">Notes</label>
+                    <input type="text" id="editNotesInput">
+                </div>
+            </form>
+        </div>
+        <div class="modal-footer">
+            <button class="btn btn-danger" onclick="deleteCurrentEntry()">Delete</button>
+            <button class="btn btn-secondary" onclick="closeModal('editEntryModal')">Cancel</button>
+            <button class="btn btn-primary" onclick="submitEditEntry()">Save Changes</button>
+        </div>
+    </div>
+</div>
+
+<!-- Print Template -->
+<div id="printTemplate" class="print-only">
+    <div class="print-header">
+        <h1>🦝 Raccoon Timekeeper - Weekly Timesheet</h1>
+        <div class="print-period" id="printPeriod"></div>
+    </div>
+    <div id="printContent"></div>
+</div>
+{% endblock %}
+
+{% block extra_js %}
+<script src="{{ url_for('static', filename='js/index.js') }}"></script>
+{% endblock %}