Add backend log management

app/globals.css

@@ -1207,6 +1207,163 @@ h3 {
   gap: 8px;
 }
 
+.log-manager {
+  display: grid;
+  gap: 14px;
+}
+
+.log-actions {
+  display: grid;
+  grid-template-columns: minmax(240px, 0.8fr) minmax(260px, 1fr) auto;
+  align-items: center;
+  gap: 12px;
+}
+
+.log-tabs {
+  width: 100%;
+}
+
+.log-search {
+  min-width: 0;
+  height: 42px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  background: #ffffff;
+  padding: 0 12px;
+}
+
+.log-search svg {
+  width: 17px;
+  height: 17px;
+  color: var(--muted);
+  flex: 0 0 auto;
+}
+
+.log-search input {
+  min-width: 0;
+  width: 100%;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--ink);
+}
+
+.log-storage {
+  display: grid;
+  grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(150px, 0.6fr));
+  gap: 10px;
+}
+
+.log-storage div {
+  min-width: 0;
+  display: grid;
+  gap: 4px;
+  padding: 10px 12px;
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  background: #f8faf8;
+}
+
+.log-storage span {
+  color: var(--muted);
+  font-size: 12px;
+  font-weight: 700;
+}
+
+.log-storage strong {
+  min-width: 0;
+  overflow-wrap: anywhere;
+  font-size: 13px;
+}
+
+.log-list {
+  display: grid;
+  gap: 10px;
+}
+
+.log-row {
+  min-width: 0;
+  display: grid;
+  gap: 10px;
+  padding: 12px;
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  background: #ffffff;
+}
+
+.log-row-error {
+  border-color: #e6b8ae;
+  background: #fffaf8;
+}
+
+.log-row-warning {
+  border-color: #ead2a4;
+  background: #fffaf0;
+}
+
+.log-row-main {
+  min-width: 0;
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  align-items: start;
+  gap: 10px;
+}
+
+.log-message {
+  min-width: 0;
+  display: grid;
+  gap: 4px;
+}
+
+.log-message strong {
+  overflow-wrap: anywhere;
+  font-size: 14px;
+}
+
+.log-message small {
+  min-width: 0;
+  color: var(--muted);
+  font-size: 12px;
+  overflow-wrap: anywhere;
+}
+
+.log-detail {
+  min-width: 0;
+}
+
+.log-detail summary {
+  cursor: pointer;
+  color: var(--green-dark);
+  font-size: 12px;
+  font-weight: 800;
+}
+
+.log-detail pre {
+  max-height: 360px;
+  overflow: auto;
+  margin: 8px 0 0;
+  padding: 10px;
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  background: #f8fbfb;
+  color: #27312d;
+  font-size: 12px;
+  line-height: 1.55;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+.log-empty {
+  display: grid;
+  place-items: center;
+  min-height: 160px;
+  color: var(--muted);
+  font-weight: 800;
+}
+
 .image-upload-button {
   flex: 0 0 auto;
 }
@@ -2221,6 +2378,11 @@ button:active:not(:disabled),
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 
+  .log-actions,
+  .log-storage {
+    grid-template-columns: 1fr;
+  }
+
   .settings-engine-row {
     display: grid;
     grid-template-columns: 1fr;
@@ -2278,6 +2440,7 @@ button:active:not(:disabled),
 
   .create-mode-bar,
   .asset-manager-toolbar,
+  .log-actions,
   .settings-actions {
     padding: 8px;
   }
@@ -2450,6 +2613,11 @@ button:active:not(:disabled),
     display: grid;
   }
 
+  .log-tabs {
+    display: grid;
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+  }
+
   .asset-view-switch {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
@@ -2459,6 +2627,7 @@ button:active:not(:disabled),
   }
 
   .asset-view-switch button,
+  .log-tabs button,
   .settings-tabs button {
     min-width: 0;
     min-height: 38px;