change the way branch permalinks work

branch permalinks still use /b, but /b?abc now acts as a redirect rather than doing annoying JavaScript garbage
I changed the branch element ID format to accomodate this---now the IDs are of form `b-{id}` rather than `{tree_path}:{id}`.
the old way was stupid anyways.

I hope nothing breaks too majorly because of this.

static/css/page/index.css

@@ -114,16 +114,6 @@ h1.page-title {
     }
 }
 
-#index\:treehouse {
-    & > details > summary {
-        padding-left: 1rem;
-
-        & > th-bp {
-            display: none;
-        }
-    }
-}
-
 main.tree > ul {
     /* Optical text offset to make the icons look less misaligned.
        This is adjusted per each hobby corner to fit the icons.
@@ -152,29 +142,29 @@ main.tree > ul {
     }
 }
 
-#index\:about {
+#b-about {
     --section-color: var(--accent-pink);
 }
 
-#index\:programming {
+#b-programming {
     --section-color: var(--accent-red);
     --section-text-offset: -0.1em;
 }
 
-#index\:design {
+#b-design {
     --section-color: var(--accent-yellow);
 }
 
-#index\:music {
+#b-music {
     --section-color: var(--accent-green);
     --section-text-offset: -0.05em;
 }
 
-#index\:games {
+#b-games {
     --section-color: var(--accent-blue);
     --section-text-offset: 0.05em;
 }
 
-#index\:philosophy {
+#b-philosophy {
     --section-color: var(--accent-purple);
 }

static/css/page/treehouse/issues.css

@@ -1,8 +1,7 @@
-#treehouse\/issues\:issue-list>details>ul {
-
+#b-issue-list > details > ul {
     /* Make issue titles bold */
-    &>li>details>summary>th-bc,
-    &>li>div>th-bc {
+    & > li > details > summary > th-bc,
+    & > li > div > th-bc {
         --recursive-wght: 600;
     }
 }

static/js/tree.js

@@ -49,7 +49,7 @@ export class Branch {
             });
         }
 
-        this.namedID = element.id.split(":")[1];
+        this.namedID = element.id.replace(/^b-/, "");
         Branch.branchesByNamedID.set(this.namedID, element);
 
         if (ulid.isCanonicalUlid(this.namedID)) {