From c8e7d34509a93c6ef09a7cc229ab346ad624308b Mon Sep 17 00:00:00 2001
From: Silberengel <silberengel7@protonmail.com>
Date: Sun, 22 Feb 2026 07:41:29 +0100
Subject: [PATCH] bug-fixes

Nostr-Signature: 6fd5146b5f5980987adc5e6b93a1bcb31cfbb6a2e4fce6f1dbe5c7fdf54b717a 573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc 41422b07b63fc494c0aba22b85f1b56a6a5527f9df48d49816f7be417ad74608f8d1dff8302f562b2f47690720c089aab76db948f5bf1ecdda68741b256d7a2b
---
 nostr/commit-signatures.jsonl                 |    1 +
 src/app.css                                   |  237 +-
 src/lib/components/RepoHeaderEnhanced.svelte  |    9 +-
 src/lib/styles/components.css                 |   12 +-
 src/lib/styles/repo.css                       | 2190 ++++-------------
 .../repos/[npub]/[repo]/download/+server.ts   |    2 +
 src/routes/repos/[npub]/[repo]/+page.svelte   |  171 +-
 7 files changed, 829 insertions(+), 1793 deletions(-)

diff --git a/nostr/commit-signatures.jsonl b/nostr/commit-signatures.jsonl
index 253737b..ef2225a 100644
--- a/nostr/commit-signatures.jsonl
+++ b/nostr/commit-signatures.jsonl
@@ -46,3 +46,4 @@
 {"kind":1640,"pubkey":"573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc","created_at":1771690183,"tags":[["author","Silberengel","silberengel7@protonmail.com"],["message","get rid of tabs on repo page"]],"content":"Signed commit: get rid of tabs on repo page","id":"d34fb23385a23f479c683e76f5676356a11d63bcd0ecf71d25f1b85dbb0cfe57","sig":"1f6454f9961b9245d1e32f4a903ee9636201670491145d0185e95e7b7d33bf1027ac5b8e370070640e103740ab19e9915baa7755c6008fd32fe41e9cb86d33b8"}
 {"kind":1640,"pubkey":"573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc","created_at":1771691277,"tags":[["author","Silberengel","silberengel7@protonmail.com"],["message","fix docs"]],"content":"Signed commit: fix docs","id":"4671648712f19537cbf0fd00cf19e254eae4a1ac9c1274ea396e62dac193b88c","sig":"49a3e89e312ec4caebfeacdaade3e4cc6d027ab9c50d8e6aa1998f120a81d8d51235ae397df6e42b9efca4147497b8881731dda6d58fee7d28d2ac07cec295ec"}
 {"kind":1640,"pubkey":"573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc","created_at":1771705699,"tags":[["author","Silberengel","silberengel7@protonmail.com"],["message","bug-fixes"]],"content":"Signed commit: bug-fixes","id":"59d0c409196dccb8109a29829002df69dbca43c5e95c1fdc1e7baa0b88ee5927","sig":"af8726a86e30c64b098ad13946d5bc84cb08d5ea8b75f08641c03fbdd8b9c91683e8091b206159dde2239ea8964cb3589bcb4ec2892541d2980f186a0fb09af9"}
+{"kind":1640,"pubkey":"573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc","created_at":1771708933,"tags":[["author","Silberengel","silberengel7@protonmail.com"],["message","bug-fixes"]],"content":"Signed commit: bug-fixes","id":"6d8832125b76095b2e7ed57b71e26a6c05d9b19a14dfa76724c71f392147fe95","sig":"6ddebfa995b5b3f469db5f3cdbd7d13fa2307d7988c2667479015d6bc2ff442be357ee97e51340a944eb34fed73522db3930016d343810927486bdbcabddae5c"}
diff --git a/src/app.css b/src/app.css
index 47f8e56..48ed565 100644
--- a/src/app.css
+++ b/src/app.css
@@ -639,42 +639,80 @@ textarea:disabled::placeholder {
 }
 
 /* Make icon images theme-aware using filters */
+/* Target both img inside .icon and img with icon classes */
+img.icon,
+.icon img,
+img.icon-small,
 .icon-small img,
+img.icon-inline,
 .icon-inline img,
 .hamburger-icon img,
 .platform-icon img,
 .repo-badge-icon img,
 .btn-icon img {
-  filter: var(--icon-filter, brightness(0) saturate(100%) invert(var(--icon-invert, 0)));
-  transition: filter 0.3s ease;
-  opacity: 0.9;
-}
-
-/* Theme icons - handled separately for better control */
-.theme-icon img:not(.theme-toggle .theme-icon img),
-.theme-icon-option img:not(.theme-option .theme-icon-option img) {
-  filter: var(--icon-filter, brightness(0) saturate(100%) invert(var(--icon-invert, 0)));
-  transition: filter 0.3s ease;
-  opacity: 0.9;
+  filter: brightness(0) saturate(100%) invert(1) !important; /* Default white for dark themes */
+  opacity: 1 !important;
+  transition: filter 0.3s ease, opacity 0.3s ease;
 }
 
 /* Light theme: icons should be dark (black) */
-:root,
-[data-theme="light"] {
-  --icon-filter: brightness(0) saturate(100%);
-  --icon-invert: 0;
+[data-theme="light"] img.icon,
+[data-theme="light"] .icon img,
+[data-theme="light"] img.icon-small,
+[data-theme="light"] .icon-small img,
+[data-theme="light"] img.icon-inline,
+[data-theme="light"] .icon-inline img,
+[data-theme="light"] .hamburger-icon img,
+[data-theme="light"] .platform-icon img,
+[data-theme="light"] .repo-badge-icon img,
+[data-theme="light"] .btn-icon img {
+  filter: brightness(0) saturate(100%) !important; /* Black in light theme */
+  opacity: 1 !important;
 }
 
-/* Dark theme: icons should be light (white/light gray) */
-[data-theme="dark"] {
-  --icon-filter: brightness(0) saturate(100%) invert(1);
-  --icon-invert: 1;
+/* Dark theme (Purple): icons should be light (white/light gray) */
+[data-theme="dark"] img.icon,
+[data-theme="dark"] .icon img,
+[data-theme="dark"] img.icon-small,
+[data-theme="dark"] .icon-small img,
+[data-theme="dark"] img.icon-inline,
+[data-theme="dark"] .icon-inline img,
+[data-theme="dark"] .hamburger-icon img,
+[data-theme="dark"] .platform-icon img,
+[data-theme="dark"] .repo-badge-icon img,
+[data-theme="dark"] .btn-icon img {
+  filter: brightness(0) saturate(100%) invert(1) !important; /* White in dark/purple theme */
+  opacity: 1 !important;
 }
 
 /* Black theme: icons should be light (white/light gray) */
-[data-theme="black"] {
-  --icon-filter: brightness(0) saturate(100%) invert(1);
-  --icon-invert: 1;
+[data-theme="black"] img.icon,
+[data-theme="black"] .icon img,
+[data-theme="black"] img.icon-small,
+[data-theme="black"] .icon-small img,
+[data-theme="black"] img.icon-inline,
+[data-theme="black"] .icon-inline img,
+[data-theme="black"] .hamburger-icon img,
+[data-theme="black"] .platform-icon img,
+[data-theme="black"] .repo-badge-icon img,
+[data-theme="black"] .btn-icon img {
+  filter: brightness(0) saturate(100%) invert(1) !important; /* White in black theme */
+  opacity: 1 !important;
+}
+
+/* Theme icons - handled separately for better control */
+.theme-icon img:not(.theme-toggle .theme-icon img),
+.theme-icon-option img:not(.theme-option .theme-icon-option img) {
+  filter: brightness(0) saturate(100%) invert(1) !important; /* Default white for dark backgrounds */
+  opacity: 1 !important;
+  transition: filter 0.3s ease, opacity 0.3s ease;
+}
+
+/* Light theme: theme icons should be dark */
+[data-theme="light"] .theme-icon img:not(.theme-toggle .theme-icon img),
+[data-theme="light"] .theme-icon-option img:not(.theme-option .theme-icon-option img) {
+  filter: brightness(0) saturate(100%) !important; /* Black in light theme */
+  opacity: 1 !important;
 }
 
 .icon-inline {
@@ -692,11 +730,71 @@ textarea:disabled::placeholder {
 }
 
 /* Ensure icons in buttons and interactive elements have proper contrast */
+button img.icon,
+button .icon img,
+button img.icon-inline,
 button .icon-inline img,
+button img.icon-small,
 button .icon-small img,
+.button img.icon,
+.button .icon img,
+.button img.icon-inline,
 .button .icon-inline img,
+.button img.icon-small,
 .button .icon-small img {
-  filter: var(--icon-filter, brightness(0) saturate(100%) invert(var(--icon-invert, 0)));
+  filter: brightness(0) saturate(100%) invert(1) !important; /* Default white for dark themes */
+  opacity: 1 !important;
+}
+
+/* Light theme: button icons should be dark */
+[data-theme="light"] button img.icon,
+[data-theme="light"] button .icon img,
+[data-theme="light"] button img.icon-inline,
+[data-theme="light"] button .icon-inline img,
+[data-theme="light"] button img.icon-small,
+[data-theme="light"] button .icon-small img,
+[data-theme="light"] .button img.icon,
+[data-theme="light"] .button .icon img,
+[data-theme="light"] .button img.icon-inline,
+[data-theme="light"] .button .icon-inline img,
+[data-theme="light"] .button img.icon-small,
+[data-theme="light"] .button .icon-small img {
+  filter: brightness(0) saturate(100%) !important; /* Black in light theme */
+  opacity: 1 !important;
+}
+
+/* Dark theme (Purple): button icons should be light */
+[data-theme="dark"] button img.icon,
+[data-theme="dark"] button .icon img,
+[data-theme="dark"] button img.icon-inline,
+[data-theme="dark"] button .icon-inline img,
+[data-theme="dark"] button img.icon-small,
+[data-theme="dark"] button .icon-small img,
+[data-theme="dark"] .button img.icon,
+[data-theme="dark"] .button .icon img,
+[data-theme="dark"] .button img.icon-inline,
+[data-theme="dark"] .button .icon-inline img,
+[data-theme="dark"] .button img.icon-small,
+[data-theme="dark"] .button .icon-small img {
+  filter: brightness(0) saturate(100%) invert(1) !important; /* White in dark/purple theme */
+  opacity: 1 !important;
+}
+
+/* Black theme: button icons should be light */
+[data-theme="black"] button img.icon,
+[data-theme="black"] button .icon img,
+[data-theme="black"] button img.icon-inline,
+[data-theme="black"] button .icon-inline img,
+[data-theme="black"] button img.icon-small,
+[data-theme="black"] button .icon-small img,
+[data-theme="black"] .button img.icon,
+[data-theme="black"] .button .icon img,
+[data-theme="black"] .button img.icon-inline,
+[data-theme="black"] .button .icon-inline img,
+[data-theme="black"] .button img.icon-small,
+[data-theme="black"] .button .icon-small img {
+  filter: brightness(0) saturate(100%) invert(1) !important; /* White in black theme */
+  opacity: 1 !important;
 }
 
 /* Icons on accent backgrounds should be white */
@@ -705,7 +803,8 @@ button[class*="primary"] .icon-small img,
 .button[class*="primary"] .icon-inline img,
 .button[class*="primary"] .icon-small img,
 .theme-toggle:hover .theme-icon img {
-  filter: brightness(0) saturate(100%) invert(1);
+  filter: brightness(0) saturate(100%) invert(1) !important;
+  opacity: 1 !important;
 }
 
 /* Theme toggle icons - ensure high contrast with maximum specificity */
@@ -1330,30 +1429,33 @@ button.theme-option.active img.theme-icon-option,
   color: var(--error-text);
 }
 
-/* Code blocks - consistent dark-gray background in both themes */
-code {
-  background: var(--bg-secondary);
+/* Unified code styling - all code uses highlight.js standard theme with dark-gray background */
+
+/* Inline code - matches highlight.js theme */
+code:not(pre code) {
+  background: #1e1e1e !important;
+  color: #d4d4d4 !important;
   padding: 0.125rem 0.25rem;
   border-radius: 0.25rem;
   font-family: 'IBM Plex Mono', monospace;
   font-size: 0.875em;
-  color: var(--text-primary);
+  border: 1px solid #3a3a3a;
 }
 
+/* Pre wrappers are transparent - only code.hljs has styling */
 pre {
-  background: #1e1e1e; /* Consistent dark-gray background */
-  color: #d4d4d4; /* Light gray text for good contrast */
-  padding: 1rem;
-  border-radius: 0.5rem;
-  overflow-x: auto;
-  margin: 1rem 0;
-  border: 1px solid #3a3a3a;
+  margin: 0;
+  padding: 0;
+  background: transparent;
+  border: none;
+  overflow: visible;
 }
 
-pre code {
-  background: transparent;
-  padding: 0;
-  color: inherit;
+/* Code blocks - highlight.js handles everything */
+pre code.hljs {
+  display: block;
+  width: 100%;
+  box-sizing: border-box;
 }
 
 .clone-urls {
@@ -1365,14 +1467,14 @@ pre code {
 
 .clone-urls code {
   display: block;
-  background: var(--bg-secondary);
+  background: #1e1e1e !important; /* Dark-gray background - theme independent */
+  color: #d4d4d4 !important; /* Light gray text - theme independent */
   padding: 0.5rem;
   border-radius: 0.25rem;
   margin: 0.25rem 0;
   font-family: 'IBM Plex Mono', monospace;
   font-size: 0.875rem;
-  color: var(--text-primary);
-  border: 1px solid var(--border-light);
+  border: 1px solid #3a3a3a;
   word-break: break-all;
   overflow-wrap: break-word;
 }
@@ -1806,93 +1908,98 @@ label.filter-checkbox > span,
 
 /* All pages use the same container width for consistency */
 
-/* Highlight.js Syntax Highlighting - Consistent dark-gray background */
+/* Highlight.js - unified code block styling - theme independent */
 .hljs {
-  background: #1e1e1e !important; /* Consistent dark-gray background in both themes */
-  color: #d4d4d4 !important; /* Light gray text for good contrast */
-  border: 1px solid #3a3a3a;
-  border-radius: 4px;
-  padding: 1rem;
+  display: block;
+  background: #1e1e1e !important;
+  color: #d4d4d4 !important;
+  border: 1px solid #3a3a3a !important;
+  border-radius: 4px !important;
+  padding: 1rem !important;
   overflow-x: auto;
+  margin: 0;
+  font-family: 'IBM Plex Mono', monospace;
+  font-size: 0.875rem;
+  line-height: 1.5;
 }
 
-/* Syntax highlighting colors - high contrast for dark-gray background */
+/* Syntax highlighting colors - high contrast for dark-gray background - theme independent */
 .hljs-comment,
 .hljs-quote {
-  color: #6a9955; /* Green comments - good contrast */
+  color: #6a9955 !important; /* Green comments - good contrast */
   font-style: italic;
 }
 
 .hljs-keyword,
 .hljs-selector-tag,
 .hljs-subst {
-  color: #c586c0; /* Purple/magenta keywords - good contrast */
+  color: #c586c0 !important; /* Purple/magenta keywords - good contrast */
   font-weight: 500;
 }
 
 .hljs-number,
 .hljs-literal {
-  color: #b5cea8; /* Light green numbers - good contrast */
+  color: #b5cea8 !important; /* Light green numbers - good contrast */
   font-weight: 500;
 }
 
 .hljs-variable,
 .hljs-template-variable,
 .hljs-tag .hljs-attr {
-  color: #9cdcfe; /* Light blue variables - good contrast */
+  color: #9cdcfe !important; /* Light blue variables - good contrast */
 }
 
 .hljs-string,
 .hljs-doctag {
-  color: #ce9178; /* Orange strings - good contrast */
+  color: #ce9178 !important; /* Orange strings - good contrast */
 }
 
 .hljs-title,
 .hljs-section,
 .hljs-selector-id {
-  color: #dcdcaa; /* Yellow titles - good contrast */
+  color: #dcdcaa !important; /* Yellow titles - good contrast */
   font-weight: 600;
 }
 
 .hljs-type,
 .hljs-class .hljs-title {
-  color: #4ec9b0; /* Cyan types - good contrast */
+  color: #4ec9b0 !important; /* Cyan types - good contrast */
   font-weight: 500;
 }
 
 .hljs-tag,
 .hljs-name,
 .hljs-attribute {
-  color: #569cd6; /* Blue tags - good contrast */
+  color: #569cd6 !important; /* Blue tags - good contrast */
 }
 
 .hljs-regexp,
 .hljs-link {
-  color: #d16969; /* Red regexp - good contrast */
+  color: #d16969 !important; /* Red regexp - good contrast */
 }
 
 .hljs-symbol,
 .hljs-bullet {
-  color: #dcdcaa; /* Yellow symbols - good contrast */
+  color: #dcdcaa !important; /* Yellow symbols - good contrast */
 }
 
 .hljs-built_in,
 .hljs-builtin-name {
-  color: #4ec9b0; /* Cyan built-ins - good contrast */
+  color: #4ec9b0 !important; /* Cyan built-ins - good contrast */
 }
 
 .hljs-meta {
-  color: #808080; /* Gray meta - good contrast */
+  color: #808080 !important; /* Gray meta - good contrast */
 }
 
 .hljs-deletion {
-  background: #4a1f1f; /* Dark red background */
-  color: #ff8a8a; /* Light red text */
+  background: #4a1f1f !important; /* Dark red background */
+  color: #ff8a8a !important; /* Light red text */
 }
 
 .hljs-addition {
-  background: #1a3a2a; /* Dark green background */
-  color: #6aff9a; /* Light green text */
+  background: #1a3a2a !important; /* Dark green background */
+  color: #6aff9a !important; /* Light green text */
 }
 
 .hljs-emphasis {
diff --git a/src/lib/components/RepoHeaderEnhanced.svelte b/src/lib/components/RepoHeaderEnhanced.svelte
index f975b4a..65ecf5d 100644
--- a/src/lib/components/RepoHeaderEnhanced.svelte
+++ b/src/lib/components/RepoHeaderEnhanced.svelte
@@ -41,6 +41,7 @@
     hasUnlimitedAccess?: boolean;
     needsClone?: boolean;
     allMaintainers?: Array<{ pubkey: string; isOwner: boolean }>;
+    onCopyEventId?: () => void;
   }
 
   let { 
@@ -80,7 +81,8 @@
     deletingAnnouncement = false,
     hasUnlimitedAccess = false,
     needsClone = false,
-    allMaintainers = []
+    allMaintainers = [],
+    onCopyEventId
   }: Props = $props();
 
   let showCloneMenu = $state(false);
@@ -184,6 +186,11 @@
                   Create New Branch
                 </button>
               {/if}
+              {#if onCopyEventId}
+                <button class="menu-item" onclick={() => { onCopyEventId(); showMoreMenu = false; }}>
+                  Copy Event ID
+                </button>
+              {/if}
               {#if onDeleteAnnouncement}
                 <button 
                   class="menu-item menu-item-danger" 
diff --git a/src/lib/styles/components.css b/src/lib/styles/components.css
index b34134b..a36a922 100644
--- a/src/lib/styles/components.css
+++ b/src/lib/styles/components.css
@@ -115,21 +115,21 @@
   height: 18px;
   flex-shrink: 0;
   /* Theme-aware icon colors */
-  filter: brightness(0) saturate(100%) invert(1); /* Default white for dark themes */
-  opacity: 1;
+  filter: brightness(0) saturate(100%) invert(1) !important; /* Default white for dark themes */
+  opacity: 1 !important;
 }
 
 /* Light theme: black icon */
 :global([data-theme="light"]) .icon {
-  filter: brightness(0) saturate(100%); /* Black in light theme */
-  opacity: 1;
+  filter: brightness(0) saturate(100%) !important; /* Black in light theme */
+  opacity: 1 !important;
 }
 
 /* Dark themes: white icon */
 :global([data-theme="dark"]) .icon,
 :global([data-theme="black"]) .icon {
-  filter: brightness(0) saturate(100%) invert(1); /* White in dark themes */
-  opacity: 1;
+  filter: brightness(0) saturate(100%) invert(1) !important; /* White in dark themes */
+  opacity: 1 !important;
 }
 
 .repo-description {
diff --git a/src/lib/styles/repo.css b/src/lib/styles/repo.css
index 244662d..f2478b6 100644
--- a/src/lib/styles/repo.css
+++ b/src/lib/styles/repo.css
@@ -28,22 +28,6 @@
   }
 }
 
-@media (max-width: 768px) {
-  .repo-clone-urls {
-    flex-direction: column;
-    align-items: flex-start;
-  }
-  
-  .clone-url-wrapper {
-    width: 100%;
-    max-width: 100%;
-  }
-  
-  .clone-url {
-    max-width: calc(100% - 2rem);
-  }
-}
-
 .repo-banner {
   width: 100%;
   height: 200px;
@@ -51,57 +35,23 @@
   background: var(--bg-secondary);
   margin-bottom: 0;
   position: relative;
-  display: none; /* Hidden on mobile by default */
+  display: none;
 }
 
 .desktop-only {
-  display: none; /* Hidden on mobile */
+  display: none;
 }
 
 @media (min-width: 768px) {
   .desktop-only {
-    display: block; /* Show on desktop */
+    display: block;
   }
   
   .repo-banner {
-    display: block; /* Show on desktop */
+    display: block;
   }
 }
 
-.repo-banner::before {
-  content: '';
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: linear-gradient(
-    to bottom,
-    transparent 0%,
-    transparent 60%,
-    var(--card-bg) 100%
-  );
-  z-index: 1;
-  pointer-events: none;
-}
-
-.repo-banner::after {
-  content: '';
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: linear-gradient(
-    to right,
-    transparent 0%,
-    transparent 85%,
-    var(--card-bg) 100%
-  );
-  z-index: 1;
-  pointer-events: none;
-}
-
 .repo-banner img {
   width: 100%;
   height: 100%;
@@ -109,1397 +59,282 @@
   display: block;
 }
 
-.repo-banner img[src=""],
-.repo-banner img:not([src]) {
-  display: none;
-}
-
-/* Responsive design for smaller screens */
-.mobile-toggle-button {
-  display: none; /* Hidden by default on desktop */
-  padding: 0.5rem;
-  background: var(--bg-tertiary);
-  border: 1px solid var(--border-color);
-  border-radius: 4px;
-  cursor: pointer;
-  transition: background 0.2s;
-  align-items: center;
-  justify-content: center;
-}
-
-.mobile-toggle-button .icon-inline {
-  width: 16px;
-  height: 16px;
-}
-
-.mobile-toggle-button:hover {
-  background: var(--bg-primary);
+.repo-view {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
 }
 
-.hide-on-mobile {
-  display: none;
+.repo-layout {
+  flex: 1;
+  display: flex;
+  overflow: hidden;
 }
 
-@media (max-width: 768px) {
-  .repo-banner {
-    height: 150px;
-  }
-
-  /* Mobile toggle button visible on narrow screens */
-  .mobile-toggle-button {
-    display: inline-flex;
-  }
-
-  /* File tree and editor area full width and height on mobile */
-  .file-tree {
-    width: 100%;
-    flex: 1 1 auto;
-    min-height: 0;
-    flex-basis: auto;
-  }
-
-  .editor-area {
-    width: 100%;
-    flex: 1;
-    min-height: 0;
-    max-height: none;
-  }
-
-  /* Hide the appropriate view based on toggle state */
-  .file-tree.hide-on-mobile {
-    display: none !important;
-  }
-
-  .editor-area.hide-on-mobile {
-    display: none !important;
-  }
-
-  /* Stack layout on mobile */
-  .repo-layout {
-    flex-direction: column;
-    flex: 1;
-    min-height: 0;
-  }
-
-  /* Editor header wraps on mobile */
-  .editor-header {
-    flex-wrap: wrap;
-    gap: 0.25rem;
-    padding: 0.5rem 0.75rem;
-    align-items: flex-start;
-  }
-
-  .file-path {
-    flex: 1 1 100%;
-    min-width: 0;
-    word-break: break-all;
-    margin-bottom: 0;
-    padding-bottom: 0;
-  }
-
-  .editor-actions {
-    flex: 1 1 auto;
-    justify-content: flex-end;
-    min-width: 0;
-    gap: 0.5rem;
-  }
-
-  /* Modal responsive styles */
-  .modal {
-    width: 95%;
-    max-width: 95%;
-    max-height: 90vh;
-    margin: 1rem;
-    padding: 1rem;
-    overflow-y: auto;
-  }
-
-  .modal h3 {
-    font-size: 1.25rem;
-    margin-bottom: 1rem;
-  }
-
-  .modal label {
-    display: block;
-    margin-bottom: 0.75rem;
-    font-size: 0.9rem;
-  }
-
-  .modal input,
-  .modal textarea,
-  .modal select {
-    width: 100%;
-    font-size: 0.9rem;
-    padding: 0.5rem;
-  }
-
-  .modal-actions {
-    flex-direction: column;
-    gap: 0.5rem;
-  }
-
-  .modal-actions button {
-    width: 100%;
-    padding: 0.75rem;
-  }
-
-  /* Issue and PR lists responsive */
-  .issue-item, .pr-item {
-    padding: 0.5rem;
-  }
-
-  .issue-header, .pr-header {
-    flex-wrap: wrap;
-    gap: 0.25rem;
-  }
-
-  .issue-subject, .pr-subject {
-    font-size: 0.9rem;
-    word-break: break-word;
-  }
-
-  .issue-meta, .pr-meta {
-    flex-wrap: wrap;
-    font-size: 0.7rem;
-    gap: 0.5rem;
-  }
-
-  .issue-actions {
-    flex-direction: column;
-    width: 100%;
-  }
-
-  .issue-action-btn {
-    width: 100%;
-    padding: 0.5rem;
-  }
-
-  /* Sidebars responsive */
-  .prs-sidebar, .issues-sidebar {
-    width: 100%;
-    max-width: 100%;
-  }
-
-  .prs-header, .issues-header {
-    flex-wrap: wrap;
-    gap: 0.5rem;
-  }
-
-  .create-pr-button, .create-issue-button {
-    width: 100%;
-    padding: 0.75rem;
-  }
-
-  /* File tree responsive */
-  .file-tree-header {
-    flex-wrap: wrap;
-    gap: 0.5rem;
-  }
-
-  .file-tree-actions {
-    flex-wrap: wrap;
-    gap: 0.5rem;
-  }
-
-  .create-file-button {
-    font-size: 0.85rem;
-    padding: 0.5rem 0.75rem;
-  }
-
-  /* Back button responsive */
-  .back-btn {
-    width: 100%;
-    margin-bottom: 1rem;
-    padding: 0.75rem;
-  }
-
-  .non-maintainer-notice {
-    font-size: 0.7rem;
-    flex: 1 1 100%;
-    order: 2;
-    margin-top: 0;
-    padding-top: 0.25rem;
-    line-height: 1.3;
-  }
+.file-tree {
+  width: 300px;
+  min-width: 300px;
+  max-width: 300px;
+  border-right: 1px solid var(--border-color);
+  background: var(--bg-secondary);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  flex: 0 0 300px;
+  min-height: 0;
 }
 
-/* Desktop: always show both file tree and editor */
-@media (min-width: 769px) {
-  .file-tree.hide-on-mobile {
-    display: flex;
-  }
-
-  .editor-area.hide-on-mobile {
-    display: flex;
-  }
-
-  .mobile-toggle-button {
-    display: none;
-  }
+.file-tree-header {
+  padding: 1rem;
+  border-bottom: 1px solid var(--border-color);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 0.75rem;
+  flex-wrap: wrap;
 }
 
-.fork-badge {
-  padding: 0.25rem 0.5rem;
-  background: var(--accent);
-  color: var(--accent-text, #ffffff);
-  border-radius: 4px;
-  font-size: 0.85rem;
-  margin-left: 0.5rem;
-  font-weight: 600;
-  border: 1px solid var(--accent);
+.file-tree-header h2 {
+  margin: 0;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
 }
 
-.fork-badge a {
-  color: var(--accent-text, #ffffff);
-  text-decoration: none;
-  font-weight: 600;
+.file-list {
+  list-style: none;
+  padding: 0.5rem 0;
+  margin: 0;
+  overflow-y: auto;
+  overflow-x: hidden;
+  flex: 1;
+  min-height: 0;
+  width: 100%;
 }
 
-.fork-badge a:hover {
-  text-decoration: underline;
-  opacity: 1;
+.file-item {
+  margin: 0;
 }
 
-.repo-language {
-  display: inline-flex;
+.file-button {
+  width: 100%;
+  padding: 0.5rem 1rem;
+  text-align: left;
+  background: none;
+  border: none;
+  cursor: pointer;
+  display: flex;
   align-items: center;
-  gap: 0.25rem;
+  gap: 0.5rem;
   font-size: 0.875rem;
-  color: var(--text-secondary);
+  color: var(--text-primary);
   font-weight: 500;
+  transition: background 0.2s ease;
+  box-sizing: border-box;
 }
 
-.repo-language .icon-inline {
-  opacity: 0.9;
-}
-
-.repo-topics {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.5rem;
-  align-items: center;
+.file-button:hover {
+  background: var(--bg-tertiary);
 }
 
-.topic-tag {
-  padding: 0.25rem 0.5rem;
+.file-item.selected .file-button {
   background: var(--accent);
   color: var(--accent-text, #ffffff);
-  border-radius: 0.25rem;
-  font-size: 0.75rem;
   font-weight: 600;
-  border: 1px solid var(--accent);
-}
-
-.repo-website {
-  margin-top: 0.5rem;
-  font-size: 0.875rem;
-}
-
-.repo-website a {
-  color: var(--link-color);
-  text-decoration: none;
-  display: inline-flex;
-  align-items: center;
-  gap: 0.25rem;
-}
-
-.repo-website a:hover {
-  text-decoration: underline;
 }
 
-.repo-clone-urls {
-  margin-top: 0.5rem;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 0.5rem;
+.file-size {
+  color: var(--text-secondary);
   font-size: 0.75rem;
-  width: 100%;
-  max-width: 100%;
-  overflow: hidden;
-}
-
-.clone-label {
-  color: var(--text-muted);
-  font-weight: 500;
+  margin-left: auto;
+  opacity: 0.9;
 }
 
-.clone-url-wrapper {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  flex-wrap: wrap;
-  max-width: 100%;
-  min-width: 0;
-}
-
-.clone-url {
-  padding: 0.125rem 0.375rem;
-  background: var(--bg-secondary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.25rem;
-  font-family: 'IBM Plex Mono', monospace;
-  font-size: 0.75rem;
-  color: var(--text-primary);
-  word-break: break-all;
-  overflow-wrap: break-word;
-  white-space: normal;
-  max-width: 100%;
-  min-width: 0;
-  flex: 1 1 auto;
-  box-sizing: border-box;
-}
-
-.clone-more {
-  color: var(--text-muted);
-  font-size: 0.75rem;
-}
-
-.repo-contributors {
-  margin-top: 0.75rem;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 0.75rem;
-}
-
-.contributors-label {
-  font-size: 0.875rem;
-  color: var(--text-muted);
-  font-weight: 500;
-}
-
-.contributors-list {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 0.5rem;
-}
-
-.contributor-item {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.5rem;
-  text-decoration: none;
-  padding: 0.25rem 0.5rem;
-  border-radius: 0.5rem;
-  background: var(--bg-secondary);
-  border: 1px solid var(--border-color);
-  transition: all 0.2s ease;
-}
-
-.contributor-item:hover {
-  border-color: var(--accent);
-  background: var(--card-bg);
-}
-
-.contributor-item.contributor-owner {
-  background: var(--accent-light);
-  border: 2px solid var(--accent);
-  font-weight: 600;
-  box-shadow: 0 0 0 1px var(--accent-light);
-}
-
-.contributor-item.contributor-owner:hover {
-  background: var(--accent-light);
-  border-color: var(--accent-hover);
-  box-shadow: 0 0 0 2px var(--accent-light);
-}
-
-.contributor-badge {
-  padding: 0.25rem 0.5rem;
-  border-radius: 0.25rem;
-  font-size: 0.7rem;
-  font-weight: 700;
-  text-transform: uppercase;
-  white-space: nowrap;
-  letter-spacing: 0.05em;
-  border: 1px solid transparent;
-  /* Ensure minimum size for touch targets */
-  min-height: 1.5rem;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.contributor-badge.owner {
-  /* High contrast colors for all themes */
-  background: var(--bg-tertiary, #4a5568);
-  color: var(--text-primary, #ffffff);
-  border-color: var(--border-color, #2d3748);
-}
-
-.contributor-badge.maintainer {
-  /* High contrast colors for all themes */
-  background: var(--success-bg, #22543d);
-  color: var(--success-text, #ffffff);
-  border-color: var(--border-color, #1a202c);
-}
-
-.repo-view {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-}
-
-.repo-layout {
-  flex: 1;
-  display: flex;
-  overflow: hidden;
-}
-
-.file-tree {
-  width: 300px;
-  min-width: 300px;
-  max-width: 300px;
-  border-right: 1px solid var(--border-color);
-  background: var(--bg-secondary);
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  flex: 0 0 300px; /* Fixed width, don't grow or shrink */
-  min-height: 0; /* Allow flex child to shrink */
-}
-
-.file-tree-header {
-  padding: 1rem;
-  border-bottom: 1px solid var(--border-color);
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  gap: 0.75rem;
-}
-
-.file-tree-header h2 {
-  margin: 0;
-  font-size: 1rem;
-  color: var(--text-primary);
-}
-
-.back-button {
-  padding: 0.25rem 0.5rem;
-  font-size: 0.875rem;
-  background: var(--bg-tertiary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.25rem;
-  cursor: pointer;
-  color: var(--text-primary);
-  transition: background 0.2s ease;
-}
-
-.back-button:hover {
-  background: var(--bg-secondary);
-}
-
-.file-list {
-  list-style: none;
-  padding: 0.5rem 0;
-  margin: 0;
-  overflow-y: auto;
-  overflow-x: hidden;
-  flex: 1;
-  min-height: 0; /* Allows flex child to shrink below content size */
-  width: 100%; /* Fill horizontal space */
-}
-
-.file-item {
-  margin: 0;
-}
-
-.file-button {
-  width: 100%;
-  padding: 0.5rem 1rem;
-  text-align: left;
-  background: none;
-  border: none;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  font-size: 0.875rem;
-  color: var(--text-primary);
-  font-weight: 500;
-  transition: background 0.2s ease, color 0.2s ease;
-  box-sizing: border-box;
-}
-
-.file-button:hover {
-  background: var(--bg-tertiary);
-  color: var(--text-primary);
-}
-
-.file-item.selected .file-button {
-  background: var(--accent);
-  color: var(--accent-text, #ffffff);
-  font-weight: 600;
-}
-
-.file-item.selected .file-button:hover {
-  background: var(--accent-hover);
-  color: var(--accent-text, #ffffff);
-}
-
-.file-size {
-  color: var(--text-secondary);
-  font-size: 0.75rem;
-  margin-left: auto;
-  opacity: 0.9;
-}
-
-.file-item.selected .file-size {
-  color: var(--accent-text, #ffffff);
-  opacity: 0.9;
-}
-
-.editor-area {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  background: var(--card-bg);
-  max-height: calc(200vh - 400px); /* Twice the original height */
-}
-
-.editor-header {
-  padding: 0.75rem 1rem;
-  border-bottom: 1px solid var(--border-color);
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.file-path {
-  font-family: 'IBM Plex Mono', monospace;
-  font-size: 0.875rem;
-  color: var(--text-primary);
-}
-
-.editor-actions {
-  display: flex;
-  align-items: center;
-  gap: 1rem;
-  flex-wrap: wrap;
-}
-
-.unsaved-indicator {
-  color: var(--warning-text);
-  font-size: 0.875rem;
-}
-
-.non-maintainer-notice {
-  font-size: 0.75rem;
-  color: var(--text-muted);
-  white-space: normal;
-  line-height: 1.4;
-}
-
-.save-button {
-  padding: 0.5rem 1rem;
-  background: var(--button-primary);
-  color: var(--accent-text, #ffffff);
-  border: none;
-  border-radius: 0.25rem;
-  cursor: pointer;
-  font-size: 0.875rem;
-  font-family: 'IBM Plex Serif', serif;
-  transition: background 0.2s ease;
-}
-
-.save-button:hover:not(:disabled) {
-  background: var(--button-primary-hover);
-}
-
-.save-button:disabled {
-  background: var(--text-muted);
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.editor-container {
-  flex: 1;
-  overflow: hidden;
-  display: flex;
-  flex-direction: column;
-  min-height: 0; /* Allows flex child to shrink below content size */
-}
-
-.empty-state {
-  flex: 1;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--text-muted);
-}
-
-.loading {
-  padding: 2rem;
-  text-align: center;
-  color: var(--text-muted);
-}
-
-.error {
-  background: var(--error-bg);
-  color: var(--error-text);
-  padding: 1rem;
-  margin: 1rem;
-  border-radius: 0.5rem;
-  border: 1px solid var(--error-text);
-}
-
-.modal-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.5);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1000;
-}
-
-.modal {
-  background: var(--card-bg);
-  padding: 2rem;
-  border-radius: 0.5rem;
-  min-width: 400px;
-  max-width: 600px;
-  border: 1px solid var(--border-color);
-}
-
-.modal h3 {
-  margin: 0 0 1rem 0;
-  color: var(--text-primary);
-}
-
-.verification-modal {
-  max-width: 800px;
-  min-width: 600px;
-  max-height: 90vh;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-}
-
-.modal-header {
-  flex-shrink: 0;
-  margin-bottom: 1rem;
-}
-
-.modal-body {
-  flex: 1;
-  overflow-y: auto;
-  min-height: 0;
-}
-
-.verification-instructions {
-  color: var(--text-secondary);
-  margin-bottom: 1rem;
-  line-height: 1.6;
-}
-
-.verification-instructions code {
-  background: var(--bg-secondary);
-  padding: 0.125rem 0.375rem;
-  border-radius: 0.25rem;
-  font-family: monospace;
-  color: var(--accent);
-}
-
-.verification-file-content {
-  background: var(--bg-secondary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.375rem;
-  overflow: hidden;
-  margin-bottom: 1rem;
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  min-height: 0;
-}
-
-.file-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 0.75rem 1rem;
-  background: var(--bg-tertiary);
-  border-bottom: 1px solid var(--border-color);
-}
-
-.filename {
-  font-family: monospace;
-  font-weight: 500;
-  color: var(--text-primary);
-}
-
-.file-actions {
-  display: flex;
-  gap: 0.5rem;
-}
-
-.copy-button,
-.download-button {
-  padding: 0.375rem 0.75rem;
-  background: var(--bg-primary);
-  color: var(--text-primary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.25rem;
-  font-size: 0.875rem;
-  cursor: pointer;
-  transition: all 0.2s ease;
-}
-
-.copy-button:hover,
-.download-button:hover {
-  background: var(--bg-secondary);
-  border-color: var(--accent);
-}
-
-.file-content {
-  margin: 0;
-  padding: 1rem;
-  overflow-x: auto;
-  overflow-y: auto;
-  background: var(--bg-primary);
-  max-height: 400px;
-}
-
-.file-content code {
-  font-family: 'Courier New', monospace;
-  font-size: 0.875rem;
-  color: var(--text-primary);
-  white-space: pre;
-}
-
-.modal label {
-  display: block;
-  margin-bottom: 1rem;
-  color: var(--text-primary);
-}
-
-.modal input,
-.modal textarea,
-.modal select {
-  width: 100%;
-  padding: 0.5rem;
-  border: 1px solid var(--input-border);
-  border-radius: 0.25rem;
-  font-family: 'IBM Plex Serif', serif;
-  background: var(--input-bg);
-  color: var(--text-primary);
-  margin-top: 0.5rem;
-}
-
-.modal input:focus,
-.modal textarea:focus,
-.modal select:focus {
-  outline: none;
-  border-color: var(--input-focus);
-}
-
-.modal-actions {
-  display: flex;
-  justify-content: flex-end;
-  gap: 1rem;
-}
-
-.cancel-button {
-  padding: 0.5rem 1rem;
-  background: var(--bg-tertiary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.25rem;
-  cursor: pointer;
-  color: var(--text-primary);
-  font-family: 'IBM Plex Serif', serif;
-  transition: background 0.2s ease;
-}
-
-.cancel-button:hover {
-  background: var(--bg-secondary);
-}
-
-/* File tree actions */
-.file-tree-actions {
-  display: flex;
-  gap: 0.5rem;
-}
-
-.create-file-button, .create-tag-button {
-  padding: 0.25rem 0.5rem;
-  font-size: 0.75rem;
-  background: var(--button-primary);
-  color: white;
-  border: none;
-  border-radius: 0.25rem;
-  cursor: pointer;
-  font-family: 'IBM Plex Serif', serif;
-  transition: background 0.2s ease;
-}
-
-.create-file-button:hover, .create-tag-button:hover {
-  background: var(--button-primary-hover);
-}
-
-.delete-file-button {
-  padding: 0.25rem;
-  background: none;
-  border: none;
-  cursor: pointer;
-  font-size: 0.75rem;
-  opacity: 0.6;
-}
-
-.delete-file-button:hover {
-  opacity: 1;
-}
-
-.file-item {
-  display: flex;
-  align-items: center;
-}
-
-.file-item .file-button {
-  flex: 1;
-}
-
-/* History sidebar */
-.history-sidebar, .tags-sidebar {
-  width: 300px;
-  border-right: 1px solid var(--border-color);
-  background: var(--bg-secondary);
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-}
-
-.history-header, .tags-header {
-  padding: 1rem;
-  border-bottom: 1px solid var(--border-color);
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  gap: 0.75rem;
-}
-
-.history-header h2, .tags-header h2 {
-  margin: 0;
-  font-size: 1rem;
-  color: var(--text-primary);
-}
-
-.refresh-button {
-  padding: 0.25rem 0.5rem;
-  font-size: 0.75rem;
-  background: var(--bg-tertiary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.25rem;
-  cursor: pointer;
-  color: var(--text-primary);
-  transition: background 0.2s ease;
-  display: inline-flex;
-  align-items: center;
-  gap: 0.375rem;
-}
-
-.refresh-button:hover {
-  background: var(--bg-secondary);
-}
-
-.refresh-button .icon-inline {
-  width: 0.875rem;
-  height: 0.875rem;
-}
-
-.commit-list, .tag-list {
-  list-style: none;
-  padding: 0;
-  margin: 0;
-  overflow-y: auto;
-  flex: 1;
-}
-
-.commit-item, .tag-item {
-  border-bottom: 1px solid var(--border-color);
-}
-
-.commit-button {
-  width: 100%;
-  padding: 0.75rem 1rem;
-  text-align: left;
-  background: none;
-  border: none;
-  cursor: pointer;
-  display: block;
-}
-
-.commit-button:hover {
-  background: var(--bg-tertiary);
-}
-
-.commit-item.selected .commit-button {
-  background: var(--accent);
-  color: var(--accent-text, #ffffff);
-}
-
-.commit-hash {
-  font-family: 'IBM Plex Mono', monospace;
-  font-size: 0.75rem;
-  color: var(--text-muted);
-  margin-bottom: 0.25rem;
-}
-
-.commit-message {
-  font-weight: 500;
-  margin-bottom: 0.25rem;
-  color: var(--text-primary);
-}
-
-.commit-meta {
-  font-size: 0.75rem;
-  color: var(--text-muted);
-  display: flex;
-  gap: 1rem;
-}
-
-.tag-item {
-  padding: 0.75rem 1rem;
-}
-
-.tag-name {
-  font-weight: 500;
-  color: var(--link-color);
-  margin-bottom: 0.25rem;
-}
-
-.tag-hash {
-  font-family: 'IBM Plex Mono', monospace;
-  font-size: 0.75rem;
-  color: var(--text-muted);
-  margin-bottom: 0.25rem;
-}
-
-.tag-message {
-  font-size: 0.875rem;
-  color: var(--text-muted);
-}
-
-/* Diff view */
-.diff-view {
-  flex: 1;
-  overflow: auto;
-  padding: 1rem;
-}
-
-.diff-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 1rem;
-  padding-bottom: 0.5rem;
-  border-bottom: 1px solid var(--border-color);
-}
-
-.diff-header h3 {
-  margin: 0;
-  color: var(--text-primary);
-}
-
-.close-button {
-  padding: 0.25rem 0.5rem;
-  background: var(--bg-tertiary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.25rem;
-  cursor: pointer;
-  font-size: 1.25rem;
-  line-height: 1;
-  color: var(--text-primary);
-  transition: background 0.2s ease;
-}
-
-.close-button:hover {
-  background: var(--bg-secondary);
-}
-
-.diff-file {
-  margin-bottom: 2rem;
-}
-
-.diff-file-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 0.5rem;
-  background: var(--bg-secondary);
-  border-radius: 0.25rem;
-  margin-bottom: 0.5rem;
-}
-
-.diff-file-name {
-  font-family: 'IBM Plex Mono', monospace;
-  font-weight: 500;
-  color: var(--text-primary);
-}
-
-.diff-stats {
-  display: flex;
-  gap: 0.5rem;
-}
-
-.additions {
-  color: var(--success-text);
-}
-
-.deletions {
-  color: var(--error-text);
-}
-
-.diff-content {
-  background: var(--bg-tertiary);
-  color: var(--text-primary);
-  padding: 1rem;
-  border-radius: 0.25rem;
-  overflow-x: auto;
-  font-size: 0.875rem;
-  line-height: 1.5;
-  border: 1px solid var(--border-color);
-}
-
-.diff-content code {
-  font-family: 'IBM Plex Mono', monospace;
-  white-space: pre;
-}
-
-.read-only-editor {
-  height: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  padding: 1.5rem;
-  min-height: 0; /* Allows flex child to shrink below content size */
-}
-
-.read-only-editor :global(.hljs) {
-  padding: 1rem;
-  background: var(--bg-tertiary);
-  color: var(--text-primary);
-  border-radius: 4px;
-  overflow-x: auto;
-  margin: 0;
-  border: 1px solid var(--border-color);
-}
-
-.read-only-editor :global(pre) {
-  margin: 0;
-  padding: 0;
-}
-
-.read-only-editor :global(code) {
-  font-family: 'IBM Plex Mono', monospace;
-  font-size: 14px;
-  line-height: 1.5;
-  display: block;
-  white-space: pre;
-}
-
-.readme-section {
+.editor-area {
+  flex: 1;
   display: flex;
   flex-direction: column;
-  height: 100%;
   overflow: hidden;
-}
-
-.readme-header {
-  padding: 1rem;
-  border-bottom: 1px solid var(--border-color);
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  flex-shrink: 0;
-}
-
-.readme-header h3 {
-  margin: 0;
-  font-size: 1.25rem;
-  color: var(--text-primary);
-}
-
-.readme-actions {
-  display: flex;
-  gap: 1rem;
-  align-items: center;
-}
-
-.discussions-content {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  overflow-y: auto;
-  overflow-x: hidden;
   background: var(--card-bg);
-  min-height: 0; /* Allows flex child to shrink below content size */
-}
-
-.discussions-header {
-  padding: 1rem 1.5rem;
-  border-bottom: 1px solid var(--border-color);
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  flex-shrink: 0;
-  gap: 0.75rem;
-}
-
-@media (max-width: 767px) {
-  .discussions-header {
-    padding: 0.75rem 1rem;
-  }
-}
-
-.discussions-actions {
-  display: flex;
-  gap: 0.75rem;
-  align-items: center;
-}
-
-.btn-secondary {
-  padding: 0.5rem 1rem;
-  background: var(--bg-secondary);
-  border: 1px solid var(--border-color);
-  border-radius: 0.25rem;
-  color: var(--text-primary);
-  cursor: pointer;
-  font-size: 0.875rem;
-  transition: background 0.2s;
-}
-
-.btn-secondary:hover:not(:disabled) {
-  background: var(--bg-tertiary);
-}
-
-.btn-secondary:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-.discussions-header h2 {
-  margin: 0;
-  font-size: 1.25rem;
-  color: var(--text-primary);
-}
-
-@media (max-width: 767px) {
-  .discussions-header h2 {
-    display: none;
-  }
-}
-
-.discussion-item {
-  padding: 1rem 1.5rem;
-  border-bottom: 1px solid var(--border-color);
-}
-
-.discussion-header {
-  margin-bottom: 0.5rem;
-}
-
-.discussion-header h3 {
-  margin: 0 0 0.25rem 0;
-  font-size: 1.1rem;
-  color: var(--text-primary);
-}
-
-.discussion-meta {
-  display: flex;
-  gap: 1rem;
-  font-size: 0.875rem;
-  color: var(--text-muted);
-}
-
-.discussion-type {
-  padding: 0.125rem 0.5rem;
-  border-radius: 0.25rem;
-  background: var(--bg-secondary);
-  font-weight: 500;
-}
-
-.discussion-body {
-  margin-top: 0.5rem;
-  color: var(--text-primary);
-  white-space: pre-wrap;
-}
-
-.discussion-title-row {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-}
-
-.expand-button {
-  background: none;
-  border: none;
-  color: var(--text-muted);
-  cursor: pointer;
-  font-size: 0.75rem;
-  padding: 0.25rem 0.5rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  min-width: 1.5rem;
-  transition: color 0.2s;
-}
-
-.expand-button:hover {
-  color: var(--text-primary);
-}
-
-.comment-count {
-  font-weight: 500;
-}
-
-.btn-small {
-  padding: 0.25rem 0.75rem;
-  font-size: 0.875rem;
-}
-
-.comments-section {
-  margin-top: 1rem;
-  padding-top: 1rem;
-  border-top: 1px solid var(--border-color);
-}
-
-.comments-section h4 {
-  margin: 0 0 0.75rem 0;
-  font-size: 0.9rem;
-  color: var(--text-muted);
-  font-weight: 500;
-}
-
-.comment-item {
-  padding: 0.75rem 0;
-  border-bottom: 1px solid var(--border-light);
-}
-
-.comment-item:last-child {
-  border-bottom: none;
 }
 
-.comment-meta {
+.editor-header {
+  padding: 0.75rem 1rem;
+  border-bottom: 1px solid var(--border-color);
   display: flex;
-  gap: 0.75rem;
+  justify-content: space-between;
   align-items: center;
-  margin-bottom: 0.5rem;
-  font-size: 0.875rem;
-  color: var(--text-muted);
 }
 
-.comment-content {
+.file-path {
+  font-family: 'IBM Plex Mono', monospace;
+  font-size: 0.875rem;
   color: var(--text-primary);
-  white-space: pre-wrap;
-  line-height: 1.5;
 }
 
-.referenced-event {
-  margin-bottom: 1rem;
-  padding: 0.75rem;
-  background: var(--bg-primary);
-  border-left: 3px solid var(--border-color);
-  border-radius: 0.5rem;
-  font-size: 0.875rem;
+.editor-actions {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  flex-wrap: wrap;
 }
 
-:global([data-theme="light"]) .referenced-event {
-  background: #e8e8e8;
+.save-button {
+  padding: 0.5rem 1rem;
+  background: var(--button-primary);
+  color: var(--accent-text, #ffffff);
+  border: none;
+  border-radius: 0.25rem;
+  cursor: pointer;
+  font-size: 0.875rem;
+  transition: background 0.2s ease;
 }
 
-:global([data-theme="dark"]) .referenced-event {
-  background: rgba(0, 0, 0, 0.2);
+.save-button:hover:not(:disabled) {
+  background: var(--button-primary-hover);
 }
 
-:global([data-theme="black"]) .referenced-event {
-  background: #0a0a0a;
+.save-button:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
 }
 
-.referenced-event-header {
+.editor-container {
+  flex: 1;
+  overflow: hidden;
   display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  margin-bottom: 0.5rem;
-}
-
-.referenced-event-time {
-  font-size: 0.75rem;
-  color: var(--text-muted);
+  flex-direction: column;
+  min-height: 0;
 }
 
-.referenced-event-content {
-  color: var(--text-secondary);
-  white-space: pre-wrap;
-  word-wrap: break-word;
+.read-only-editor {
+  flex: 1;
+  overflow-y: auto;
+  overflow-x: auto;
+  padding: 1.5rem;
+  min-height: 0;
+  background: var(--card-bg);
+  font-family: 'IBM Plex Mono', monospace;
+  font-size: 0.875rem;
   line-height: 1.5;
-  max-height: 10rem;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  color: var(--text-primary);
+  position: relative;
+  contain: layout style;
+}
+
+/* Word wrap toggle - override all overflow and white-space properties */
+.read-only-editor.word-wrap {
+  overflow-x: hidden !important;
+}
+
+/* Target all pre elements inside word-wrap container */
+.read-only-editor.word-wrap :global(pre) {
+  white-space: pre-wrap !important;
+  word-wrap: break-word !important;
+  overflow-wrap: break-word !important;
+  overflow-x: hidden !important;
+  overflow-y: visible !important;
+  max-width: 100% !important;
+}
+
+/* Target all code elements inside pre */
+.read-only-editor.word-wrap :global(pre code) {
+  white-space: pre-wrap !important;
+  word-wrap: break-word !important;
+  overflow-wrap: break-word !important;
+  overflow-x: hidden !important;
+  overflow-y: visible !important;
+  display: block !important;
+  max-width: 100% !important;
+}
+
+/* Specifically target .hljs class with higher specificity */
+.read-only-editor.word-wrap :global(pre code.hljs),
+.read-only-editor.word-wrap :global(code.hljs),
+.read-only-editor.word-wrap :global(.hljs) {
+  white-space: pre-wrap !important;
+  word-wrap: break-word !important;
+  overflow-wrap: break-word !important;
+  overflow-x: hidden !important;
+  overflow-y: visible !important;
+  display: block !important;
+  max-width: 100% !important;
+}
+
+/* Target all nested elements inside hljs code blocks */
+.read-only-editor.word-wrap :global(pre code.hljs *),
+.read-only-editor.word-wrap :global(pre code.hljs span),
+.read-only-editor.word-wrap :global(pre code.hljs > *),
+.read-only-editor.word-wrap :global(code.hljs *),
+.read-only-editor.word-wrap :global(.hljs *) {
+  white-space: pre-wrap !important;
+}
+
+.read-only-editor > * {
+  position: relative;
+  z-index: 0;
 }
 
-.nostr-link-event {
-  margin: 0.75rem 0;
-  padding: 0.75rem;
-  background: var(--bg-primary);
-  border-left: 3px solid var(--border-color);
-  border-radius: 0.5rem;
-  font-size: 0.875rem;
+/* Ensure the HTML content wrapper doesn't cause overlap */
+.read-only-editor :global(> pre:first-child) {
+  margin-top: 0 !important;
 }
 
-:global([data-theme="light"]) .nostr-link-event {
-  background: #e8e8e8;
+.read-only-editor :global(> pre:last-child) {
+  margin-bottom: 0 !important;
 }
 
-:global([data-theme="dark"]) .nostr-link-event {
-  background: rgba(0, 0, 0, 0.2);
+/* File viewer code blocks - unified styling, let .hljs handle everything */
+.read-only-editor :global(pre) {
+  margin: 0;
+  padding: 0;
+  background: transparent;
+  border: none;
+  overflow: visible;
 }
 
-:global([data-theme="black"]) .nostr-link-event {
-  background: #0a0a0a;
+.read-only-editor :global(pre + pre) {
+  margin-top: 1rem;
 }
 
-.nostr-link-event-header {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  margin-bottom: 0.5rem;
-}
+/* Code blocks use unified .hljs styling from app.css - no overrides needed */
 
-.nostr-link-event-time {
-  font-size: 0.75rem;
+.loading {
+  padding: 2rem;
+  text-align: center;
   color: var(--text-muted);
 }
 
-.nostr-link-event-content {
-  color: var(--text-secondary);
-  white-space: pre-wrap;
-  word-wrap: break-word;
-  line-height: 1.5;
-  max-height: 10rem;
-  overflow: hidden;
-  text-overflow: ellipsis;
+.error {
+  background: var(--error-bg);
+  color: var(--error-text);
+  padding: 1rem;
+  margin: 1rem;
+  border-radius: 0.5rem;
+  border: 1px solid var(--error-text);
 }
 
-.nostr-link-placeholder {
-  color: var(--text-muted);
-  font-style: italic;
+.readme-section {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  overflow: hidden;
 }
 
-.nested-replies {
-  margin-left: 2rem;
-  margin-top: 0.75rem;
-  padding-left: 1rem;
-  border-left: 2px solid var(--border-light);
+.readme-header {
+  padding: 1rem;
+  border-bottom: 1px solid var(--border-color);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-shrink: 0;
 }
 
-.nested-comment {
-  margin-top: 0.75rem;
+.readme-header h3 {
+  margin: 0;
+  font-size: 1.25rem;
+  color: var(--text-primary);
 }
 
 .readme-content {
@@ -1507,26 +342,21 @@
   overflow-y: auto;
   overflow-x: hidden;
   padding: 1.5rem;
-  min-height: 0; /* Allows flex child to shrink below content size */
+  min-height: 0;
 }
 
+/* Markdown README styling - proper line-height for readability */
+/* Only apply to .readme-content.markdown, not to .read-only-editor */
 .readme-content.markdown {
-  padding: 1.5rem;
-  line-height: 1.7;
+  line-height: 1.6;
   font-size: 1rem;
-  color: var(--text-primary, #1a1a1a);
-}
-
-.readme-content.markdown :global(*) {
-  line-height: inherit;
-}
-
-.readme-content.markdown :global(*:first-child) {
-  margin-top: 0;
+  color: var(--text-primary);
+  font-family: inherit;
 }
 
-.readme-content.markdown :global(*:last-child) {
-  margin-bottom: 0;
+.readme-content.markdown :global(p) {
+  margin: 0 0 1rem 0;
+  line-height: 1.6;
 }
 
 .readme-content.markdown :global(h1),
@@ -1539,69 +369,68 @@
   margin-bottom: 0.75rem;
   color: var(--text-primary);
   line-height: 1.4;
+  font-weight: 600;
 }
 
 .readme-content.markdown :global(h1:first-child),
 .readme-content.markdown :global(h2:first-child),
-.readme-content.markdown :global(h3:first-child),
-.readme-content.markdown :global(h4:first-child),
-.readme-content.markdown :global(h5:first-child),
-.readme-content.markdown :global(h6:first-child) {
-  margin-top: 0;
-}
-
-.readme-content.markdown :global(p) {
+.readme-content.markdown :global(h3:first-child) {
   margin-top: 0;
-  margin-bottom: 1rem;
-  line-height: 1.7;
 }
 
-.readme-content.markdown :global(code) {
-  background: var(--bg-secondary);
-  padding: 0.2rem 0.4rem;
-  border-radius: 3px;
-  font-family: 'IBM Plex Mono', monospace;
-  font-size: 0.9em;
-  line-height: 1.5;
+.readme-content.markdown :global(h1) {
+  font-size: 2rem;
+  border-bottom: 2px solid var(--border-color);
+  padding-bottom: 0.5rem;
 }
 
-.readme-content.markdown :global(pre) {
-  background: var(--bg-secondary);
-  padding: 1rem;
-  border-radius: 4px;
-  overflow-x: auto;
-  border: 1px solid var(--border-light);
-  margin: 1rem 0;
-  line-height: 1.5;
+.readme-content.markdown :global(h2) {
+  font-size: 1.5rem;
 }
 
-.readme-content.markdown :global(pre code) {
-  background: none;
-  padding: 0;
+.readme-content.markdown :global(h3) {
+  font-size: 1.25rem;
 }
 
 .readme-content.markdown :global(ul),
 .readme-content.markdown :global(ol) {
   margin: 1rem 0;
   padding-left: 2rem;
-  line-height: 1.7;
+  line-height: 1.6;
 }
 
 .readme-content.markdown :global(li) {
   margin: 0.5rem 0;
-  line-height: 1.7;
+  line-height: 1.6;
+}
+
+/* Inline code in markdown README - uses app.css code:not(pre code) styling */
+
+/* Code blocks in markdown README - unified styling, let .hljs handle everything */
+.readme-content.markdown :global(pre) {
+  margin: 0 0 1rem 0;
+  padding: 0;
+  background: transparent;
+  border: none;
+  overflow: visible;
+}
+
+.readme-content.markdown :global(pre:last-child) {
+  margin-bottom: 0;
 }
 
+/* Code blocks use unified .hljs styling from app.css */
+
 .readme-content.markdown :global(blockquote) {
-  border-left: 4px solid var(--border-color, #e0e0e0);
+  border-left: 4px solid var(--border-color);
   padding-left: 1rem;
   margin: 1rem 0;
-  color: var(--text-secondary, #666);
+  color: var(--text-secondary);
   font-style: italic;
 }
 
 .readme-content.markdown :global(a) {
-  color: var(--accent, #007bff);
+  color: var(--accent);
   text-decoration: none;
 }
 
@@ -1616,207 +445,157 @@
   margin: 1rem 0;
 }
 
+/* Tables in markdown README only */
 .readme-content.markdown :global(table) {
   width: 100%;
   border-collapse: collapse;
   margin: 1rem 0;
 }
 
-.readme-content.markdown :global(th),
-.readme-content.markdown :global(td) {
-  border: 1px solid var(--border-color, #e0e0e0);
+.readme-content.markdown :global(table th),
+.readme-content.markdown :global(table td) {
+  border: 1px solid var(--border-color);
   padding: 0.5rem;
   text-align: left;
 }
 
-.readme-content.markdown :global(th) {
-  background: var(--bg-secondary, #f5f5f5);
+.readme-content.markdown :global(table th) {
+  background: var(--bg-secondary);
   font-weight: 600;
 }
 
 .readme-content.markdown :global(hr) {
   border: none;
-  border-top: 1px solid var(--border-color, #e0e0e0);
+  border-top: 1px solid var(--border-color);
   margin: 2rem 0;
 }
 
-.readme-content.markdown :global(strong),
-.readme-content.markdown :global(b) {
-  font-weight: 600;
-  color: var(--text-primary, #1a1a1a);
-}
-
-.readme-content.markdown :global(em),
-.readme-content.markdown :global(i) {
-  font-style: italic;
-}
-
-.readme-content.markdown :global(h1) {
-  font-size: 2rem;
-  font-weight: 700;
-  margin-top: 2rem;
-  margin-bottom: 1rem;
-  border-bottom: 2px solid var(--border-color, #e0e0e0);
-  padding-bottom: 0.5rem;
-}
-
-.readme-content.markdown :global(h2) {
-  font-size: 1.5rem;
-  font-weight: 600;
-  margin-top: 1.5rem;
-  margin-bottom: 0.75rem;
-}
-
-.readme-content.markdown :global(h3) {
-  font-size: 1.25rem;
-  font-weight: 600;
-  margin-top: 1.25rem;
-  margin-bottom: 0.5rem;
-}
-
-.readme-content.markdown :global(h4) {
-  font-size: 1.1rem;
-  font-weight: 600;
-  margin-top: 1rem;
-  margin-bottom: 0.5rem;
-}
-
-.readme-content.markdown :global(h5) {
-  font-size: 1rem;
-  font-weight: 600;
-  margin-top: 0.75rem;
-  margin-bottom: 0.5rem;
-}
-
-.readme-content.markdown :global(h6) {
-  font-size: 0.9rem;
-  font-weight: 600;
-  margin-top: 0.75rem;
-  margin-bottom: 0.5rem;
-  color: var(--text-secondary, #666);
-}
+/* Mobile responsive */
+@media (max-width: 768px) {
+  .file-tree {
+    width: 100%;
+    flex: 1 1 auto;
+  }
 
-.readme-content :global(.hljs) {
-  background: var(--bg-secondary);
-  padding: 1rem;
-  border-radius: 4px;
-  overflow-x: auto;
-  border: 1px solid var(--border-light);
-}
+  .editor-area {
+    width: 100%;
+    flex: 1;
+  }
 
-.readme-content :global(pre.hljs) {
-  margin: 1rem 0;
-}
+  .file-tree.hide-on-mobile {
+    display: none !important;
+  }
 
-/* Documentation */
-.docs-header {
-  padding: 1rem 1.5rem;
-  border-bottom: 1px solid var(--border-color);
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  flex-shrink: 0;
-  gap: 0.75rem;
-}
+  .editor-area.hide-on-mobile {
+    display: none !important;
+  }
 
-.docs-header h2 {
-  margin: 0;
-  font-size: 1.25rem;
-  color: var(--text-primary);
-}
+  .repo-layout {
+    flex-direction: column;
+  }
 
-.docs-content {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  background: var(--card-bg);
+  .mobile-toggle-button {
+    display: inline-flex;
+    padding: 0.5rem;
+    background: var(--bg-tertiary);
+    border: 1px solid var(--border-color);
+    border-radius: 4px;
+    cursor: pointer;
+  }
 }
 
-.documentation-body {
-  flex: 1;
-  overflow-y: auto;
-  overflow-x: hidden;
-  padding: 1.5rem;
-  min-height: 0;
-}
+@media (min-width: 769px) {
+  .file-tree.hide-on-mobile {
+    display: flex;
+  }
 
-.documentation-body :global(h1),
-.documentation-body :global(h2),
-.documentation-body :global(h3),
-.documentation-body :global(h4),
-.documentation-body :global(h5),
-.documentation-body :global(h6) {
-  margin-top: 1.5rem;
-  margin-bottom: 0.75rem;
-  color: var(--text-primary);
-}
+  .editor-area.hide-on-mobile {
+    display: flex;
+  }
 
-.documentation-body :global(p) {
-  margin-bottom: 1rem;
-  line-height: 1.6;
+  .mobile-toggle-button {
+    display: none;
+  }
 }
 
-.documentation-body :global(code) {
-  background: var(--bg-secondary);
-  padding: 0.2rem 0.4rem;
-  border-radius: 3px;
-  font-family: 'IBM Plex Mono', monospace;
-  font-size: 0.9em;
+/* Additional utility classes */
+.fork-badge {
+  padding: 0.25rem 0.5rem;
+  background: var(--accent);
+  color: var(--accent-text, #ffffff);
+  border-radius: 4px;
+  font-size: 0.85rem;
+  margin-left: 0.5rem;
+  font-weight: 600;
 }
 
-.documentation-body :global(pre) {
-  background: var(--bg-secondary);
-  padding: 1rem;
-  border-radius: 4px;
-  overflow-x: auto;
-  border: 1px solid var(--border-light);
-  margin: 1rem 0;
+.repo-language {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  font-size: 0.875rem;
+  color: var(--text-secondary);
 }
 
-.documentation-body :global(pre code) {
-  background: none;
-  padding: 0;
+.repo-topics {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem;
 }
 
-.documentation-body :global(.hljs) {
-  background: var(--bg-secondary);
-  padding: 1rem;
-  border-radius: 4px;
-  overflow-x: auto;
-  border: 1px solid var(--border-light);
+.topic-tag {
+  padding: 0.25rem 0.5rem;
+  background: var(--accent);
+  color: var(--accent-text, #ffffff);
+  border-radius: 0.25rem;
+  font-size: 0.75rem;
+  font-weight: 600;
 }
 
-.documentation-body :global(pre.hljs) {
-  margin: 1rem 0;
+.repo-clone-urls {
+  margin-top: 0.5rem;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.75rem;
 }
 
-/* Issues and PRs */
-.issues-sidebar, .prs-sidebar {
-  width: 300px;
-  border-right: 1px solid var(--border-color);
+.clone-url {
+  padding: 0.125rem 0.375rem;
   background: var(--bg-secondary);
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
+  border: 1px solid var(--border-color);
+  border-radius: 0.25rem;
+  font-family: 'IBM Plex Mono', monospace;
+  font-size: 0.75rem;
+  word-break: break-all;
 }
 
-.issues-header, .prs-header {
-  padding: 1rem;
-  border-bottom: 1px solid var(--border-color);
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  gap: 0.75rem;
+.icon-inline {
+  width: 1em;
+  height: 1em;
+  vertical-align: middle;
+  display: inline-block;
 }
 
-.issues-header h2, .prs-header h2 {
-  margin: 0;
-  font-size: 1rem;
+.icon-small {
+  width: 16px;
+  height: 16px;
+  vertical-align: middle;
+}
+
+.back-button {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  border-radius: 0.25rem;
+  cursor: pointer;
   color: var(--text-primary);
 }
 
-.create-issue-button, .create-pr-button {
+.create-file-button,
+.create-tag-button {
   padding: 0.25rem 0.5rem;
   font-size: 0.75rem;
   background: var(--button-primary);
@@ -1824,160 +603,149 @@
   border: none;
   border-radius: 0.25rem;
   cursor: pointer;
-  font-family: 'IBM Plex Serif', serif;
   transition: background 0.2s ease;
 }
 
-.create-issue-button:hover, .create-pr-button:hover {
+.create-file-button:hover,
+.create-tag-button:hover {
   background: var(--button-primary-hover);
 }
 
-.issue-list, .pr-list {
-  list-style: none;
-  padding: 0;
-  margin: 0;
-  overflow-y: auto;
-  flex: 1;
-}
-
-.issue-actions {
-  display: flex;
-  gap: 0.5rem;
-  margin-top: 0.5rem;
-  flex-wrap: wrap;
-}
-
-.issue-action-btn {
-  padding: 0.4rem 0.8rem;
+.delete-file-button {
+  padding: 0.25rem;
+  background: none;
   border: none;
-  border-radius: 4px;
   cursor: pointer;
-  font-size: 0.85rem;
-  font-family: 'IBM Plex Serif', serif;
-  transition: background 0.2s ease;
-}
-
-.issue-action-btn:disabled {
   opacity: 0.6;
-  cursor: not-allowed;
-}
-
-.issue-action-btn.close-btn {
-  background: var(--error-text, #dc3545);
-  color: white;
 }
 
-.issue-action-btn.close-btn:hover:not(:disabled) {
-  background: var(--error-hover, #c82333);
+.delete-file-button:hover {
+  opacity: 1;
 }
 
-.issue-action-btn.resolve-btn {
-  background: var(--success-text, #28a745);
-  color: white;
+.file-tree-actions {
+  display: flex;
+  gap: 0.5rem;
 }
 
-.issue-action-btn.resolve-btn:hover:not(:disabled) {
-  background: var(--success-hover, #218838);
+.word-wrap-button {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.75rem;
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  border-radius: 0.25rem;
+  cursor: pointer;
+  color: var(--text-primary);
+  margin-left: 0.5rem;
+  transition: background 0.2s ease;
 }
 
-.issue-action-btn.reopen-btn {
-  background: var(--accent, #007bff);
-  color: white;
+.word-wrap-button:hover {
+  background: var(--bg-secondary);
 }
 
-.issue-action-btn.reopen-btn:hover:not(:disabled) {
-  background: var(--accent-hover, #0056b3);
+/* History, tags, issues, PRs sidebars */
+.history-sidebar,
+.tags-sidebar,
+.issues-sidebar,
+.prs-sidebar {
+  width: 300px;
+  border-right: 1px solid var(--border-color);
+  background: var(--bg-secondary);
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
 }
 
-.issue-item, .pr-item {
-  padding: 0.75rem 1rem;
+.history-header,
+.tags-header,
+.issues-header,
+.prs-header {
+  padding: 1rem;
   border-bottom: 1px solid var(--border-color);
-  cursor: pointer;
-  transition: background 0.2s ease;
-}
-
-.issue-item:hover, .pr-item:hover {
-  background: var(--bg-tertiary);
-}
-
-.issue-header, .pr-header {
   display: flex;
+  justify-content: space-between;
   align-items: center;
-  gap: 0.5rem;
-  margin-bottom: 0.25rem;
+  gap: 0.75rem;
 }
 
-.issue-status, .pr-status {
-  padding: 0.125rem 0.5rem;
-  border-radius: 0.25rem;
-  font-size: 0.75rem;
-  font-weight: 500;
-  text-transform: uppercase;
+.commit-list,
+.tag-list,
+.issue-list,
+.pr-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  overflow-y: auto;
+  flex: 1;
 }
 
-.issue-status.open, .pr-status.open {
-  background: var(--accent);
-  color: var(--accent-text, #ffffff);
-  font-weight: 600;
+.commit-item,
+.tag-item,
+.issue-item,
+.pr-item {
+  border-bottom: 1px solid var(--border-color);
+  padding: 0.75rem 1rem;
+  cursor: pointer;
 }
 
-.issue-status.closed, .pr-status.closed {
-  background: var(--error-bg);
-  color: var(--error-text);
+.commit-button {
+  width: 100%;
+  padding: 0;
+  text-align: left;
+  background: none;
+  border: none;
+  cursor: pointer;
 }
 
-.issue-status.resolved, .pr-status.merged {
-  background: var(--success-bg);
-  color: var(--success-text);
+.commit-hash {
+  font-family: 'IBM Plex Mono', monospace;
+  font-size: 0.75rem;
+  color: var(--text-muted);
 }
 
-.issue-subject, .pr-subject {
+.commit-message {
   font-weight: 500;
-  flex: 1;
   color: var(--text-primary);
 }
 
-.issue-meta, .pr-meta {
+.commit-meta {
   font-size: 0.75rem;
   color: var(--text-muted);
-  display: flex;
-  gap: 0.75rem;
-}
-
-.pr-commit {
-  font-family: 'IBM Plex Mono', monospace;
-}
-
-.issues-content, .prs-content {
-  flex: 1;
-  overflow-y: auto;
-  padding: 2rem;
-  background: var(--card-bg);
 }
 
-.issue-detail, .pr-detail {
-  margin-bottom: 2rem;
-  padding-bottom: 2rem;
-  border-bottom: 1px solid var(--border-color);
+.issue-status,
+.pr-status {
+  padding: 0.125rem 0.5rem;
+  border-radius: 0.25rem;
+  font-size: 0.75rem;
+  font-weight: 500;
 }
 
-.issue-detail h3, .pr-detail h3 {
-  margin: 0 0 0.5rem 0;
-  font-size: 1.5rem;
-  color: var(--text-primary);
+.issue-status.open,
+.pr-status.open {
+  background: var(--accent);
+  color: var(--accent-text, #ffffff);
 }
 
-.issue-meta-detail, .pr-meta-detail {
-  display: flex;
-  align-items: center;
-  gap: 1rem;
-  margin-bottom: 1rem;
-  font-size: 0.875rem;
-  color: var(--text-muted);
+.create-issue-button,
+.create-pr-button {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.75rem;
+  background: var(--button-primary);
+  color: white;
+  border: none;
+  border-radius: 0.25rem;
+  cursor: pointer;
 }
 
-.issue-body, .pr-body {
-  line-height: 1.6;
+.refresh-button {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.75rem;
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  border-radius: 0.25rem;
+  cursor: pointer;
   color: var(--text-primary);
 }
 
@@ -1987,63 +755,51 @@
   padding: 0.125rem 0.25rem;
   border-radius: 0.25rem;
   font-size: 0.75rem;
-  flex-shrink: 0;
-}
-
-.verification-badge.loading {
-  opacity: 0.6;
 }
 
 .verification-badge.verified {
-  color: var(--success-text, #10b981);
+  color: var(--success-text);
 }
 
 .verification-badge.unverified {
-  color: var(--error-text, #f59e0b);
+  color: var(--error-text);
 }
 
-.verification-badge .icon-inline {
-  width: 1em;
-  height: 1em;
-  margin: 0;
+.empty {
+  padding: 2rem;
+  text-align: center;
+  color: var(--text-muted);
 }
 
-.icon-inline {
-  width: 1em;
-  height: 1em;
-  vertical-align: middle;
-  display: inline-block;
-  margin-right: 0.25rem;
-  /* Make icons visible on dark backgrounds by inverting to light */
-  filter: brightness(0) saturate(100%) invert(1);
+.empty-state {
+  padding: 2rem 2rem 2rem 1rem;
+  text-align: left;
+  color: var(--text-muted);
 }
 
-.icon-small {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
-  /* Make icons visible on dark backgrounds by inverting to light */
-  filter: brightness(0) saturate(100%) invert(1);
+.empty-state p {
+  margin: 0;
+  padding-left: 0.5rem;
 }
 
-/* Theme-aware icon colors */
-
-.verification-badge.verified .icon-inline {
-  /* Green checkmark for verified */
-  filter: brightness(0) saturate(100%) invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(118%) contrast(119%);
+.unsaved-indicator {
+  color: var(--warning-text);
+  font-size: 0.875rem;
 }
 
-.verification-badge.unverified .icon-inline {
-  /* Orange/yellow warning for unverified */
-  filter: brightness(0) saturate(100%) invert(67%) sepia(93%) saturate(1352%) hue-rotate(358deg) brightness(102%) contrast(106%);
+.non-maintainer-notice {
+  font-size: 0.75rem;
+  color: var(--text-muted);
 }
 
-.file-button .icon-inline {
-  filter: brightness(0) saturate(100%) invert(1);
-  opacity: 0.7;
+.repo-website a {
+  color: var(--link-color);
+  text-decoration: none;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
 }
 
-.delete-file-button .icon-small {
-  /* Red for delete button */
-  filter: brightness(0) saturate(100%) invert(27%) sepia(51%) saturate(2878%) hue-rotate(346deg) brightness(104%) contrast(97%);
+.repo-website a:hover {
+  text-decoration: underline;
 }
diff --git a/src/routes/api/repos/[npub]/[repo]/download/+server.ts b/src/routes/api/repos/[npub]/[repo]/download/+server.ts
index 5a34afe..3659c36 100644
--- a/src/routes/api/repos/[npub]/[repo]/download/+server.ts
+++ b/src/routes/api/repos/[npub]/[repo]/download/+server.ts
@@ -17,6 +17,8 @@ import { handleApiError, handleNotFoundError } from '$lib/utils/error-handler.js
 import { KIND } from '$lib/types/nostr.js';
 import { existsSync } from 'fs';
 import { repoCache, RepoCache } from '$lib/services/git/repo-cache.js';
+import { eventCache } from '$lib/services/nostr/event-cache.js';
+import { fetchRepoAnnouncementsWithCache, findRepoAnnouncement } from '$lib/utils/nostr-utils.js';
 
 const repoRoot = typeof process !== 'undefined' && process.env?.GIT_REPO_ROOT
   ? process.env.GIT_REPO_ROOT
diff --git a/src/routes/repos/[npub]/[repo]/+page.svelte b/src/routes/repos/[npub]/[repo]/+page.svelte
index ebe854d..6bb91be 100644
--- a/src/routes/repos/[npub]/[repo]/+page.svelte
+++ b/src/routes/repos/[npub]/[repo]/+page.svelte
@@ -227,6 +227,26 @@
   let isRepoCloned = $state<boolean | null>(null); // null = unknown, true = cloned, false = not cloned
   let checkingCloneStatus = $state(false);
   let cloning = $state(false);
+  
+  // Word wrap toggle
+  let wordWrap = $state(false);
+  
+  // Function to toggle word wrap and refresh highlighting
+  async function toggleWordWrap() {
+    wordWrap = !wordWrap;
+    console.log('Word wrap toggled:', wordWrap);
+    // Force DOM update by accessing the element
+    await new Promise(resolve => {
+      requestAnimationFrame(() => {
+        requestAnimationFrame(resolve);
+      });
+    });
+    // Re-apply syntax highlighting to refresh the display
+    if (currentFile && fileContent) {
+      const ext = currentFile.split('.').pop() || '';
+      await applySyntaxHighlighting(fileContent, ext);
+    }
+  }
   let copyingCloneUrl = $state(false);
   
   // Helper: Check if repo needs to be cloned for write operations
@@ -706,6 +726,10 @@
 
   // Mobile view toggle for file list/file viewer
   let showFileListOnMobile = $state(true);
+  
+  // Guard to prevent README auto-load loop
+  let readmeAutoLoadAttempted = $state(false);
+  let readmeAutoLoadTimeout: ReturnType<typeof setTimeout> | null = null;
 
   async function loadReadme() {
     if (repoNotFound) return;
@@ -1838,6 +1862,10 @@
       clearInterval(autoSaveInterval);
       autoSaveInterval = null;
     }
+    if (readmeAutoLoadTimeout) {
+      clearTimeout(readmeAutoLoadTimeout);
+      readmeAutoLoadTimeout = null;
+    }
   });
 
   async function checkAuth() {
@@ -2031,6 +2059,59 @@
     }
   }
 
+  async function copyEventId() {
+    if (!repoAddress || !repoOwnerPubkey) {
+      alert('Repository address not available');
+      return;
+    }
+
+    try {
+      // Parse the repo address: kind:pubkey:identifier
+      const parts = repoAddress.split(':');
+      if (parts.length < 3) {
+        throw new Error('Invalid repository address format');
+      }
+
+      const kind = parseInt(parts[0]);
+      const pubkey = parts[1];
+      const identifier = parts.slice(2).join(':'); // In case identifier contains ':'
+
+      // Generate naddr synchronously
+      const naddr = nip19.naddrEncode({
+        kind,
+        pubkey,
+        identifier,
+        relays: [] // Optional: could include relays if available
+      });
+
+      // Copy naddr to clipboard immediately (while we have user activation)
+      try {
+        await navigator.clipboard.writeText(naddr);
+      } catch (clipboardErr) {
+        // Fallback: use execCommand for older browsers or if clipboard API fails
+        const textArea = document.createElement('textarea');
+        textArea.value = naddr;
+        textArea.style.position = 'fixed';
+        textArea.style.opacity = '0';
+        document.body.appendChild(textArea);
+        textArea.select();
+        try {
+          document.execCommand('copy');
+          textArea.remove();
+        } catch (execErr) {
+          textArea.remove();
+          throw new Error('Failed to copy to clipboard. Please copy manually: ' + naddr);
+        }
+      }
+      
+      // Show message with naddr
+      alert(`Event ID copied to clipboard!\n\nnaddr (repository address):\n${naddr}`);
+    } catch (err) {
+      console.error('Failed to copy event ID:', err);
+      alert(`Failed to copy event ID: ${err instanceof Error ? err.message : String(err)}`);
+    }
+  }
+
   async function checkMaintainerStatus() {
     if (repoNotFound || !userPubkey) {
       isMaintainer = false;
@@ -2380,14 +2461,40 @@
       currentPath = path;
       
       // Auto-load README if we're in the root directory and no file is currently selected
-      if (path === '' && !currentFile) {
+      // Only attempt once per path to prevent loops
+      if (path === '' && !currentFile && !readmeAutoLoadAttempted) {
         const readmeFile = findReadmeFile(files);
         if (readmeFile) {
+          readmeAutoLoadAttempted = true;
+          // Clear any existing timeout
+          if (readmeAutoLoadTimeout) {
+            clearTimeout(readmeAutoLoadTimeout);
+          }
           // Small delay to ensure UI is ready
-          setTimeout(() => {
-            loadFile(readmeFile.path);
+          readmeAutoLoadTimeout = setTimeout(() => {
+            loadFile(readmeFile.path).catch(err => {
+              // If load fails (e.g., 429 rate limit), reset the flag after a delay
+              // so we can retry later, but not immediately
+              if (err instanceof Error && err.message.includes('Too Many Requests')) {
+                console.warn('[README] Rate limited, will retry later');
+                setTimeout(() => {
+                  readmeAutoLoadAttempted = false;
+                }, 5000); // Retry after 5 seconds
+              } else {
+                // For other errors, reset immediately
+                readmeAutoLoadAttempted = false;
+              }
+            });
+            readmeAutoLoadTimeout = null;
           }, 100);
         }
+      } else if (path !== '' || currentFile) {
+        // Reset flag when navigating away from root or when a file is selected
+        readmeAutoLoadAttempted = false;
+        if (readmeAutoLoadTimeout) {
+          clearTimeout(readmeAutoLoadTimeout);
+          readmeAutoLoadTimeout = null;
+        }
       }
     } catch (err) {
       error = err instanceof Error ? err.message : 'Failed to load files';
@@ -2458,6 +2565,12 @@
       });
       
       if (!response.ok) {
+        // Handle rate limiting specifically to prevent loops
+        if (response.status === 429) {
+          const error = new Error(`Failed to load file: Too Many Requests`);
+          console.warn('[File Load] Rate limited, please wait before retrying');
+          throw error;
+        }
         throw new Error(`Failed to load file: ${response.statusText}`);
       }
 
@@ -2466,6 +2579,11 @@
       editedContent = data.content;
       currentFile = filePath;
       hasChanges = false;
+      
+      // Reset README auto-load flag when a file is successfully loaded
+      if (filePath && filePath.toLowerCase().includes('readme')) {
+        readmeAutoLoadAttempted = false;
+      }
 
       // Determine language from file extension
       const ext = filePath.split('.').pop()?.toLowerCase();
@@ -3709,6 +3827,7 @@
       hasUnlimitedAccess={hasUnlimitedAccess($userStore.userLevel)}
       needsClone={needsClone}
       allMaintainers={allMaintainers}
+      onCopyEventId={copyEventId}
     />
   {/if}
 
@@ -3810,6 +3929,14 @@
             onTabChange={(tab) => activeTab = tab as typeof activeTab}
           />
           <h2>Files</h2>
+          <button 
+            onclick={toggleWordWrap} 
+            class="word-wrap-button"
+            title={wordWrap ? 'Disable word wrap' : 'Enable word wrap'}
+            aria-label={wordWrap ? 'Disable word wrap' : 'Enable word wrap'}
+          >
+            {wordWrap ? 'Wrap' : 'No Wrap'}
+          </button>
           <div class="file-tree-actions">
             {#if pathStack.length > 0 || currentPath}
               <button onclick={handleBack} class="back-button">← Back</button>
@@ -4148,7 +4275,7 @@
                   readOnly={needsClone}
                 />
               {:else}
-                <div class="read-only-editor">
+                <div class="read-only-editor" class:word-wrap={wordWrap}>
                   {#if highlightedFileContent}
                     {@html highlightedFileContent}
                   {:else}
@@ -5078,3 +5205,39 @@
     </div>
   {/if}
 </div>
+
+<style>
+  /* Word wrap styles - ensure they apply with highest specificity */
+  :global(.read-only-editor.word-wrap) {
+    overflow-x: hidden !important;
+  }
+
+  :global(.read-only-editor.word-wrap pre) {
+    white-space: pre-wrap !important;
+    word-wrap: break-word !important;
+    overflow-wrap: break-word !important;
+    overflow-x: hidden !important;
+    overflow-y: visible !important;
+    max-width: 100% !important;
+  }
+
+  :global(.read-only-editor.word-wrap pre code),
+  :global(.read-only-editor.word-wrap pre code.hljs),
+  :global(.read-only-editor.word-wrap code.hljs),
+  :global(.read-only-editor.word-wrap .hljs) {
+    white-space: pre-wrap !important;
+    word-wrap: break-word !important;
+    overflow-wrap: break-word !important;
+    overflow-x: hidden !important;
+    overflow-y: visible !important;
+    display: block !important;
+    max-width: 100% !important;
+  }
+
+  :global(.read-only-editor.word-wrap pre code.hljs *),
+  :global(.read-only-editor.word-wrap pre code.hljs span),
+  :global(.read-only-editor.word-wrap code.hljs *),
+  :global(.read-only-editor.word-wrap .hljs *) {
+    white-space: pre-wrap !important;
+  }
+</style>