style(webui): cyan active states in sidebar, premium login card

src/app/components/ThreadList.tsx

@@ -459,7 +459,7 @@ export function ThreadList({
             "grid w-full cursor-pointer items-center gap-2 rounded-md py-2 pl-2.5 pr-28 text-left transition-colors duration-200 md:pr-2.5 md:group-focus-within:pr-28 md:group-hover:pr-28",
             "hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
             currentThreadId === thread.id
-              ? "border border-primary bg-accent hover:bg-accent"
+              ? "border border-transparent bg-[var(--color-active-bg)] text-[var(--color-active-text)] hover:bg-[var(--color-active-bg)]"
               : "border border-transparent bg-transparent"
           )}
           aria-current={currentThreadId === thread.id}
@@ -632,7 +632,8 @@ export function ThreadList({
         }}
         className={cn(
           "flex flex-shrink-0 items-center gap-2.5 border-b border-border px-3 py-3 text-left text-sm font-medium transition-colors hover:bg-accent focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
-          view === "skills" && "bg-accent"
+          view === "skills" &&
+            "bg-[var(--color-active-bg)] text-[var(--color-active-text)]"
         )}
       >
         <Puzzle
@@ -655,7 +656,8 @@ export function ThreadList({
         }}
         className={cn(
           "flex flex-shrink-0 items-center gap-2.5 border-b border-border px-3 py-3 text-left text-sm font-medium transition-colors hover:bg-accent focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
-          view === "memory" && "bg-accent"
+          view === "memory" &&
+            "bg-[var(--color-active-bg)] text-[var(--color-active-text)]"
         )}
       >
         <BrainCircuit
@@ -688,7 +690,8 @@ export function ThreadList({
         }}
         className={cn(
           "flex flex-shrink-0 items-center gap-2.5 border-b border-border px-3 py-3 text-left text-sm font-medium transition-colors hover:bg-accent focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
-          view === "schedule" && "bg-accent"
+          view === "schedule" &&
+            "bg-[var(--color-active-bg)] text-[var(--color-active-text)]"
         )}
       >
         <Clock

src/app/login/page.tsx

@@ -76,7 +76,7 @@ export default function LoginPage() {
       <form
         onSubmit={submit}
         method="post"
-        className="w-full max-w-sm rounded-lg border border-border bg-[var(--color-surface)] p-6 shadow-sm"
+        className="w-full max-w-sm rounded-2xl border border-border bg-[var(--color-surface)] p-8 shadow-[var(--shadow-xl)]"
       >
         <div className="mb-6 flex items-center gap-3">
           <Image