diff --git a/src/dotnet/QuantEngine.Web/wwwroot/app.css b/src/dotnet/QuantEngine.Web/wwwroot/app.css
index 733a42b..2235433 100644
--- a/src/dotnet/QuantEngine.Web/wwwroot/app.css
+++ b/src/dotnet/QuantEngine.Web/wwwroot/app.css
@@ -375,3 +375,104 @@ input[type="password"].login-input:focus {
     color: #ffffff !important;
     outline: none !important;
 }
+
+/* =====================================================
+   로컬 테스트 환경 스타일 최적화
+   ===================================================== */
+
+/* 기본 배경과 텍스트 색상 */
+body {
+    background: linear-gradient(135deg, #090a15 0%, #12142d 100%);
+    color: #ffffff;
+}
+
+/* 로그인 셸 전체 */
+.login-shell {
+    background: linear-gradient(135deg, #0a0b16 0%, #13152e 100%) !important;
+    min-height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+/* 로그인 카드 */
+.login-card {
+    background: rgba(255, 255, 255, 0.05) !important;
+    backdrop-filter: blur(24px) !important;
+    border: 1px solid rgba(255, 255, 255, 0.1) !important;
+    padding: 48px 32px !important;
+}
+
+/* MudStack 간격 */
+:deep(.mud-stack) {
+    gap: 16px !important;
+}
+
+/* 모든 입력 필드 */
+:deep(.mud-input-slot),
+input[type="text"],
+input[type="password"],
+:deep(.mud-input) {
+    background-color: rgba(255, 255, 255, 0.08) !important;
+    color: #ffffff !important;
+    border-color: rgba(255, 255, 255, 0.2) !important;
+}
+
+:deep(.mud-input-slot::placeholder),
+input[type="text"]::placeholder,
+input[type="password"]::placeholder {
+    color: rgba(255, 255, 255, 0.5) !important;
+}
+
+:deep(.mud-input-slot:focus),
+input[type="text"]:focus,
+input[type="password"]:focus {
+    background-color: rgba(255, 255, 255, 0.12) !important;
+    border-color: rgba(63, 81, 181, 0.8) !important;
+    box-shadow: 0 0 0 3px rgba(63, 81, 181, 0.2) !important;
+    outline: none !important;
+}
+
+/* 라벨 */
+.login-label,
+:deep(.mud-input-label),
+:deep(.mud-input-label-filled),
+:deep(.mud-input-label-outlined) {
+    color: rgba(255, 255, 255, 0.7) !important;
+    font-weight: 500 !important;
+}
+
+/* MudCheckBox */
+:deep(.mud-checkbox),
+:deep(.mud-checkbox .mud-button-label) {
+    color: rgba(255, 255, 255, 0.9) !important;
+}
+
+/* MudButton - 로그인 */
+:deep(.mud-button-filled-primary) {
+    background-color: #3f51b5 !important;
+    color: #ffffff !important;
+}
+
+:deep(.mud-button-filled-primary:hover) {
+    background-color: #5566cc !important;
+    box-shadow: 0 8px 24px rgba(63, 81, 181, 0.4) !important;
+}
+
+/* MudAlert - 에러 */
+:deep(.mud-alert-filled-error) {
+    background-color: rgba(244, 67, 54, 0.15) !important;
+    color: #ff7675 !important;
+}
+
+/* MudText */
+:deep(.mud-text),
+:deep(.mud-typography) {
+    color: rgba(255, 255, 255, 0.95) !important;
+}
+
+/* MudAvatar */
+:deep(.mud-avatar) {
+    background-color: #3f51b5 !important;
+}
+