feat: add night shift focus panel and unified runtime

src/index.css

@@ -51,6 +51,18 @@ button {
   backdrop-filter: blur(16px);
 }
 
+body::before {
+  content: '';
+  position: fixed;
+  inset: 0;
+  pointer-events: none;
+  background:
+    radial-gradient(circle at 15% 20%, rgba(96, 165, 250, 0.14), transparent 18%),
+    radial-gradient(circle at 85% 12%, rgba(168, 85, 247, 0.12), transparent 20%),
+    radial-gradient(circle at 50% 80%, rgba(45, 212, 191, 0.08), transparent 24%);
+  opacity: 0.9;
+}
+
 .hero-card {
   display: flex;
   justify-content: space-between;
@@ -122,6 +134,7 @@ small,
 
 .project-card,
 .quick-actions,
+.focus-card,
 .tab-bar,
 .status-bar,
 .view-stack,
@@ -214,6 +227,64 @@ textarea {
   padding: 0.9rem;
 }
 
+.focus-card {
+  position: relative;
+  overflow: hidden;
+}
+
+.focus-card::after {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(135deg, rgba(96, 165, 250, 0.08), rgba(45, 212, 191, 0.02) 48%, transparent 75%);
+  pointer-events: none;
+}
+
+.focus-grid,
+.focus-badges,
+.compact-stack {
+  position: relative;
+  z-index: 1;
+}
+
+.focus-grid {
+  display: grid;
+  grid-template-columns: 1.2fr 1fr;
+  gap: 1rem;
+}
+
+.focus-panel {
+  border-radius: 20px;
+  border: 1px solid rgba(148, 163, 184, 0.14);
+  background: rgba(15, 23, 42, 0.54);
+  padding: 1rem;
+}
+
+.focus-panel h4 {
+  margin: 0 0 0.65rem;
+}
+
+.focus-panel h4 + p,
+.focus-panel ul,
+.focus-panel p {
+  margin-top: 0;
+}
+
+.focus-panel ul {
+  padding-left: 1.1rem;
+  color: #dbe7ff;
+}
+
+.focus-badges {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+}
+
+.compact-stack {
+  gap: 0.6rem;
+}
+
 .button-row,
 .button-inline-row,
 .button-stack,
@@ -418,6 +489,7 @@ pre {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 
+  .focus-grid,
   .editor-grid,
   .project-grid {
     grid-template-columns: 1fr;