feat: implement AI gateway phase one runtime

apps/web/src/styles/ui.css

@@ -1,7 +1,7 @@
 .shCard {
   overflow: hidden;
   border: 1px solid var(--border);
-  border-radius: 8px;
+  border-radius: 10px;
   background: var(--card);
   color: var(--card-foreground);
 }
@@ -18,7 +18,7 @@
   align-items: center;
   justify-content: space-between;
   gap: 12px;
-  border-bottom: 1px solid #edf1f5;
+  border-bottom: 1px solid #eef1f4;
 }
 
 .shCardTitle {
@@ -39,9 +39,10 @@
   justify-content: center;
   gap: 8px;
   border: 1px solid transparent;
-  border-radius: 8px;
+  border-radius: 7px;
   font-weight: 800;
   line-height: 1;
+  transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, color 0.16s ease;
 }
 
 .shButtonDefaultSize {
@@ -65,6 +66,10 @@
   color: var(--primary-foreground);
 }
 
+.shButtonDefault:hover {
+  background: #202734;
+}
+
 .shButtonSecondary {
   background: var(--secondary);
   color: var(--secondary-foreground);
@@ -76,11 +81,21 @@
   color: #344054;
 }
 
+.shButtonOutline:hover,
+.shButtonSecondary:hover {
+  border-color: #d5dbe3;
+  background: #f9fafb;
+}
+
 .shButtonGhost {
   background: transparent;
   color: #344054;
 }
 
+.shButtonGhost:hover {
+  background: #f5f6f8;
+}
+
 .shButtonDestructive {
   background: var(--destructive);
   color: #fff;
@@ -93,7 +108,7 @@
   display: grid;
   place-items: center;
   padding: 24px;
-  background: rgba(15, 23, 42, 0.42);
+  background: rgba(16, 19, 24, 0.36);
 }
 
 .formDialog {
@@ -103,9 +118,9 @@
   grid-template-rows: auto minmax(0, 1fr);
   overflow: hidden;
   border: 1px solid var(--border);
-  border-radius: 10px;
+  border-radius: 12px;
   background: #fff;
-  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
+  box-shadow: 0 22px 60px rgba(16, 24, 40, 0.16);
 }
 
 .formDialogHeader {
@@ -154,14 +169,14 @@
   padding: 14px 18px;
   border-top: 1px solid var(--border);
   background: #fff;
-  box-shadow: 0 -10px 24px rgba(15, 23, 42, 0.06);
+  box-shadow: 0 -1px 0 rgba(16, 24, 40, 0.02);
 }
 
 .shInput,
 .shTextarea {
   width: 100%;
   border: 1px solid var(--input);
-  border-radius: 8px;
+  border-radius: 7px;
   background: #fff;
   color: var(--foreground);
   outline: none;
@@ -182,7 +197,7 @@
 .shTextarea:focus,
 .tokenInline input:focus {
   border-color: var(--ring);
-  box-shadow: 0 0 0 3px rgba(47, 128, 193, 0.16);
+  box-shadow: 0 0 0 3px rgba(100, 116, 139, 0.14);
 }
 
 .shLabel,
@@ -212,7 +227,7 @@
   padding: 4px;
   border: 1px solid var(--border);
   border-radius: 8px;
-  background: #f8fafc;
+  background: #f6f7f9;
 }
 
 .shTab {
@@ -230,8 +245,8 @@
 
 .shTab[data-active="true"] {
   background: #fff;
-  color: #145388;
-  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08);
+  color: #111827;
+  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
 }
 
 .shBadge {
@@ -246,12 +261,12 @@
   font-weight: 900;
 }
 
-.shBadgeDefault { background: #eaf2f8; color: #145388; }
-.shBadgeSecondary { background: #eef2f6; color: #475467; }
+.shBadgeDefault { background: #eef1f5; color: #202734; }
+.shBadgeSecondary { background: #f3f5f7; color: #5d6675; }
 .shBadgeOutline { border-color: var(--border); background: #fff; color: #344054; }
-.shBadgeSuccess { background: #e8f5ef; color: #14805e; }
-.shBadgeWarning { background: #fff6df; color: #98690c; }
-.shBadgeDestructive { background: #fff1f1; color: #b42318; }
+.shBadgeSuccess { background: #edf7f1; color: #157a57; }
+.shBadgeWarning { background: #fbf4e8; color: #8a6116; }
+.shBadgeDestructive { background: #fff3f3; color: #b42318; }
 
 .shTable {
   overflow: auto;
@@ -261,11 +276,11 @@
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
   min-width: 520px;
-  border-bottom: 1px solid #edf1f5;
+  border-bottom: 1px solid #eef1f4;
 }
 
 .shTableHeader {
-  background: #f8fafc;
+  background: #f7f8fa;
 }
 
 .shTableHead,
@@ -305,7 +320,7 @@
   overflow: auto;
   border: 1px solid var(--border);
   border-radius: 8px;
-  background: #f8fafc;
+  background: #f7f8fa;
   color: #1f2937;
   font-family: "SFMono-Regular", Consolas, monospace;
   font-size: 12px;