diff --git a/code/frontend/src/components/MemoryModal/index.js b/code/frontend/src/components/MemoryModal/index.js
index 66d8085..ae4858b 100644
--- a/code/frontend/src/components/MemoryModal/index.js
+++ b/code/frontend/src/components/MemoryModal/index.js
@@ -315,27 +315,35 @@ function MemoryModal({ lobsterId, lobsterName, onClose }) {
 
         .memory-calendar-panel {
           border: 1px solid #e2e8f0;
-          border-radius: 8px;
-          padding: 15px;
+          border-radius: 6px;
+          padding: 10px;
           background: white;
           display: flex;
           flex-direction: column;
+          width: 260px;
+          min-width: 260px;
         }
 
         .calendar-header {
           display: flex;
           justify-content: space-between;
           align-items: center;
-          margin-bottom: 15px;
+          margin-bottom: 10px;
         }
 
         .calendar-header button {
           background: #4299e1;
           color: white;
           border: none;
-          padding: 5px 12px;
-          border-radius: 6px;
+          padding: 3px 6px;
+          border-radius: 3px;
           cursor: pointer;
+          font-size: 0.85em;
+          width: 24px;
+          height: 24px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
         }
 
         .calendar-header button:hover {
@@ -345,27 +353,30 @@ function MemoryModal({ lobsterId, lobsterName, onClose }) {
         .calendar-grid {
           display: grid;
           grid-template-columns: repeat(7, 1fr);
-          gap: 4px;
+          gap: 2px;
           flex: 1;
         }
 
         .calendar-weekday {
           text-align: center;
-          font-size: 0.8em;
+          font-size: 0.75em;
           color: #718096;
-          padding: 8px 0;
+          padding: 6px 0;
           font-weight: 500;
         }
 
         .calendar-day {
-          aspect-ratio: 1;
+          width: 100%;
+          height: 32px;
           display: flex;
           align-items: center;
           justify-content: center;
-          border-radius: 6px;
-          font-size: 0.9em;
+          border-radius: 3px;
+          font-size: 0.75em;
           cursor: pointer;
           transition: all 0.2s;
+          padding: 0;
+          box-sizing: border-box;
         }
 
         .calendar-day:hover:not(.empty) {
@@ -380,20 +391,24 @@ function MemoryModal({ lobsterId, lobsterName, onClose }) {
           background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
           color: white;
           font-weight: bold;
+          width: 100%;
+          height: 32px;
         }
 
         .calendar-day.selected {
           border: 2px solid #ed8936;
           background: #f6ad55;
           color: white;
+          width: 100%;
+          height: 32px;
         }
 
         .calendar-legend {
-          margin-top: 10px;
+          margin-top: 8px;
           display: flex;
-          gap: 20px;
-          font-size: 0.85em;
-          padding-top: 10px;
+          gap: 12px;
+          font-size: 0.75em;
+          padding-top: 8px;
           border-top: 1px solid #e2e8f0;
         }
 
@@ -424,9 +439,9 @@ function MemoryModal({ lobsterId, lobsterName, onClose }) {
         .stat-badge {
           background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
           color: white;
-          padding: 6px 12px;
-          border-radius: 20px;
-          font-size: 0.9em;
+          padding: 4px 10px;
+          border-radius: 16px;
+          font-size: 0.75em;
           font-weight: 600;
         }