feat: Introduce new AI skills, core application layout, and cinematic UI components for the portfolio.

app/globals.css

@@ -244,6 +244,20 @@ textarea {
   white-space: normal;
   word-break: normal;
   overflow-wrap: break-word;
+  transition:
+    border-color 0.2s ease,
+    box-shadow 0.2s ease,
+    transform 0.2s ease;
+}
+
+.ds-tag:hover {
+  border-color: rgba(10, 10, 10, 0.3);
+  box-shadow: 0 2px 12px rgba(10, 10, 10, 0.1);
+}
+
+.ds-section-dark .ds-tag:hover {
+  border-color: rgba(204, 255, 0, 0.3);
+  box-shadow: 0 2px 16px rgba(204, 255, 0, 0.1);
 }
 
 .ds-metric {
@@ -278,11 +292,42 @@ textarea {
   color: var(--ink);
   background: var(--slash);
   padding: 12px 18px;
+  transition:
+    transform 0.25s ease,
+    box-shadow 0.25s ease,
+    background 0.25s ease;
+}
+
+.ds-link-accent:hover {
+  background: #ffffff;
+  box-shadow:
+    0 0 20px rgba(204, 255, 0, 0.45),
+    0 0 48px rgba(204, 255, 0, 0.18);
+}
+
+.ds-section-dark .ds-link-accent:hover {
+  box-shadow:
+    0 0 24px rgba(204, 255, 0, 0.55),
+    0 0 60px rgba(204, 255, 0, 0.22);
 }
 
 .ds-link-muted {
   padding: 12px 18px;
   border: 1px solid var(--border);
+  transition:
+    transform 0.25s ease,
+    box-shadow 0.25s ease,
+    border-color 0.25s ease;
+}
+
+.ds-link-muted:hover {
+  border-color: var(--ink-40);
+  box-shadow: 0 4px 20px rgba(10, 10, 10, 0.12);
+}
+
+.ds-section-dark .ds-link-muted:hover {
+  border-color: rgba(204, 255, 0, 0.35);
+  box-shadow: 0 4px 20px rgba(204, 255, 0, 0.08);
 }
 
 .ds-list {