Add files via upload

web/static/css/style.css

@@ -56,7 +56,7 @@ body {
 header {
     background: var(--primary-color);
     color: white;
-    padding: 24px 32px;
+    padding: 16px 24px;
     border-bottom: 1px solid rgba(255, 255, 255, 0.1);
     flex-shrink: 0;
 }
@@ -289,7 +289,7 @@ header {
     flex-direction: column;
     flex: 1;
     min-width: 0;
-    background: var(--bg-primary);
+    background: var(--bg-secondary);
     overflow: hidden;
     height: 100%;
 }
@@ -755,6 +755,67 @@ header {
     transform: translateY(0);
 }
 
+/* 登录遮罩 */
+.login-overlay {
+    position: fixed;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.6);
+    backdrop-filter: blur(6px);
+    display: none;
+    align-items: center;
+    justify-content: center;
+    z-index: 1200;
+    padding: 24px;
+}
+
+.login-card {
+    width: 100%;
+    max-width: 360px;
+    background: var(--bg-primary);
+    border-radius: 12px;
+    padding: 32px 28px;
+    box-shadow: var(--shadow-lg);
+    border: 1px solid var(--border-color);
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+}
+
+.login-header h2 {
+    margin: 0;
+    font-size: 1.5rem;
+    color: var(--text-primary);
+}
+
+.login-subtitle {
+    margin: 8px 0 0 0;
+    font-size: 0.9375rem;
+    color: var(--text-secondary);
+}
+
+.login-form {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.login-error {
+    color: var(--error-color);
+    background: rgba(220, 53, 69, 0.08);
+    border: 1px solid rgba(220, 53, 69, 0.4);
+    border-radius: 6px;
+    padding: 10px 12px;
+    font-size: 0.875rem;
+}
+
+.login-submit {
+    width: 100%;
+    justify-content: center;
+    display: inline-flex;
+    align-items: center;
+    gap: 8px;
+}
+
 /* 模态框样式 */
 .modal {
     display: none;
@@ -1251,9 +1312,12 @@ header {
     display: none;
     align-items: center;
     gap: 12px;
-    padding: 12px 20px;
-    background: rgba(0, 102, 255, 0.06);
-    border-bottom: 1px solid rgba(0, 102, 255, 0.15);
+    padding: 10px 16px;
+    margin: 12px 0;
+    background: var(--bg-primary);
+    border: 1px solid rgba(0, 102, 255, 0.15);
+    border-radius: 10px;
+    box-shadow: var(--shadow-sm);
     color: var(--text-primary);
 }
 
@@ -1261,20 +1325,22 @@ header {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    gap: 16px;
+    gap: 12px;
     background: var(--bg-primary);
     border: 1px solid rgba(0, 102, 255, 0.2);
     border-radius: 8px;
     padding: 8px 12px;
     flex: 1;
     min-width: 0;
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.03);
 }
 
 .active-task-info {
     display: flex;
     align-items: center;
-    gap: 8px;
+    gap: 6px;
     min-width: 0;
+    flex-wrap: wrap;
 }
 
 .active-task-status {
@@ -1288,7 +1354,7 @@ header {
 }
 
 .active-task-message {
-    font-size: 0.875rem;
+    font-size: 0.85rem;
     color: var(--text-primary);
     overflow: hidden;
     text-overflow: ellipsis;
@@ -1299,7 +1365,7 @@ header {
 .active-task-actions {
     display: flex;
     align-items: center;
-    gap: 10px;
+    gap: 8px;
     flex-shrink: 0;
 }
 
@@ -1409,6 +1475,19 @@ header {
     box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.2);
 }
 
+.form-actions {
+    display: flex;
+    justify-content: flex-end;
+    gap: 12px;
+    margin-top: 4px;
+}
+
+.password-hint {
+    font-size: 0.8125rem;
+    color: var(--text-muted);
+    margin-top: 8px;
+}
+
 .tools-controls {
     display: flex;
     flex-direction: column;