Add clickable reference badges and improve UI layout

- Add clickable badges for backlinks and references that trigger query string searches
- Improve toggle checkbox layout with better styling
- Add description block styling with scrollable container
- Update results styling with bordered cards and shadows
- Add favicon support across pages
- Enhance .env loading with logging for debugging

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

static/style.css

@@ -119,6 +119,61 @@ body.dimmed {
   content: ' ▲';
 }
 
+.toggle-row {
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 4px;
+  margin-top: 8px;
+}
+
+.toggle-row > * {
+  margin-left: 0 !important;
+}
+
+.toggle-item {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  user-select: none;
+}
+
+.toggle-item label {
+  cursor: pointer;
+  width: auto !important;
+}
+
+.toggle-item--first {
+  margin-left: 0;
+}
+
+.toggle-item input[type="checkbox"] {
+  margin: 0;
+}
+
+.toggle-item input[type="checkbox"]:disabled + label {
+  color: GrayText;
+  opacity: 0.7;
+}
+
+.toggle-item input[type="checkbox"]:disabled {
+  cursor: not-allowed;
+}
+
+.toggle-item input[type="checkbox"]:disabled + label {
+  cursor: not-allowed;
+}
+
+.description-block {
+  background: Window;
+  border: 1px solid #919b9c;
+  padding: 6px 8px;
+  margin-top: 6px;
+  font-size: 11px;
+  white-space: pre-wrap;
+  max-height: 6em;
+  overflow-y: auto;
+}
+
 .channel-options {
   position: absolute;
   margin-top: 2px;
@@ -165,16 +220,18 @@ body.dimmed {
 
 /* Results styling */
 #results .item {
-  border-bottom: 1px solid ButtonShadow;
-  padding: 12px 0;
+  background: Window;
+  border: 2px solid #919b9c;
+  padding: 12px;
   margin-bottom: 8px;
   max-width: 100%;
   overflow: hidden;
   word-wrap: break-word;
+  box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.15);
 }
 
 #results .item:last-child {
-  border-bottom: none;
+  margin-bottom: 0;
 }
 
 #results .item strong {
@@ -186,6 +243,7 @@ body.dimmed {
 .window-body {
   max-width: 100%;
   overflow-x: hidden;
+  margin: 1rem;
 }
 
 /* Badges */
@@ -209,6 +267,15 @@ body.dimmed {
   word-break: keep-all;
 }
 
+.badge-clickable {
+  cursor: pointer;
+}
+
+.badge-clickable:focus {
+  outline: 2px solid rgba(11, 110, 253, 0.6);
+  outline-offset: 1px;
+}
+
 /* Transcript and highlights */
 .transcript {
   background: Window;
@@ -255,8 +322,7 @@ mark {
   margin-top: 12px;
   padding: 8px;
   background: Window;
-  border: 2px solid;
-  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
+  border: 2px solid #919b9c;
   max-height: 400px;
   overflow-y: auto;
   font-size: 11px;
@@ -312,27 +378,9 @@ mark {
   line-height: 1.4;
 }
 
-.transcript-header {
-  font-weight: bold;
-  margin-bottom: 8px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  background: ActiveCaption;
-  color: CaptionText;
-  padding: 2px 4px;
-}
-
+.transcript-header,
 .transcript-close {
-  cursor: pointer;
-  font-size: 16px;
-  padding: 0 4px;
-  font-weight: bold;
-}
-
-.transcript-close:hover {
-  background: Highlight;
-  color: HighlightText;
+  display: none;
 }
 
 /* Chart styling */