diff --git a/pub/tree/main.css b/pub/tree/main.css
index 851ed9896..fe5490304 100644
--- a/pub/tree/main.css
+++ b/pub/tree/main.css
@@ -1,914 +1,672 @@
-@font-face {
-  font-family: "bau";
-  src: url("//storage.googleapis.com/urbit-extra/bau.woff");
-  font-weight: 400;
-  font-style: normal;
-}
-@font-face {
-  font-family: "bau";
-  src: url("//storage.googleapis.com/urbit-extra/bau-italic.woff");
-  font-weight: 400;
-  font-style: italic;
-}
-@font-face {
-  font-family: "bau";
-  src: url("//storage.googleapis.com/urbit-extra/bau-medium.woff");
-  font-weight: 500;
-  font-style: normal;
-}
-@font-face {
-  font-family: "bau";
-  src: url("//storage.googleapis.com/urbit-extra/bau-mediumitalic.woff");
-  font-weight: 500;
-  font-style: italic;
-}
-@font-face {
-  font-family: "bau";
-  src: url("//storage.googleapis.com/urbit-extra/bau-bold.woff");
-  font-weight: 600;
-  font-style: normal;
-}
-@font-face {
-  font-family: "bau";
-  src: url("//storage.googleapis.com/urbit-extra/bau-bolditalic.woff");
-  font-weight: 600;
-  font-style: italic;
-}
-@font-face {
-  font-family: "bau";
-  src: url("//storage.googleapis.com/urbit-extra/bau-super.woff");
-  font-weight: 600;
-  font-style: normal;
-}
-@font-face {
-  font-family: "bau";
-  src: url("//storage.googleapis.com/urbit-extra/bau-superitalic.woff");
-  font-weight: 600;
-  font-style: italic;
-}
-@font-face {
-  font-family: "scp";
-  src: url("//storage.googleapis.com/urbit-extra/scp-extralight.woff");
-  font-weight: 200;
-  font-style: normal;
-}
-@font-face {
-  font-family: "scp";
-  src: url("//storage.googleapis.com/urbit-extra/scp-light.woff");
-  font-weight: 300;
-  font-style: normal;
-}
-@font-face {
-  font-family: "scp";
-  src: url("//storage.googleapis.com/urbit-extra/scp-regular.woff");
-  font-weight: 400;
-  font-style: normal;
-}
-@font-face {
-  font-family: "scp";
-  src: url("//storage.googleapis.com/urbit-extra/scp-medium.woff");
-  font-weight: 500;
-  font-style: normal;
-}
-body,
-html {
-  font-family: "bau", "Helvetica Neue", helvetica, arial, sans-serif;
-}
-code,
-pre,
-li:before,
-.spin,
-#bred a,
-.mono,
-h3.time {
-  font-family: "scp", "Courier New", courier, monospace;
-}
-body,
-html {
-  font-size: 18px;
-  font-weight: 400;
-  line-height: 1.6rem;
-  -webkit-text-size-adjust: none;
-}
-p {
-  font-size: 1.2rem;
-  line-height: 2rem;
-}
 a {
-  color: #000;
-  border-bottom: 1px solid #000;
-  text-decoration: none;
-  display: inline-block;
-  line-height: 0.8rem;
-}
-a:visited {
-  opacity: 0.5;
-}
-a code {
-  line-height: inherit;
-}
-hr {
-  display: inline-block;
-  width: 6rem;
-  border: 0;
-  border-top: 2px solid #f4f4f4;
-}
-h1 {
-  margin-top: 4rem;
-  line-height: 2.6rem;
-}
-#body > div > h1:first-of-type,
-#body div.short > h1:first-of-type {
-  margin-top: 1rem;
-}
-h2,
-h3 {
-  margin: 0;
-  margin-top: 2rem;
-}
+  cursor: pointer; }
+
+ul {
+  padding: 0; }
+
+button:focus {
+  outline: none; }
+
 h1,
 h2,
-h3,
-h4,
-strong {
-  font-weight: 500;
-}
-h4 {
-  margin-bottom: 0.3rem;
-}
-h5 {
-  font-style: italic;
-  font-weight: 200;
-  margin: 0;
-}
-h1 code,
-h2 code,
-h3 code {
-  font-size: inherit;
-  padding: 0.3rem;
-}
-pre,
-code {
-  font-size: 1rem;
-}
+h3 {
+  padding-top: 2rem; }
+
+h1:first-of-type {
+  padding-top: 0; }
+
 pre {
-  background-color: #f5f5f5;
-  padding: 0.3rem;
-  margin-left: -0.3rem;
-  overflow-y: scroll;
-}
-code {
-  line-height: 1.2rem;
-  background-color: #f4f4f4;
-  margin-top: -0.05rem;
-  padding: 0.2rem;
-  display: inline-block;
-  white-space: pre;
-}
-blockquote {
-  background-color: #f5f5f5;
-  margin: 0;
-  padding: 1rem;
-  font-style: italic;
-  margin-left: 3rem;
-}
-blockquote p {
-  margin: 0;
-}
-blockquote em {
-  font-style: normal;
-}
-ul {
-  list-style: none;
-  padding: 0;
-}
-li:before {
-  font-family: 'scp';
-  content: "\2022";
-  padding-right: 0.3rem;
+  background-color: #f7f7f7;
+  margin-left: -.3rem;
+  padding-left: .3rem; }
+
+.container {
+  padding-top: 3rem;
+  padding-bottom: 9rem; }
+
+@media (max-width: 767px) {
+  .container {
+    padding-top: 0; } }
+.close {
+  font-weight: 300;
   font-size: 1rem;
+  text-shadow: none;
+  opacity: 1; }
+
+@media (max-width: 767px) {
+  h1 {
+    font-size: 2rem;
+    line-height: 3rem; }
+
+  h2 {
+    font-size: 1.6rem; } }
+.planet,
+.room {
+  font-family: 'scp'; }
+
+.body {
+  padding-left: 0; }
+
+@media (max-width: 767px) {
+  .body {
+    padding-left: 0.9375rem;
+    margin-top: 4rem; } }
+.action {
+  margin-top: 1rem;
   font-weight: 500;
-}
-#nav,
-#cont {
+  letter-spacing: 1px; }
+
+.action > label {
+  margin-right: 0.9375rem;
+  line-height: 1rem; }
+
+.action.create > label {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+  background-color: transparent;
+  border: 3px solid #000;
+  vertical-align: middle; }
+
+.action.add > label:before {
+  content: "+";
+  font-size: 1.3rem;
+  font-weight: 500; }
+
+.nav.container {
+  position: fixed;
   left: 50%;
-}
-#cont {
-  width: 42rem;
-  margin-left: -21rem;
-  background-color: #fff;
-  z-index: 1;
-}
-#nav {
-  position: fixed;
-  top: 0rem;
-  width: 57rem;
-  padding-top: 1rem;
-  z-index: 0;
-  margin-left: -32rem;
-  overflow: hidden;
-  transition: opacity 1s ease-in-out;
-}
-#nav.moving {
-  opacity: 1;
-  transition: opacity 0.3s ease-in-out;
-}
-#nav:hover {
-  opacity: 1;
-  transition: opacity 0.3s ease-in-out;
-}
-#cont {
-  position: relative;
-  top: 0;
-  margin-bottom: 9rem;
-}
-.loading {
-  display: inline-block;
-}
-.spin {
-  color: #fff;
-  padding: 0.6rem;
-  font-size: 0.7rem;
-  font-weight: 600;
-  letter-spacing: 0.1rem;
-  z-index: 3;
-}
-.loading > .spin {
-  background-color: #555;
-}
-#body .loading > .spin {
-  background-color: #000;
-}
-.spin.state-0:before {
-  content: "\2599";
-}
-.spin.state-1:before {
-  content: "\259B";
-}
-.spin.state-2:before {
-  content: "\259C";
-}
-.spin.state-3:before {
-  content: "\259F";
-}
-#load.load {
-  display: inline-block;
-  font-weight: 500;
-  position: fixed;
-  top: 0;
-  left: 0;
   width: 100%;
-  height: 100%;
-  background-color: rgba(10,10,10,0.4);
-  opacity: 1;
-  transition: opacity 1s ease-in-out;
-  z-index: 4;
-}
+  padding-top: 0;
+  z-index: 100; }
+  @media (min-width: 544px) {
+    .nav.container {
+      margin-left: -288px; } }
+  @media (min-width: 768px) {
+    .nav.container {
+      margin-left: -360px; } }
+  @media (min-width: 992px) {
+    .nav.container {
+      margin-left: -470px; } }
+  @media (min-width: 1200px) {
+    .nav.container {
+      margin-left: -570px; } }
+
+@media (max-width: 767px) {
+  .nav.container {
+    left: 0;
+    top: 0; } }
+.ctrl,
+.menu .contents {
+  padding-top: 3rem; }
+
+.ctrl {
+  padding-left: 1.875rem; }
+  .ctrl ul.nav {
+    margin-top: 2rem;
+    overflow: hidden; }
+  .ctrl ul.nav:hover {
+    overflow: visible; }
+  .ctrl a.nav-link:hover {
+    text-decoration: underline; }
+  .ctrl a.nav-link {
+    letter-spacing: 1px; }
+  .ctrl .selected a.nav-link {
+    font-weight: 500;
+    letter-spacing: 0; }
+
+@media (max-width: 991px) {
+  ul.nav {
+    line-height: 1.3rem; }
+
+  a.nav-link {
+    font-size: .8rem; } }
+@media (max-width: 767px) {
+  .ctrl {
+    position: relative;
+    max-height: 3rem;
+    padding-top: 1rem;
+    background-color: #fff;
+    overflow: hidden;
+    border-bottom: 1px solid #000;
+    -webkit-transition: max-height 0.6s ease-in-out;
+    -moz-transition: max-height 0.6s ease-in-out;
+    transition: max-height 0.6s ease-in-out; }
+
+  ul.nav {
+    line-height: 2rem;
+    margin-bottom: 2rem; }
+
+  a.nav-link {
+    font-size: 1rem; }
+
+  .ctrl.open {
+    max-height: 25rem; }
+    .ctrl.open ul.nav {
+      max-height: 9rem;
+      overflow-y: scroll; }
+
+  ul.nav {
+    margin-top: 1rem; } }
+.navbar-toggler {
+  transition: opacity .2s, transform .3s;
+  -webkit-transition: opacity .2s, transform .3s; }
+
+.navbar-toggler.open {
+  transform: rotate(0.25turn);
+  opacity: .2; }
+
+@media (min-width: 768px) {
+  .ctrl .navbar-toggler {
+    display: none; }
+
+  .ctrl .navbar-toggler.show {
+    display: inherit;
+    padding: 0;
+    margin-left: 2px; } }
+@media (max-width: 991px) {
+  .navbar-toggler {
+    font-size: 1rem;
+    margin-left: 0; } }
+@media (max-width: 767px) {
+  .navbar-toggler {
+    padding: 0; } }
+.icon div {
+  display: inline-block;
+  margin-right: .6rem; }
+.icon .home {
+  margin: 6px 9px 12px 0;
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  background-color: transparent;
+  border: 6px solid #B1B7BD; }
+.icon .dpad {
+  display: block; }
+.icon .up {
+  width: 1px;
+  height: 1px;
+  border: 12.0006px solid transparent;
+  border-bottom: 18px solid #000;
+  border-top: 0 solid transparent; }
+.icon .prev {
+  width: 1px;
+  height: 1px;
+  border: 12.0006px solid transparent;
+  border-right: 18px solid #000;
+  border-left: 0 solid transparent;
+  margin-right: 0.6rem; }
+.icon .next {
+  width: 1px;
+  height: 1px;
+  border: 12.0006px solid transparent;
+  border-left: 18px solid #000;
+  border-right: 0 solid transparent; }
+
+@media (max-width: 991px) {
+  .icon > div {
+    display: inline-block;
+    margin-right: .6rem;
+    vertical-align: middle; }
+  .icon .dpad {
+    display: inline; }
+  .icon .home {
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background-color: transparent;
+    border-width: 4px; }
+  .icon .up {
+    width: 1px;
+    height: 1px;
+    border: 8.0004px solid transparent;
+    border-bottom: 12px solid #000;
+    border-top: 0 solid transparent;
+    margin-left: 1px; }
+  .icon .prev {
+    width: 1px;
+    height: 1px;
+    border: 8.0004px solid transparent;
+    border-right: 12px solid #000;
+    border-left: 0 solid transparent;
+    margin-right: 0.6rem; }
+  .icon .next {
+    width: 1px;
+    height: 1px;
+    border: 8.0004px solid transparent;
+    border-left: 12px solid #000;
+    border-right: 0 solid transparent; } }
+@media (max-width: 767px) {
+  .icon {
+    margin-left: 0; }
+    .icon .home {
+      margin-top: 0;
+      margin-bottom: 0; } }
+.menu {
+  padding-left: 0;
+  padding-right: 0;
+  overflow: hidden; }
+  .menu .contents {
+    padding-left: 0.9375rem;
+    padding-right: 0.9375rem;
+    padding-bottom: 6rem;
+    position: relative;
+    left: -100%;
+    -webkit-transition: left 0.3s ease-in-out;
+    -moz-transition: left 0.3s ease-in-out;
+    transition: left 0.3s ease-in-out; }
+  .menu .close {
+    margin-top: -2rem; }
+  .menu h2 {
+    font-size: 1rem;
+    padding-top: 3rem; }
+  .menu h2:first-of-type {
+    padding-top: 0; }
+  .menu label.sum {
+    font-family: 'scp';
+    margin-left: 0.9375rem;
+    font-size: 1.2rem; }
+  .menu .name,
+  .menu .planet {
+    display: inline-block; }
+  .menu .name,
+  .menu .planet,
+  .menu .room {
+    font-size: .8rem; }
+  .menu .name {
+    min-width: 33.333%;
+    font-size: .9rem; }
+  .menu .planet {
+    min-width: 66.667%; }
+
+.menu.depth-1 .contents {
+  background-color: #f7f7f9;
+  border-left: 2px solid #B1B7BD; }
+
+.menu.depth-2 .contents {
+  background-color: #eceeef;
+  border-left: 2px solid #B1B7BD; }
+
+.menu.open .contents {
+  left: 0; }
+
+@media (max-width: 767px) {
+  .menu {
+    height: 100%;
+    padding-left: 0.9375rem; }
+    .menu .contents {
+      left: inherit;
+      top: -100%;
+      padding-top: 0.9375rem;
+      -webkit-transition: top 0.3s ease-in-out;
+      -moz-transition: top 0.3s ease-in-out;
+      transition: top 0.3s ease-in-out; }
+    .menu .close {
+      margin-top: 0; }
+
+  .menu.open .contents {
+    top: 0; } }
+.app {
+  vertical-align: top;
+  font-size: 1.3rem;
+  font-weight: 500;
+  line-height: 1.3rem;
+  margin-top: 9px; }
+
+@media (max-width: 991px) {
+  .app {
+    font-size: 1rem;
+    margin-top: 6px; } }
+@media (max-width: 767px) {
+  .app {
+    margin-top: 0;
+    line-height: 1rem; } }
+.context {
+  margin-top: 1rem; }
+  .context .name {
+    font-weight: 300;
+    font-size: 1.2rem;
+    font-family: 'scp'; }
+
+@media (max-width: 991px) {
+  .context .name {
+    font-size: 1rem; } }
+@media (max-width: 767px) {
+  .context {
+    line-height: 1rem;
+    margin-bottom: 1rem; } }
+div.meta {
+  display: inline-block; }
+
+ul.grams {
+  list-style-type: none;
+  padding: 0; }
+
+label.public {
+  background-color: #A100FE;
+  margin-right: 1rem;
+  height: 1rem;
+  width: 1rem;
+  text-align: center; }
+
+label.public:before {
+  content: '%';
+  color: #fff;
+  font-family: 'scp';
+  font-size: .8rem;
+  font-weight: 500;
+  line-height: 1rem;
+  vertical-align: middle; }
+
+div.meta > label,
+div.meta > h2,
+div.meta > div {
+  display: inline-block; }
+
+h2.author {
+  font-family: 'scp';
+  font-size: .8rem;
+  font-weight: 400;
+  margin-top: 0; }
+
+.gram.same div.meta {
+  display: none; }
+
+@media (max-width: 767px) {
+  label.public {
+    margin-right: 9px; } }
+.input {
+  border-bottom: 3px solid #000;
+  display: inline-block;
+  line-height: 2rem;
+  font-size: 1rem;
+  padding: 0 .2rem;
+  min-width: 1rem;
+  min-height: 1rem; }
+
+.audience {
+  margin-bottom: 2rem; }
+
+.audience .input {
+  border-color: #373a3c;
+  font-family: 'scp'; }
+
+.message .input {
+  border-color: #B1B7BD;
+  font-family: 'bau'; }
+
+.message {
+  margin-bottom: 6rem; }
+
 img.logo {
   height: 2rem;
-  width: 2rem;
-}
-h3.time {
-  margin-top: 0.3rem;
-  font-size: 0.7rem;
-  font-weight: 200;
-}
-#nav .links > div {
-  display: inline-block;
-  vertical-align: top;
-}
-#nav #sibs {
-  width: 8rem;
-  transition: margin-top 0.3s ease-in-out;
-  overflow: hidden;
-}
-#nav #sibs > div {
-  margin-bottom: 0.6rem;
-}
-.focus #sibs {
-  margin-top: 0 !important;
-  transition: margin-top 0.3s ease-in-out;
-}
-#nav a,
-.list > li > a {
-  display: inline;
-}
-#nav a {
-  text-transform: uppercase;
-  font-size: 0.7rem;
-  line-height: 1rem;
-  font-weight: 200;
-  letter-spacing: 1px;
-}
-.link-next {
-  margin-top: 2rem;
-  font-weight: 500;
-}
-.list > li {
-  margin-bottom: 1rem;
-}
-.list > li > a h1 {
-  font-size: inherit;
-  line-height: inherit;
-}
-#nav .active a {
-  font-weight: 500;
-  text-decoration: none;
-}
-#up {
-  padding-right: 1rem;
-  margin-top: -8px;
-}
-#sides {
-  float: right;
-}
-#sides a {
-  display: inline-block;
-  margin-right: 0.6rem;
-}
-.arow-up,
-.arow-next,
-.arow-prev {
-  width: 0;
-  height: 0;
-  border: 0.4rem solid transparent;
-}
-.arow-up {
-  border-bottom: 0.6rem solid #000;
-}
-.arow-next {
-  border-left: 0.6rem solid #000;
-}
-.arow-prev {
-  border-right: 0.6rem solid #000;
-}
-#bred {
-  width: 5rem;
-  padding-right: 1rem;
-  text-align: right;
-  font-size: 0.6rem;
-  white-space: nowrap;
-  overflow: hidden;
-}
-#bred a {
-  text-transform: lowercase;
-  vertical-align: top;
-}
-#bred > div {
-  float: right;
-}
-#bred > div > div {
-  display: inline-block;
-  margin-top: -0.2rem;
-}
-#bred a,
-#kids a {
-  margin-right: 0.3rem;
-}
-#bred a {
-  margin-left: 0.3rem;
-}
+  width: 2rem; }
+
+img.logo.first {
+  margin-bottom: 2rem; }
+
 .short {
-  width: 32rem;
-}
-.list h1,
-.list li a > div p {
-  margin: 0;
-}
-.list li a > div,
-.list li a > div p {
-  display: inline;
-}
-.list li a > div p {
-  margin-left: 0.3rem;
-}
-.list li a > div p:first-child {
-  margin-left: 0;
-}
-.list li a > div p code {
-  font-size: 0.7rem;
-  font-weight: 400;
-  text-transform: none;
-}
-.list li a h1 code {
-  text-transform: lowercase;
-}
-.list li a code {
-  padding: 0.2rem;
-}
-.list h1,
-.list li a > div div {
-  display: inline;
-}
-.list li a > div div {
-  margin-left: 0.6rem;
-  overflow: hidden;
-}
-.list h1 {
-  font-size: 0.7rem;
-}
-div.root h1 {
-  margin-bottom: 2rem;
-}
-div.root .list .sub {
-  margin-left: 0;
-  margin-right: 0.6rem;
-}
-div.root > p {
-  width: 27rem;
-  margin-top: 2rem;
-}
-h2.sub {
-  font-size: 0.7rem;
-  font-weight: 400;
-  line-height: 1rem;
-  letter-spacing: 1px;
-  margin-top: 0;
-  text-transform: uppercase;
-}
-div.toc {
-  margin-top: 3rem;
-  margin-bottom: 3rem;
-}
-div.toc h1,
-div.toc h2,
-div.toc h3,
-div.toc h4 {
-  font-weight: 400;
-  cursor: pointer;
-  text-decoration: underline;
-  font-size: 1.2rem;
-  margin-top: 0.3rem;
-  margin-bottom: 0.3rem;
-}
-div.toc h2 {
-  margin-left: 1rem;
-}
-div.toc h3 {
-  margin-left: 2rem;
-}
-div.toc h4 {
-  margin-left: 3rem;
-}
-div.toc h1.t {
-  font-weight: 500;
-  font-size: 2rem;
-  text-decoration: none;
-  margin-bottom: 2rem;
-}
-#body .spam {
-  width: 9rem;
-  background-color: #555;
-  padding: 1rem;
-  letter-spacing: 1px;
-  font-weight: 500;
-  margin-bottom: 2rem;
-}
-#body .spam,
-#body .spam a {
+  width: 75%; }
+
+.loading {
+  background-color: #000;
   color: #fff;
-}
-#body .spam a {
-  border-color: #fff;
-}
-#body .CodeMirror {
-  font-size: 0.8rem;
-  line-height: 1rem;
-}
-#body .CodeMirror .cm-header {
-  font-weight: 200;
-}
-#body .CodeMirror-gutters {
-  background-color: #fff;
-  padding-right: 1rem;
-  margin-left: -1rem;
-}
-.footer p {
-  font-family: 'scp';
-  font-size: 0.7rem;
-  font-weight: 400;
-  margin-top: 3rem;
-  color: #ccc;
-}
-.error {
-  color: #f91733;
-}
-.warning {
-  background-color: #ff3537;
-  padding: 1rem;
-  width: 18rem;
-  margin: 2rem 0;
-  color: #fff;
-}
-.warning a {
-  color: inherit;
-  border-color: #fff;
-}
-.warning h1 {
+  padding: .6rem;
   font-size: 1rem;
-}
-.warning h1,
-.warning p {
-  margin: 0 0.3rem;
-}
-.warning.w {
-  width: auto;
-}
-div.post h1 {
-  font-size: 2.8rem;
-  line-height: 4rem;
-  margin-top: 1rem;
-  margin-bottom: 1rem;
-}
-div.post h2 {
-  font-family: 'scp';
-  font-size: 0.7rem;
-  line-height: 1rem;
-  letter-spacing: 1px;
-}
-div.post h3 {
-  margin-top: 0;
-  font-size: 0.7rem;
-  font-weight: 200;
+  font-weight: 600;
   letter-spacing: 0.1rem;
-  text-transform: uppercase;
-}
-div.post h3::before {
-  content: '\2014';
-  margin-right: 0.3rem;
-}
-div.post .list li {
-  margin-bottom: 0;
-  font-size: 1.2rem;
-}
-div.post p {
-  font-size: 1.2rem;
-  line-height: 2.2rem;
-}
-div.post li p {
-  display: inline;
-}
-div.post p.ib {
-  margin-top: 0;
-}
-@media only screen and (min-width: 320px) and (max-width: 1024px) {
-  div.post h2,
-  div.post h3 {
-    font-size: 0.5rem;
-  }
-  div.post p {
-    font-size: 1rem;
-    line-height: 2rem;
-  }
-  div.post li h1 {
-    font-weight: 400;
-  }
-  div.post li::before {
-    font-weight: 200;
-  }
-}
-.bar {
-  margin-top: 2rem;
-  margin-bottom: 2rem;
-}
-.bar > div {
-  display: inline-block;
-}
-.bar a.logo {
-  display: inline-block;
-  height: 2rem;
-  vertical-align: middle;
-  border: none;
-}
-.bar img.logo {
-  margin-right: 18px;
-  margin-top: 0;
-}
-.bar ul {
-  margin: 0;
-  line-height: 2rem;
-  display: inline-block;
-}
-.bar ul li::before {
-  content: '';
-  padding-right: none;
-}
-.bar ul li {
-  display: inline-block;
-  margin-bottom: 0;
-  margin-right: 1rem;
-  vertical-align: middle;
-}
-.bar ul li a {
-  border-bottom: none;
-  text-decoration: underline;
-}
-.bar ul li a h1 {
-  margin: 0;
-  line-height: inherit;
-  text-transform: capitalize;
-  font-size: 1.2rem;
-}
-.bar ul h1 {
-  text-transform: capitalize;
-  font-size: 1rem;
-  font-weight: 400;
-  letter-spacing: 0.03rem;
-}
-.lead #body {
-  margin-top: 3rem;
-  margin-top: 0;
-}
-.lead h1 {
-  margin-top: 1rem;
-  vertical-align: middle;
-  line-height: 4rem;
-}
-.lead h1.fold {
-  margin-top: 6rem;
-}
-.lead .list li h1 {
-  line-height: 2rem;
-}
-.lead {
-  font-size: 1.6rem;
-  line-height: 2.6rem;
-}
-.lead a {
-  line-height: 1rem;
-}
-.lead p {
-  font-size: 1.6rem;
-  line-height: 3rem;
-}
-.lead .mono {
-  font-size: 1.3rem;
-}
-.lead .footer {
-  margin: 4rem 0 4rem 0;
-}
-.lead .footer p {
-  margin: 0;
-  font-size: 0.7rem;
-}
-.lead .footer code {
-  line-height: 1rem;
-  font-size: 0.7rem;
-}
-.lead input.email {
-  border-radius: 0;
-  font: inherit;
-  font-family: 'scp';
-  font-weight: 300;
-  line-height: 2rem;
-  min-width: 2rem;
-  border: 0;
-  outline: 0;
-  background-color: transparent;
-  border-bottom: 3px dotted #000;
-  margin-right: 1rem;
-  display: inline-block;
-}
-.lead input.email.valid {
-  color: #99f27c;
-}
-.lead input.email.error {
-  color: #f74040;
-}
-.lead .email:empty:not(:focus):before {
-  content: attr(data-ph);
-}
-.lead ::-webkit-input-placeholder {
-  color: #e6e7e8;
-}
-.lead :-moz-placeholder {
-  color: #e6e7e8;
-}
-.lead ::-moz-placeholder {
-  color: #e6e7e8;
-}
-.lead :-ms-input-placeholder {
-  color: #e6e7e8;
-}
-.lead button.submit {
-  font: inherit;
-  border: 0;
-  background-color: #fff;
-  border-bottom: 3px solid #000;
-  font-size: 1.6rem;
-  line-height: 1.6rem;
-  display: inline-block;
-  text-align: left;
-  margin-top: 1rem;
-  height: 2rem;
-  padding: 0 0.6rem;
-}
-.lead .date {
-  font-weight: 400;
-}
-@media only screen and (max-width: 1170px) {
-  #cont.lead {
-    top: 0rem;
-  }
-}
-@media only screen and (min-width: 320px) and (max-width: 1024px) {
-  #cont.lead {
-    top: 0rem;
-    font-size: 1rem;
-    line-height: 1.6rem;
-  }
-  #cont.lead .post h1 {
-    font-size: 2rem;
-    line-height: 3rem;
-  }
-  #cont.lead .bar {
-    margin-top: 1rem;
-    margin-bottom: 1rem;
-  }
-  #cont.lead .bar .list li h1 {
-    font-size: 1rem;
-    line-height: 1.6rem;
-  }
-  #cont.lead img.logo {
-    display: block;
-    margin-bottom: 1rem;
-  }
-  #cont.lead h1.leader,
-  #cont.lead h1.fold {
-    font-size: 1.6rem;
-    line-height: 3rem;
-    margin-left: 0;
-  }
-  #cont.lead .list li,
-  #cont.lead .list li a,
-  #cont.lead .list li h1 {
-    font-size: 1rem;
-    line-height: 1.6rem;
-  }
-  #cont.lead input.email {
-    font-size: 1.2rem;
-    width: 100%;
-  }
-  #cont.lead button.submit {
-    font-size: 1rem;
-  }
-  #cont.lead .date,
-  #cont.lead div.footer {
-    font-size: 0.6rem;
-  }
-}
-.video iframe {
-  width: 42rem;
-  height: 24rem;
-}
-.video .leader {
-  font-size: 2rem;
-  font-weight: 500;
-  line-height: 2.6rem;
-  margin-bottom: 4rem;
-}
-.video .short img {
-  margin-top: 2rem;
-  width: 42rem;
-}
-@media only screen and (max-width: 1170px) {
-  #nav,
-  #nav > div,
-  #nav.up,
-  #nav.top,
-  #nav .focus {
-    transform: translate3d(0, 0, 0);
-    -webkit-transform: translate3d(0, 0, 0);
-  }
-  #nav {
-    position: fixed;
-    top: 0;
-    opacity: 1;
-    width: 42rem;
-    margin-left: -21rem;
+  z-index: 3; }
+
+.loading.state-0:before {
+  content: "\25D3"; }
+
+.loading.state-1:before {
+  content: "\25D1"; }
+
+.loading.state-2:before {
+  content: "\25D2"; }
+
+.loading.state-3:before {
+  content: "\25D0"; }
+
+.nav.container {
+  position: fixed;
+  left: 50%;
+  width: 100%;
+  padding-top: 0;
+  z-index: 100; }
+  @media (min-width: 544px) {
+    .nav.container {
+      margin-left: -288px; } }
+  @media (min-width: 768px) {
+    .nav.container {
+      margin-left: -360px; } }
+  @media (min-width: 992px) {
+    .nav.container {
+      margin-left: -470px; } }
+  @media (min-width: 1200px) {
+    .nav.container {
+      margin-left: -570px; } }
+
+@media (max-width: 767px) {
+  .nav.container {
+    left: 0;
+    top: 0; } }
+.ctrl,
+.menu .contents {
+  padding-top: 3rem; }
+
+.ctrl {
+  padding-left: 0.9375rem; }
+  .ctrl ul.nav {
+    margin-top: 2rem;
+    overflow: hidden; }
+    .ctrl ul.nav li {
+      width: 100%;
+      overflow: hidden;
+      white-space: nowrap; }
+  .ctrl ul.nav:hover {
+    overflow: visible; }
+  .ctrl a.nav-link:hover {
+    text-decoration: underline; }
+  .ctrl a.nav-link {
+    letter-spacing: 1px; }
+  .ctrl .selected a.nav-link {
+    font-weight: 500;
+    letter-spacing: 0; }
+
+@media (max-width: 991px) {
+  ul.nav {
+    line-height: 1.3rem; }
+
+  a.nav-link {
+    font-size: .8rem; } }
+@media (max-width: 767px) {
+  .ctrl {
+    position: relative;
+    max-height: 3rem;
+    padding-top: 1rem;
     background-color: #fff;
-    z-index: 2;
-  }
-  #nav a {
-    white-space: nowrap;
-  }
-  #nav #sibs {
-    width: 12rem;
-  }
-  #nav #sibs > div {
-    height: 20px;
-    margin-bottom: 4px;
-  }
-  #nav #sibs > div.active a,
-  #nav #sibs > div a {
-    border-bottom: none;
-    text-decoration: underline;
-  }
-  #nav.m-down,
-  #nav.m-up {
-    position: absolute;
-  }
-  #nav.m-down.m-fixed {
-    position: fixed;
-    top: 0;
-  }
-  #nav > div > div {
-    max-height: 2rem;
     overflow: hidden;
-    transition: max-height 0.3s ease-in-out;
-  }
-  #nav .focus {
-    max-height: 40rem;
-    transition: max-height 0.3s ease-in-out;
-  }
-  #cont {
-    top: 3rem;
-  }
-  #cont.no-anchor {
-    top: 0;
-  }
-}
-@media only screen and (min-width: 320px) and (max-width: 1024px) {
-  body,
-  html {
-    font-size: 21px;
-  }
-  p {
-    font-size: 1rem;
+    border-bottom: 1px solid #000;
+    -webkit-transition: max-height 0.6s ease-in-out;
+    -moz-transition: max-height 0.6s ease-in-out;
+    transition: max-height 0.6s ease-in-out; }
+
+  ul.nav {
     line-height: 2rem;
-  }
-  #nav,
-  #cont {
-    width: 94%;
-    padding-left: 3%;
-    margin-left: 0;
-  }
-  #nav {
-    position: fixed;
-    padding-top: 0;
-    opacity: 1;
-    left: 0;
-    z-index: 2;
-  }
-  #nav > div > div {
-    max-height: 1.2rem;
-  }
-  #nav > div {
-    padding-top: 0.6rem;
-  }
-  #nav #sibs {
-    width: 11rem;
-    padding-top: 0;
-  }
-  #nav #sibs > div {
-    height: 20px;
-    line-height: 20px;
-  }
-  #nav a {
-    display: inline-block;
-    font-size: 0.7rem;
-  }
-  #nav #sides {
-    float: none;
-    margin-left: 1rem;
-  }
-  #nav .arow-up,
-  #nav .arow-next,
-  #nav .arow-prev {
-    margin-right: 0;
-    border: 0.4rem solid transparent;
-  }
-  #nav .arow-up {
-    border-bottom: 0.6rem solid #000;
-  }
-  #nav .arow-next {
-    border-left: 0.6rem solid #000;
-  }
-  #nav .arow-prev {
-    margin-right: 1rem;
-    border-right: 0.6rem solid #000;
-  }
-  #cont {
-    left: 0;
-    padding-bottom: 9rem;
-  }
-  #cont h1:first-child {
-    margin-top: 0;
-  }
-  .short {
-    width: 100%;
-  }
-}
-@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
-  #nav > div > div {
-    max-height: 1.6rem;
-  }
-  #nav a {
-    line-height: auto;
-    font-size: 0.7rem;
-  }
-  #nav #sibs > div {
-    height: 20px;
-    line-height: 20px;
-  }
-}
+    margin-bottom: 2rem; }
+
+  a.nav-link {
+    font-size: 1rem; }
+
+  .ctrl.open {
+    max-height: 25rem; }
+    .ctrl.open ul.nav {
+      max-height: 9rem;
+      overflow-y: scroll; }
+
+  ul.nav {
+    margin-top: 1rem; } }
+.navbar-toggler {
+  transition: opacity .2s, transform .3s;
+  -webkit-transition: opacity .2s, transform .3s; }
+
+.navbar-toggler.open {
+  transform: rotate(0.25turn);
+  opacity: .2; }
+
+@media (min-width: 768px) {
+  .ctrl .navbar-toggler {
+    display: none; }
+
+  .ctrl .navbar-toggler.show {
+    display: inherit;
+    padding: 0;
+    margin-left: 2px; } }
+@media (max-width: 991px) {
+  .navbar-toggler {
+    font-size: 1rem;
+    margin-left: 0; } }
+@media (max-width: 767px) {
+  .navbar-toggler {
+    padding: 0; } }
+.icon div, .icon a {
+  display: inline-block; }
+.icon a {
+  margin-right: .6rem; }
+.icon .home {
+  margin: 6px 9px 12px 0;
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  background-color: transparent;
+  border: 6px solid #B1B7BD; }
+.icon .dpad {
+  display: block; }
+.icon .up {
+  width: 1px;
+  height: 1px;
+  border: 12.0006px solid transparent;
+  border-bottom: 18px solid #000;
+  border-top: 0 solid transparent; }
+.icon .prev {
+  width: 1px;
+  height: 1px;
+  border: 12.0006px solid transparent;
+  border-right: 18px solid #000;
+  border-left: 0 solid transparent; }
+.icon .next {
+  width: 1px;
+  height: 1px;
+  border: 12.0006px solid transparent;
+  border-left: 18px solid #000;
+  border-right: 0 solid transparent;
+  margin-right: 0; }
+
+@media (max-width: 991px) {
+  .icon .home {
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background-color: transparent;
+    border-width: 4px; }
+  .icon .up {
+    width: 1px;
+    height: 1px;
+    border: 8.0004px solid transparent;
+    border-bottom: 12px solid #000;
+    border-top: 0 solid transparent;
+    margin-left: 1px; }
+  .icon .prev {
+    width: 1px;
+    height: 1px;
+    border: 8.0004px solid transparent;
+    border-right: 12px solid #000;
+    border-left: 0 solid transparent;
+    margin-right: 0.6rem; }
+  .icon .next {
+    width: 1px;
+    height: 1px;
+    border: 8.0004px solid transparent;
+    border-left: 12px solid #000;
+    border-right: 0 solid transparent; } }
+@media (max-width: 767px) {
+  .icon {
+    margin-left: 0; }
+    .icon .home {
+      margin-top: 0;
+      margin-bottom: 0; } }
+.menu {
+  padding-left: 0;
+  padding-right: 0;
+  overflow: hidden; }
+  .menu .contents {
+    padding-left: 0.9375rem;
+    padding-right: 0.9375rem;
+    padding-bottom: 6rem;
+    position: relative;
+    left: -100%;
+    -webkit-transition: left 0.3s ease-in-out;
+    -moz-transition: left 0.3s ease-in-out;
+    transition: left 0.3s ease-in-out; }
+  .menu .close {
+    margin-top: -2rem; }
+  .menu h2 {
+    font-size: 1rem;
+    padding-top: 3rem; }
+  .menu h2:first-of-type {
+    padding-top: 0; }
+  .menu label.sum {
+    font-family: 'scp';
+    margin-left: 0.9375rem;
+    font-size: 1.2rem; }
+  .menu .name,
+  .menu .planet {
+    display: inline-block; }
+  .menu .name,
+  .menu .planet,
+  .menu .room {
+    font-size: .8rem; }
+  .menu .name {
+    min-width: 33.333%;
+    font-size: .9rem; }
+  .menu .planet {
+    min-width: 66.667%; }
+
+.menu.depth-1 .contents {
+  background-color: #f7f7f9;
+  border-left: 2px solid #B1B7BD; }
+
+.menu.depth-2 .contents {
+  background-color: #eceeef;
+  border-left: 2px solid #B1B7BD; }
+
+.menu.open .contents {
+  left: 0; }
+
+@media (max-width: 767px) {
+  .menu {
+    height: 100%;
+    padding-left: 0.9375rem; }
+    .menu .contents {
+      left: inherit;
+      top: -100%;
+      padding-top: 0.9375rem;
+      -webkit-transition: top 0.3s ease-in-out;
+      -moz-transition: top 0.3s ease-in-out;
+      transition: top 0.3s ease-in-out; }
+    .menu .close {
+      margin-top: 0; }
+
+  .menu.open .contents {
+    top: 0; } }
+.list h1 {
+  font-size: inherit;
+  font-weight: inherit; }
+
+.list.children h1 {
+  font-weight: 500;
+  font-size: 1.4rem; }
+
+/*# sourceMappingURL=main.css.map */
diff --git a/pub/tree/main.js b/pub/tree/main.js
index 7937440b4..139a96ebf 100644
--- a/pub/tree/main.js
+++ b/pub/tree/main.js
@@ -1,4 +1,4 @@
-(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/actions/TreeActions.coffee":[function(require,module,exports){
+(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({"/Users/galen/src/urbit-tree/js/actions/TreeActions.coffee":[function(require,module,exports){
 var TreeDispatcher, TreePersistence;
 
 TreeDispatcher = require('../dispatcher/Dispatcher.coffee');
@@ -36,8 +36,8 @@ module.exports = {
 
 
 
-},{"../dispatcher/Dispatcher.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/dispatcher/Dispatcher.coffee","../persistence/TreePersistence.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/persistence/TreePersistence.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/AnchorComponent.coffee":[function(require,module,exports){
-var BodyComponent, CLICK, Links, TreeActions, TreeStore, a, clas, div, query, reactify, recl, ref;
+},{"../dispatcher/Dispatcher.coffee":"/Users/galen/src/urbit-tree/js/dispatcher/Dispatcher.coffee","../persistence/TreePersistence.coffee":"/Users/galen/src/urbit-tree/js/persistence/TreePersistence.coffee"}],"/Users/galen/src/urbit-tree/js/components/AnchorComponent.coffee":[function(require,module,exports){
+var BodyComponent, CLICK, Links, TreeActions, TreeStore, a, clas, div, li, query, reactify, recl, ref, ul;
 
 clas = require('classnames');
 
@@ -53,7 +53,7 @@ TreeActions = require('../actions/TreeActions.coffee');
 
 recl = React.createClass;
 
-ref = React.DOM, div = ref.div, a = ref.a;
+ref = React.DOM, div = ref.div, a = ref.a, ul = ref.ul, li = ref.li;
 
 Links = React.createFactory(query({
   path: 't',
@@ -67,27 +67,26 @@ Links = React.createFactory(query({
   render: function() {
     return div({
       className: 'links'
-    }, this.props.children, this.renderUp(), this.renderSibs(), this.renderArrows());
+    }, div({
+      className: 'icon'
+    }, div({
+      className: 'home'
+    }, ""), div({
+      className: 'app'
+    }, ""), div({
+      className: 'dpad'
+    }, this.renderUp(), this.renderArrows()), this.renderSibs()));
   },
   renderUp: function() {
     if (this.props.sein) {
-      return div({
-        id: "up",
-        key: "up"
-      }, this.renderArrow("up", this.props.sein));
+      return this.renderArrow("up", this.props.sein);
     }
   },
   renderSibs: function() {
-    var keys, style;
+    var keys;
     keys = window.tree.util.getKeys(this.props.kids);
-    if (keys.indexOf(this.props.curr) !== -1) {
-      style = {
-        marginTop: -24 * (keys.indexOf(this.props.curr)) + "px"
-      };
-    }
-    return div({
-      id: "sibs",
-      style: style
+    return ul({
+      className: "nav"
     }, keys.map((function(_this) {
       return function(key) {
         var className, data, head, href;
@@ -100,13 +99,15 @@ Links = React.createFactory(query({
           head = _this.toText(data.head);
         }
         head || (head = key);
-        className = clas({
-          active: key === _this.props.curr
-        });
-        return div({
+        className = {
+          "nav-item": true,
+          selected: key === _this.props.curr
+        };
+        return li({
           className: className,
           key: key
         }, a({
+          className: "nav-link",
           href: href,
           onClick: _this.props.onClick
         }, head));
@@ -118,8 +119,8 @@ Links = React.createFactory(query({
     href = window.tree.basepath(path);
     return a({
       href: href,
-      key: "arow-" + name,
-      className: "arow-" + name
+      key: "" + name,
+      className: "" + name
     }, "");
   },
   renderArrows: function() {
@@ -143,14 +144,7 @@ Links = React.createFactory(query({
       if (sein === "/") {
         sein = "";
       }
-      if (prev || next) {
-        return _.filter([
-          div({
-            id: "sides",
-            key: "sides"
-          }, prev ? this.renderArrow("prev", sein + "/" + prev) : void 0, next ? this.renderArrow("next", sein + "/" + next) : void 0)
-        ]);
-      }
+      return div({}, prev ? this.renderArrow("prev", sein + "/" + prev) : void 0, next ? this.renderArrow("next", sein + "/" + next) : void 0);
     }
   },
   toText: function(elem) {
@@ -172,11 +166,13 @@ Links = React.createFactory(query({
     }, this.props.children, this._render());
   },
   _render: function() {
-    return div({
-      id: "sibs"
-    }, div({
-      className: "active"
-    }, a({}, this.props.curr)));
+    return ul({
+      className: "nav"
+    }, li({
+      className: "nav-item selected"
+    }, a({
+      className: "nav-link"
+    }, this.props.curr)));
   }
 })));
 
@@ -316,7 +312,7 @@ module.exports = query({
 
 
 
-},{"../actions/TreeActions.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/actions/TreeActions.coffee","../stores/TreeStore.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/stores/TreeStore.coffee","./Async.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Async.coffee","./BodyComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/BodyComponent.coffee","./Reactify.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Reactify.coffee","classnames":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/classnames/index.js"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Async.coffee":[function(require,module,exports){
+},{"../actions/TreeActions.coffee":"/Users/galen/src/urbit-tree/js/actions/TreeActions.coffee","../stores/TreeStore.coffee":"/Users/galen/src/urbit-tree/js/stores/TreeStore.coffee","./Async.coffee":"/Users/galen/src/urbit-tree/js/components/Async.coffee","./BodyComponent.coffee":"/Users/galen/src/urbit-tree/js/components/BodyComponent.coffee","./Reactify.coffee":"/Users/galen/src/urbit-tree/js/components/Reactify.coffee","classnames":"/Users/galen/src/urbit-tree/js/node_modules/classnames/index.js"}],"/Users/galen/src/urbit-tree/js/components/Async.coffee":[function(require,module,exports){
 var TreeActions, TreeStore, _load, code, div, recl, ref, span;
 
 _load = require('./LoadComponent.coffee');
@@ -427,7 +423,7 @@ module.exports = function(queries, Child, load) {
 
 
 
-},{"../actions/TreeActions.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/actions/TreeActions.coffee","../stores/TreeStore.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/stores/TreeStore.coffee","./LoadComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/LoadComponent.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/BodyComponent.coffee":[function(require,module,exports){
+},{"../actions/TreeActions.coffee":"/Users/galen/src/urbit-tree/js/actions/TreeActions.coffee","../stores/TreeStore.coffee":"/Users/galen/src/urbit-tree/js/stores/TreeStore.coffee","./LoadComponent.coffee":"/Users/galen/src/urbit-tree/js/components/LoadComponent.coffee"}],"/Users/galen/src/urbit-tree/js/components/BodyComponent.coffee":[function(require,module,exports){
 var a, clas, div, extras, img, p, query, reactify, recl, ref, rele;
 
 clas = require('classnames');
@@ -471,7 +467,7 @@ extras = {
         }
       }, img({
         src: src,
-        className: "logo"
+        className: "logo first"
       }));
     }
   }),
@@ -557,7 +553,7 @@ module.exports = query({
 
 
 
-},{"./Async.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Reactify.coffee","classnames":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/classnames/index.js"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/CodeMirror.coffee":[function(require,module,exports){
+},{"./Async.coffee":"/Users/galen/src/urbit-tree/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-tree/js/components/Reactify.coffee","classnames":"/Users/galen/src/urbit-tree/js/node_modules/classnames/index.js"}],"/Users/galen/src/urbit-tree/js/components/CodeMirror.coffee":[function(require,module,exports){
 var div, recl, ref, textarea;
 
 recl = React.createClass;
@@ -581,7 +577,7 @@ module.exports = recl({
 
 
 
-},{}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Components.coffee":[function(require,module,exports){
+},{}],"/Users/galen/src/urbit-tree/js/components/Components.coffee":[function(require,module,exports){
 var div, recl;
 
 recl = React.createClass;
@@ -604,7 +600,7 @@ module.exports = {
 
 
 
-},{"./CodeMirror.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/CodeMirror.coffee","./EmailComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/EmailComponent.coffee","./KidsComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/KidsComponent.coffee","./ListComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/ListComponent.coffee","./SearchComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/SearchComponent.coffee","./TocComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/TocComponent.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/EmailComponent.coffee":[function(require,module,exports){
+},{"./CodeMirror.coffee":"/Users/galen/src/urbit-tree/js/components/CodeMirror.coffee","./EmailComponent.coffee":"/Users/galen/src/urbit-tree/js/components/EmailComponent.coffee","./KidsComponent.coffee":"/Users/galen/src/urbit-tree/js/components/KidsComponent.coffee","./ListComponent.coffee":"/Users/galen/src/urbit-tree/js/components/ListComponent.coffee","./SearchComponent.coffee":"/Users/galen/src/urbit-tree/js/components/SearchComponent.coffee","./TocComponent.coffee":"/Users/galen/src/urbit-tree/js/components/TocComponent.coffee"}],"/Users/galen/src/urbit-tree/js/components/EmailComponent.coffee":[function(require,module,exports){
 var button, div, input, p, reactify, recl, ref;
 
 reactify = require('./Reactify.coffee');
@@ -686,7 +682,7 @@ module.exports = recl({
 
 
 
-},{"./Reactify.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Reactify.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/KidsComponent.coffee":[function(require,module,exports){
+},{"./Reactify.coffee":"/Users/galen/src/urbit-tree/js/components/Reactify.coffee"}],"/Users/galen/src/urbit-tree/js/components/KidsComponent.coffee":[function(require,module,exports){
 var a, div, hr, li, query, reactify, recl, ref, ul;
 
 reactify = require('./Reactify.coffee');
@@ -768,7 +764,7 @@ module.exports = query({
 
 
 
-},{"./Async.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Reactify.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/ListComponent.coffee":[function(require,module,exports){
+},{"./Async.coffee":"/Users/galen/src/urbit-tree/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-tree/js/components/Reactify.coffee"}],"/Users/galen/src/urbit-tree/js/components/ListComponent.coffee":[function(require,module,exports){
 var a, clas, div, h1, li, pre, query, reactify, recl, ref, span, ul;
 
 clas = require('classnames');
@@ -797,7 +793,8 @@ module.exports = query({
     }, this.props.dataType, {
       posts: this.props.dataType === 'post',
       "default": this.props['data-source'] === 'default'
-    });
+    }, this.props.className);
+    console.log(this.props.className);
     kids = this.renderList();
     if (!(kids.length === 0 && (this.props.is404 != null))) {
       return ul({
@@ -924,12 +921,12 @@ module.exports = query({
 
 
 
-},{"./Async.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Reactify.coffee","classnames":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/classnames/index.js"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/LoadComponent.coffee":[function(require,module,exports){
-var div, input, recl, ref, textarea;
+},{"./Async.coffee":"/Users/galen/src/urbit-tree/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-tree/js/components/Reactify.coffee","classnames":"/Users/galen/src/urbit-tree/js/node_modules/classnames/index.js"}],"/Users/galen/src/urbit-tree/js/components/LoadComponent.coffee":[function(require,module,exports){
+var div, recl, ref, span;
 
 recl = React.createClass;
 
-ref = React.DOM, div = ref.div, input = ref.input, textarea = ref.textarea;
+ref = React.DOM, span = ref.span, div = ref.div;
 
 module.exports = recl({
   displayName: "Load",
@@ -955,17 +952,15 @@ module.exports = recl({
     });
   },
   render: function() {
-    return div({
-      className: "loading"
-    }, div({
-      className: "spin state-" + this.state.anim
-    }, ""));
+    return span({
+      className: "loading state-" + this.state.anim
+    }, '');
   }
 });
 
 
 
-},{}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Reactify.coffee":[function(require,module,exports){
+},{}],"/Users/galen/src/urbit-tree/js/components/Reactify.coffee":[function(require,module,exports){
 var Virtual, div, load, reactify, recl, ref, rele, span, walk;
 
 recl = React.createClass;
@@ -1033,7 +1028,7 @@ module.exports = _.extend(reactify, {
 
 
 
-},{"./LoadComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/LoadComponent.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/SearchComponent.coffee":[function(require,module,exports){
+},{"./LoadComponent.coffee":"/Users/galen/src/urbit-tree/js/components/LoadComponent.coffee"}],"/Users/galen/src/urbit-tree/js/components/SearchComponent.coffee":[function(require,module,exports){
 var a, div, input, query, reactify, recl, ref,
   slice = [].slice;
 
@@ -1172,7 +1167,7 @@ module.exports = query({
 
 
 
-},{"./Async.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Reactify.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/TocComponent.coffee":[function(require,module,exports){
+},{"./Async.coffee":"/Users/galen/src/urbit-tree/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-tree/js/components/Reactify.coffee"}],"/Users/galen/src/urbit-tree/js/components/TocComponent.coffee":[function(require,module,exports){
 var div, query, reactify, recl,
   slice = [].slice;
 
@@ -1301,7 +1296,7 @@ module.exports = query({
 
 
 
-},{"./Async.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Reactify.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/dispatcher/Dispatcher.coffee":[function(require,module,exports){
+},{"./Async.coffee":"/Users/galen/src/urbit-tree/js/components/Async.coffee","./Reactify.coffee":"/Users/galen/src/urbit-tree/js/components/Reactify.coffee"}],"/Users/galen/src/urbit-tree/js/dispatcher/Dispatcher.coffee":[function(require,module,exports){
 var Dispatcher;
 
 Dispatcher = require('flux').Dispatcher;
@@ -1323,7 +1318,7 @@ module.exports = _.extend(new Dispatcher(), {
 
 
 
-},{"flux":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/flux/index.js"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/main.coffee":[function(require,module,exports){
+},{"flux":"/Users/galen/src/urbit-tree/js/node_modules/flux/index.js"}],"/Users/galen/src/urbit-tree/js/main.coffee":[function(require,module,exports){
 var rend;
 
 rend = React.render;
@@ -1497,9 +1492,9 @@ $(function() {
 
 
 
-},{"./actions/TreeActions.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/actions/TreeActions.coffee","./components/AnchorComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/AnchorComponent.coffee","./components/BodyComponent.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/BodyComponent.coffee","./components/Components.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/components/Components.coffee","./persistence/TreePersistence.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/persistence/TreePersistence.coffee"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/classnames/index.js":[function(require,module,exports){
+},{"./actions/TreeActions.coffee":"/Users/galen/src/urbit-tree/js/actions/TreeActions.coffee","./components/AnchorComponent.coffee":"/Users/galen/src/urbit-tree/js/components/AnchorComponent.coffee","./components/BodyComponent.coffee":"/Users/galen/src/urbit-tree/js/components/BodyComponent.coffee","./components/Components.coffee":"/Users/galen/src/urbit-tree/js/components/Components.coffee","./persistence/TreePersistence.coffee":"/Users/galen/src/urbit-tree/js/persistence/TreePersistence.coffee"}],"/Users/galen/src/urbit-tree/js/node_modules/classnames/index.js":[function(require,module,exports){
 /*!
-  Copyright (c) 2015 Jed Watson.
+  Copyright (c) 2016 Jed Watson.
   Licensed under the MIT License (MIT), see
   http://jedwatson.github.io/classnames
 */
@@ -1511,7 +1506,7 @@ $(function() {
 	var hasOwn = {}.hasOwnProperty;
 
 	function classNames () {
-		var classes = '';
+		var classes = [];
 
 		for (var i = 0; i < arguments.length; i++) {
 			var arg = arguments[i];
@@ -1520,26 +1515,26 @@ $(function() {
 			var argType = typeof arg;
 
 			if (argType === 'string' || argType === 'number') {
-				classes += ' ' + arg;
+				classes.push(arg);
 			} else if (Array.isArray(arg)) {
-				classes += ' ' + classNames.apply(null, arg);
+				classes.push(classNames.apply(null, arg));
 			} else if (argType === 'object') {
 				for (var key in arg) {
 					if (hasOwn.call(arg, key) && arg[key]) {
-						classes += ' ' + key;
+						classes.push(key);
 					}
 				}
 			}
 		}
 
-		return classes.substr(1);
+		return classes.join(' ');
 	}
 
 	if (typeof module !== 'undefined' && module.exports) {
 		module.exports = classNames;
 	} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {
 		// register as 'classnames', consistent with npm package name
-		define('classnames', function () {
+		define('classnames', [], function () {
 			return classNames;
 		});
 	} else {
@@ -1547,7 +1542,7 @@ $(function() {
 	}
 }());
 
-},{}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/flux/index.js":[function(require,module,exports){
+},{}],"/Users/galen/src/urbit-tree/js/node_modules/flux/index.js":[function(require,module,exports){
 /**
  * Copyright (c) 2014-2015, Facebook, Inc.
  * All rights reserved.
@@ -1559,7 +1554,7 @@ $(function() {
 
 module.exports.Dispatcher = require('./lib/Dispatcher')
 
-},{"./lib/Dispatcher":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/flux/lib/Dispatcher.js"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/flux/lib/Dispatcher.js":[function(require,module,exports){
+},{"./lib/Dispatcher":"/Users/galen/src/urbit-tree/js/node_modules/flux/lib/Dispatcher.js"}],"/Users/galen/src/urbit-tree/js/node_modules/flux/lib/Dispatcher.js":[function(require,module,exports){
 /*
  * Copyright (c) 2014, Facebook, Inc.
  * All rights reserved.
@@ -1811,7 +1806,7 @@ var _prefix = 'ID_';
 
 module.exports = Dispatcher;
 
-},{"./invariant":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/flux/lib/invariant.js"}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/node_modules/flux/lib/invariant.js":[function(require,module,exports){
+},{"./invariant":"/Users/galen/src/urbit-tree/js/node_modules/flux/lib/invariant.js"}],"/Users/galen/src/urbit-tree/js/node_modules/flux/lib/invariant.js":[function(require,module,exports){
 /**
  * Copyright (c) 2014, Facebook, Inc.
  * All rights reserved.
@@ -1866,7 +1861,7 @@ var invariant = function(condition, format, a, b, c, d, e, f) {
 
 module.exports = invariant;
 
-},{}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/persistence/TreePersistence.coffee":[function(require,module,exports){
+},{}],"/Users/galen/src/urbit-tree/js/persistence/TreePersistence.coffee":[function(require,module,exports){
 var dedup;
 
 dedup = {};
@@ -1925,7 +1920,7 @@ module.exports = {
 
 
 
-},{}],"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/stores/TreeStore.coffee":[function(require,module,exports){
+},{}],"/Users/galen/src/urbit-tree/js/stores/TreeStore.coffee":[function(require,module,exports){
 var EventEmitter, MessageDispatcher, QUERIES, TreeStore, _curr, _data, _tree, clog;
 
 EventEmitter = require('events').EventEmitter;
@@ -2151,7 +2146,7 @@ module.exports = TreeStore;
 
 
 
-},{"../dispatcher/Dispatcher.coffee":"/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/dispatcher/Dispatcher.coffee","events":"/usr/local/lib/node_modules/watchify/node_modules/browserify/node_modules/events/events.js"}],"/usr/local/lib/node_modules/watchify/node_modules/browserify/node_modules/events/events.js":[function(require,module,exports){
+},{"../dispatcher/Dispatcher.coffee":"/Users/galen/src/urbit-tree/js/dispatcher/Dispatcher.coffee","events":"/usr/local/lib/node_modules/watchify/node_modules/browserify/node_modules/events/events.js"}],"/usr/local/lib/node_modules/watchify/node_modules/browserify/node_modules/events/events.js":[function(require,module,exports){
 // Copyright Joyent, Inc. and other Node contributors.
 //
 // Permission is hereby granted, free of charge, to any person obtaining a
@@ -2456,4 +2451,4 @@ function isUndefined(arg) {
   return arg === void 0;
 }
 
-},{}]},{},["/Users/galen/src/urbit-master/urb/zod/pub/tree/src/js/main.coffee"]);
+},{}]},{},["/Users/galen/src/urbit-tree/js/main.coffee"]);