Create assets/site.css

assets/site.css

@@ -0,0 +1,67 @@
+/* assets/site.css */
+:root {
+  color-scheme: dark;
+}
+
+body { font-family: 'Inter', sans-serif; }
+
+.gradient-text{
+  background: linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899);
+  -webkit-background-clip:text;
+  background-clip:text;
+  color:transparent;
+}
+
+.aura{
+  background:
+    radial-gradient(circle at 25% 15%, rgba(99,102,241,0.20), transparent 42%),
+    radial-gradient(circle at 70% 70%, rgba(236,72,153,0.12), transparent 46%),
+    radial-gradient(circle at 50% 45%, rgba(139,92,246,0.10), transparent 55%);
+}
+
+.conscious-element{ transition: transform 0.28s ease, background-color 0.28s ease, border-color 0.28s ease, opacity 0.28s ease; }
+.conscious-element:hover{ transform: translateY(-2px); }
+
+.focus-ring:focus{ outline:none; box-shadow:0 0 0 2px rgba(99,102,241,0.65); }
+
+.modal{ transition: opacity 0.3s ease, transform 0.3s ease; }
+.modal-hidden{ opacity:0; transform: translateY(20px); pointer-events:none; }
+.modal-visible{ opacity:1; transform: translateY(0); }
+
+.thin-scroll{
+  scrollbar-width: thin;
+  scrollbar-color: #4f46e5 #1e1b4b;
+}
+.thin-scroll::-webkit-scrollbar{ width:6px; }
+.thin-scroll::-webkit-scrollbar-track{ background:#1e1b4b; }
+.thin-scroll::-webkit-scrollbar-thumb{ background-color:#4f46e5; border-radius:3px; }
+
+.lab-grid{
+  background-image:
+    linear-gradient(rgba(148,163,184,0.06) 1px, transparent 1px),
+    linear-gradient(90deg, rgba(148,163,184,0.06) 1px, transparent 1px);
+  background-size:44px 44px;
+  background-position:center;
+}
+
+/* Chat typing indicator: robust (no animating `content`) */
+.typing-dots{ display:inline-flex; gap:4px; align-items:center; }
+.typing-dots span{
+  width:4px; height:4px; border-radius:999px;
+  background: currentColor;
+  opacity:0.35;
+  animation: sp-dot 1.2s infinite;
+}
+.typing-dots span:nth-child(2){ animation-delay: 0.2s; }
+.typing-dots span:nth-child(3){ animation-delay: 0.4s; }
+@keyframes sp-dot{
+  0%, 100%{ opacity:0.25; transform: translateY(0); }
+  50%{ opacity:1; transform: translateY(-2px); }
+}
+
+/* Respect reduced motion */
+@media (prefers-reduced-motion: reduce){
+  .conscious-element{ transition:none; }
+  .modal{ transition:none; }
+  .typing-dots span{ animation:none; }
+}