diff --git a/resources/celerity/map.php b/resources/celerity/map.php
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@@ -7,10 +7,10 @@
  */
 return array(
   'names' => array(
-    'core.pkg.css' => '1601392f',
+    'core.pkg.css' => '2ff29d1d',
     'core.pkg.js' => '75599122',
     'darkconsole.pkg.js' => '8ab24e01',
-    'differential.pkg.css' => '5a0b221c',
+    'differential.pkg.css' => '571b1cc1',
     'differential.pkg.js' => 'e324301d',
     'diffusion.pkg.css' => '591664fa',
     'diffusion.pkg.js' => 'bfc0737b',
@@ -54,11 +54,12 @@
     'rsrc/css/application/countdown/timer.css' => '86b7b0a0',
     'rsrc/css/application/dashboard/dashboard.css' => '17937d22',
     'rsrc/css/application/diff/inline-comment-summary.css' => 'eb5f8e8c',
-    'rsrc/css/application/differential/add-comment.css' => 'c478bcaa',
-    'rsrc/css/application/differential/changeset-view.css' => 'c5d1e738',
+    'rsrc/css/application/differential/add-comment.css' => 'c47f8c40',
+    'rsrc/css/application/differential/changeset-view.css' => 'f36406b1',
     'rsrc/css/application/differential/core.css' => '7ac3cabc',
+    'rsrc/css/application/differential/phui-inline-comment.css' => 'f4751611',
     'rsrc/css/application/differential/results-table.css' => '181aa9d9',
-    'rsrc/css/application/differential/revision-comment.css' => '64603753',
+    'rsrc/css/application/differential/revision-comment.css' => '024dda6b',
     'rsrc/css/application/differential/revision-history.css' => '0e8eb855',
     'rsrc/css/application/differential/revision-list.css' => 'f3c47d33',
     'rsrc/css/application/differential/table-of-contents.css' => '63f3ef4a',
@@ -124,7 +125,7 @@
     'rsrc/css/phui/phui-action-list.css' => '9ee9910a',
     'rsrc/css/phui/phui-action-panel.css' => '3ee9afd5',
     'rsrc/css/phui/phui-box.css' => '7b3a2eed',
-    'rsrc/css/phui/phui-button.css' => '57eaddc9',
+    'rsrc/css/phui/phui-button.css' => '53f55a72',
     'rsrc/css/phui/phui-crumbs-view.css' => '594d719e',
     'rsrc/css/phui/phui-document.css' => '0f83a7df',
     'rsrc/css/phui/phui-feed-story.css' => 'c9f3a0b5',
@@ -520,12 +521,12 @@
     'conpherence-thread-manager' => 'bb928342',
     'conpherence-update-css' => '1099a660',
     'conpherence-widget-pane-css' => '1979ee8c',
-    'differential-changeset-view-css' => 'c5d1e738',
+    'differential-changeset-view-css' => 'f36406b1',
     'differential-core-view-css' => '7ac3cabc',
     'differential-inline-comment-editor' => 'b3412377',
     'differential-results-table-css' => '181aa9d9',
-    'differential-revision-add-comment-css' => 'c478bcaa',
-    'differential-revision-comment-css' => '64603753',
+    'differential-revision-add-comment-css' => 'c47f8c40',
+    'differential-revision-comment-css' => '024dda6b',
     'differential-revision-history-css' => '0e8eb855',
     'differential-revision-list-css' => 'f3c47d33',
     'differential-table-of-contents-css' => '63f3ef4a',
@@ -772,7 +773,7 @@
     'phui-action-header-view-css' => '89c497e7',
     'phui-action-panel-css' => '3ee9afd5',
     'phui-box-css' => '7b3a2eed',
-    'phui-button-css' => '57eaddc9',
+    'phui-button-css' => '53f55a72',
     'phui-calendar-css' => '8675968e',
     'phui-calendar-day-css' => 'de035c8a',
     'phui-calendar-list-css' => 'c1d0ca59',
@@ -789,6 +790,7 @@
     'phui-image-mask-css' => '5a8b09c8',
     'phui-info-panel-css' => '27ea50a1',
     'phui-info-view-css' => 'c6f0aef8',
+    'phui-inline-comment-view-css' => 'f4751611',
     'phui-list-view-css' => '2e25ebfb',
     'phui-object-box-css' => 'd68ce5dc',
     'phui-object-item-list-view-css' => '9db65899',
@@ -1921,6 +1923,9 @@
       'multirow-row-manager',
       'javelin-json',
     ),
+    'f36406b1' => array(
+      'phui-inline-comment-view-css',
+    ),
     'f36e01af' => array(
       'javelin-behavior',
       'javelin-behavior-device',
diff --git a/src/infrastructure/diff/view/PHUIDiffInlineCommentDetailView.php b/src/infrastructure/diff/view/PHUIDiffInlineCommentDetailView.php
--- a/src/infrastructure/diff/view/PHUIDiffInlineCommentDetailView.php
+++ b/src/infrastructure/diff/view/PHUIDiffInlineCommentDetailView.php
@@ -71,20 +71,14 @@
     return $this->objectOwnerPHID;
   }
 
-
-
   public function render() {
 
+    require_celerity_resource('phui-inline-comment-view-css');
     $inline = $this->inlineComment;
 
-    $start = $inline->getLineNumber();
-    $length = $inline->getLineLength();
-    if ($length) {
-      $end = $start + $length;
-      $line = 'Lines '.number_format($start).'-'.number_format($end);
-    } else {
-      $line = 'Line '.number_format($start);
-    }
+    $classes = array(
+      'differential-inline-comment',
+    );
 
     $metadata = array(
       'id' => $inline->getID(),
@@ -117,40 +111,53 @@
       $is_synthetic = true;
     }
 
-    $is_draft = false;
-    if ($inline->isDraft() && !$is_synthetic) {
-      $links[] = pht('Not Submitted Yet');
-      $is_draft = true;
+    $draft_text = null;
+    if (!$is_synthetic) {
+      // This display is controlled by CSS
+      $draft_text = id(new PHUITagView())
+        ->setType(PHUITagView::TYPE_SHADE)
+        ->setName(pht('Unsubmitted'))
+        ->setShade(PHUITagView::COLOR_RED)
+        ->addClass('mml inline-draft-text');
     }
 
-
-    // TODO: This stuff is nonfinal, just making it do something.
+    // I think this is unused
     if ($inline->getHasReplies()) {
-      $links[] = pht('Has Reply');
-      $classes[] = 'inline-has-reply';
+      $classes[] = 'inline-comment-has-reply';
     }
+    // I think this is unused
     if ($inline->getReplyToCommentPHID()) {
-      $links[] = pht('Is Reply');
+      $classes[] = 'inline-comment-is-reply';
+    }
+    // Might break?
+    if ($this->getCanMarkDone()) {
+      $classes[] = 'viewer-is-diff-author';
     }
 
+    $action_buttons = new PHUIButtonBarView();
+    $action_buttons->addClass('mml');
+    $nextprev = null;
     if (!$this->preview) {
-      $links[] = javelin_tag(
-        'a',
-        array(
-          'href'  => '#',
-          'mustcapture' => true,
-          'sigil' => 'differential-inline-prev',
-        ),
-        pht('Previous'));
-
-      $links[] = javelin_tag(
-        'a',
-        array(
-          'href'  => '#',
-          'mustcapture' => true,
-          'sigil' => 'differential-inline-next',
-        ),
-        pht('Next'));
+      $nextprev = new PHUIButtonBarView();
+      $nextprev->addClass('mml');
+      $up = id(new PHUIButtonView())
+        ->setTag('a')
+        ->setColor(PHUIButtonView::SIMPLE)
+        ->setTooltip(pht('Previous'))
+        ->setIconFont('fa-chevron-up')
+        ->addSigil('differential-inline-prev')
+        ->setMustCapture(true);
+
+      $down = id(new PHUIButtonView())
+        ->setTag('a')
+        ->setColor(PHUIButtonView::SIMPLE)
+        ->setTooltip(pht('Next'))
+        ->setIconFont('fa-chevron-down')
+        ->addSigil('differential-inline-next')
+        ->setMustCapture(true);
+
+      $nextprev->addButton($up);
+      $nextprev->addButton($down);
 
       if ($this->allowReply) {
 
@@ -161,14 +168,14 @@
           // file/line information, and synthetic comments don't have an inline
           // comment ID.
 
-          $links[] = javelin_tag(
-            'a',
-            array(
-              'href'        => '#',
-              'mustcapture' => true,
-              'sigil'       => 'differential-inline-reply',
-            ),
-            pht('Reply'));
+          $reply_button = id(new PHUIButtonView())
+            ->setTag('a')
+            ->setColor(PHUIButtonView::SIMPLE)
+            ->setIconFont('fa-reply')
+            ->setTooltip(pht('Reply'))
+            ->addSigil('differential-inline-reply')
+            ->setMustCapture(true);
+          $action_buttons->addButton($reply_button);
         }
 
       }
@@ -177,42 +184,48 @@
     $anchor_name = 'inline-'.$inline->getID();
 
     if ($this->editable && !$this->preview) {
-      $links[] = javelin_tag(
-        'a',
-        array(
-          'href'        => '#',
-          'mustcapture' => true,
-          'sigil'       => 'differential-inline-edit',
-        ),
-        pht('Edit'));
-      $links[] = javelin_tag(
-        'a',
-        array(
-          'href'        => '#',
-          'mustcapture' => true,
-          'sigil'       => 'differential-inline-delete',
-        ),
-        pht('Delete'));
+      $edit_button = id(new PHUIButtonView())
+        ->setTag('a')
+        ->setColor(PHUIButtonView::SIMPLE)
+        ->setIconFont('fa-pencil')
+        ->setTooltip(pht('Edit'))
+        ->addSigil('differential-inline-edit')
+        ->setMustCapture(true);
+      $action_buttons->addButton($edit_button);
+
+      $delete_button = id(new PHUIButtonView())
+        ->setTag('a')
+        ->setColor(PHUIButtonView::SIMPLE)
+        ->setIconFont('fa-trash-o')
+        ->setTooltip(pht('Delete'))
+        ->addSigil('differential-inline-delete')
+        ->setMustCapture(true);
+      $action_buttons->addButton($delete_button);
+
     } else if ($this->preview) {
       $links[] = javelin_tag(
         'a',
         array(
+          'class' => 'button simple',
           'meta'        => array(
             'anchor' => $anchor_name,
           ),
           'sigil'       => 'differential-inline-preview-jump',
         ),
         pht('Not Visible'));
-      $links[] = javelin_tag(
-        'a',
-        array(
-          'href'        => '#',
-          'mustcapture' => true,
-          'sigil'       => 'differential-inline-delete',
-        ),
-        pht('Delete'));
+
+      $delete_button = id(new PHUIButtonView())
+        ->setTag('a')
+        ->setColor(PHUIButtonView::SIMPLE)
+        ->setTooltip(pht('Delete'))
+        ->setIconFont('fa-trash-o')
+        ->addSigil('differential-inline-delete')
+        ->setMustCapture(true);
+      $action_buttons->addButton($delete_button);
     }
 
+    $done_button = null;
+
     if (!$is_synthetic) {
       $draft_state = false;
       switch ($inline->getFixedState()) {
@@ -241,7 +254,7 @@
         $classes[] = 'inline-state-is-draft';
       }
 
-      $links[] = javelin_tag(
+      $done_input = javelin_tag(
         'input',
         array(
           'type' => 'checkbox',
@@ -250,15 +263,16 @@
           'class' => 'differential-inline-done',
           'sigil' => 'differential-inline-done',
         ));
-    }
-
-    if ($links) {
-      $links = phutil_tag(
-        'span',
-        array('class' => 'differential-inline-comment-links'),
-        phutil_implode_html(" \xC2\xB7 ", $links));
-    } else {
-      $links = null;
+      $done_button = phutil_tag(
+        'label',
+        array(
+          'class' => 'differential-inline-done-label '.
+                      ($this->getCanMarkDone() ? null : 'done-is-disabled'),
+        ),
+        array(
+          $done_input,
+          pht('Done'),
+        ));
     }
 
     $content = $this->markupEngine->getOutput(
@@ -278,7 +292,7 @@
         '');
     }
 
-    if ($is_draft) {
+    if ($inline->isDraft() && !$is_synthetic) {
       $classes[] = 'differential-inline-comment-unsaved-draft';
     }
     if ($is_synthetic) {
@@ -292,10 +306,28 @@
       $author = $handles[$inline->getAuthorPHID()]->getName();
     }
 
-    $line = phutil_tag(
-      'span',
-      array('class' => 'differential-inline-comment-line'),
-      $line);
+    $group_left = phutil_tag(
+      'div',
+      array(
+        'class' => 'inline-head-left',
+      ),
+      array(
+        $author,
+        $draft_text,
+      ));
+
+    $group_right = phutil_tag(
+      'div',
+      array(
+        'class' => 'inline-head-right',
+      ),
+      array(
+        $anchor,
+        $links,
+        $nextprev,
+        $action_buttons,
+        $done_button,
+      ));
 
     $markup = javelin_tag(
       'div',
@@ -305,13 +337,9 @@
         'meta'  => $metadata,
       ),
       array(
-        phutil_tag_div('differential-inline-comment-head', array(
-          $anchor,
-          $links,
-          ' ',
-          $line,
-          ' ',
-          $author,
+        phutil_tag_div('differential-inline-comment-head grouped', array(
+          $group_left,
+          $group_right,
         )),
         phutil_tag_div(
           'differential-inline-comment-content',
diff --git a/src/infrastructure/diff/view/PHUIDiffInlineCommentEditView.php b/src/infrastructure/diff/view/PHUIDiffInlineCommentEditView.php
--- a/src/infrastructure/diff/view/PHUIDiffInlineCommentEditView.php
+++ b/src/infrastructure/diff/view/PHUIDiffInlineCommentEditView.php
@@ -122,7 +122,7 @@
   private function renderBody() {
     $buttons = array();
 
-    $buttons[] = phutil_tag('button', array(), pht('Ready'));
+    $buttons[] = phutil_tag('button', array(), pht('Save Draft'));
     $buttons[] = javelin_tag(
       'button',
       array(
@@ -148,11 +148,10 @@
     $edit = phutil_tag(
       'div',
       array(
-        'class' => 'differential-inline-comment-edit-buttons',
+        'class' => 'differential-inline-comment-edit-buttons grouped',
       ),
       array(
         $buttons,
-        phutil_tag('div', array('style' => 'clear: both'), ''),
       ));
 
     return javelin_tag(
diff --git a/src/view/phui/PHUIButtonBarView.php b/src/view/phui/PHUIButtonBarView.php
--- a/src/view/phui/PHUIButtonBarView.php
+++ b/src/view/phui/PHUIButtonBarView.php
@@ -14,7 +14,7 @@
   }
 
   protected function getTagName() {
-    return 'div';
+    return 'span';
   }
 
   protected function getTagContent() {
diff --git a/webroot/rsrc/css/application/differential/add-comment.css b/webroot/rsrc/css/application/differential/add-comment.css
--- a/webroot/rsrc/css/application/differential/add-comment.css
+++ b/webroot/rsrc/css/application/differential/add-comment.css
@@ -3,6 +3,15 @@
  */
 
 #inline-comment-preview {
-  margin-left: 60px;
-  width: 550px;
+  margin-left: 62px;
+  width: 640px;
+}
+
+#inline-comment-preview .differential-inline-comment {
+  margin: 12px 0;
+}
+
+#inline-comment-preview
+  .differential-inline-comment + .differential-inline-comment {
+  margin: 0 0 12px 0;
 }
diff --git a/webroot/rsrc/css/application/differential/changeset-view.css b/webroot/rsrc/css/application/differential/changeset-view.css
--- a/webroot/rsrc/css/application/differential/changeset-view.css
+++ b/webroot/rsrc/css/application/differential/changeset-view.css
@@ -1,5 +1,6 @@
 /**
  * @provides differential-changeset-view-css
+ * @requires phui-inline-comment-view-css
  */
 
 .differential-changeset {
@@ -52,41 +53,45 @@
 }
 
 .differential-diff td {
-  vertical-align:     top;
-  white-space:        pre-wrap;
-  word-wrap:          break-word;
-  padding:            0 8px 1px;
-  line-height:        16px;
+  vertical-align: top;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  padding: 0 8px 1px;
+  line-height: 16px;
 }
 
 .device .differential-diff td {
   padding: 0 4px 1px;
 }
 
+.device .differential-diff .inline td {
+  padding: 4px;
+}
+
 .differential-diff td .zwsp {
   position: absolute;
   width: 0;
 }
 
 .differential-diff th {
-  text-align:         right;
-  padding:            2px 6px 0px 0px;
-  vertical-align:     top;
-  background:         {$lightbluebackground};
-  color:              {$bluetext};
-  cursor:             pointer;
-  border-right:       1px solid {$thinblueborder};
-  overflow:           hidden;
-
-  -moz-user-select:     -moz-none;
-  -khtml-user-select:   none;
-  -webkit-user-select:  none;
-  -ms-user-select:      none;
-  user-select:          none;
+  text-align: right;
+  padding: 2px 6px 0px 0px;
+  vertical-align: top;
+  background: {$lightbluebackground};
+  color: {$bluetext};
+  cursor: pointer;
+  border-right: 1px solid {$thinblueborder};
+  overflow: hidden;
+
+  -moz-user-select: -moz-none;
+  -khtml-user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
 }
 
 .differential-diff th.selected {
-  background: {$hovergrey};
+  background-color: {$sh-yellowbackground};
 }
 
 .differential-changeset-immutable .differential-diff th {
@@ -202,7 +207,7 @@
 .differential-diff td.show-more,
 .differential-diff td.differential-shield {
   font: {$basefont};
-  font-size:   12px;
+  font-size: 12px;
   white-space: normal;
 }
 
@@ -244,9 +249,9 @@
 }
 
 .differential-meta-notice {
-  border-top: 1px solid {$yellow};
-  border-bottom: 1px solid {$yellow};
-  background-color: {$lightyellow};
+  border-top: 1px solid {$sh-lightyellowborder};
+  border-bottom: 1px solid {$sh-lightyellowborder};
+  background-color: {$sh-yellowbackground};
   padding: 12px;
 }
 
@@ -266,90 +271,48 @@
 }
 
 .differential-reticle {
-  background: {$lightyellow};
-  border: 1px solid {$yellow};
+  background-color: {$sh-yellowbackground};
+  border: 1px solid {$sh-yellowborder};
   position: absolute;
   opacity: 0.5;
-  top: 0px;
-  left: 0px;
+  top: 0;
+  left: 0;
   box-sizing: border-box;
 }
 
-.differential-inline-comment,
-.differential-inline-comment-edit {
-  background:         #ffffee;
-  border:             1px solid #ccccaa;
-  font:               {$basefont};
-  font-size:          12px;
-  margin:             6px 0px;
-  padding:            8px 10px;
-  width:              100%;
-  -moz-box-sizing:    border-box;
-  -webkit-box-sizing: border-box;
-  box-sizing:         border-box;
-  overflow:           hidden;
-  white-space:        normal;
+.differential-diff .inline td {
+  padding: 8px 12px;
 }
 
-.differential-inline-comment-edit .aphront-form-control-textarea {
-  padding: 0;
-}
-
-.differential-inline-comment-unsaved-draft {
-  background: #f1f1f1;
-  border: 1px dashed {$greytext};
-}
-
-.differential-inline-comment-head {
-  font-weight:  bold;
-  color:        #333333;
-  border-bottom:  1px solid rgba(204,204,170,0.37);
-  padding-bottom: 4px;
-  margin-bottom:  8px;
-}
-
-.differential-inline-comment-unsaved-draft .differential-inline-comment-head {
-  border-bottom: 1px solid #aaaaaa;
+.differential-loading {
+  border-top: 1px solid {$yellow};
+  border-bottom: 1px solid {$yellow};
+  background-color: {$lightyellow};
+  padding: 12px;
+  text-align: center;
 }
 
-.differential-inline-comment-synthetic {
-  background: {$lightblue};
+.differential-collapse-undo {
+  color: {$darkbluetext};
+  padding: 12px;
   border: 1px solid {$blue};
+  text-align: center;
+  background-color: {$lightblue};
 }
 
-.differential-inline-comment-synthetic .differential-inline-comment-head {
-  border-bottom: 1px solid {$blueborder};
-}
-
-
-.differential-inline-comment-links,
-.differential-inline-comment-line {
-  font-weight:  normal;
-  font-style:   italic;
-  color:        {$greytext};
-  float:        right;
-  white-space:  nowrap;
-}
-
-.differential-inline-comment-links {
-  margin-left:  8px;
-  font-style:   normal;
-}
-
-input.differential-inline-done[type="checkbox"] {
-  margin: 0;
-  display: inline;
-  cursor: pointer;
+.differential-collapse-undo a {
+  font-weight: bold;
 }
 
-input.differential-inline-done[disabled="disabled"] {
-  cursor: auto;
+.differential-file-icon-header .phui-icon-view {
+  display: inline-block;
+  margin: 0 6px 2px 0;
+  vertical-align: middle;
+  font-size: 14px;
 }
 
-
-.differential-inline-comment-edit-body .aphront-form-input {
-  margin: 0;
-  width: 100%;
+.device-phone .differential-file-icon-header .phui-icon-view {
+  display: none;
 }
 
 .differential-changeset-buttons {
@@ -387,55 +350,6 @@
   width: 50%;
 }
 
-.differential-inline-undo {
-  padding: 4px;
-  text-align: center;
-  background: {$lightyellow};
-  border: 1px solid {$yellow};
-  margin: 3px 0 1px;
-  color: {$darkgreytext};
-  font: {$basefont};
-  font-size: 12px;
-}
-
-.differential-inline-undo a {
-  font-weight: bold;
-}
-
-.differential-inline-comment-edit {
-  padding: 10px;
-}
-
-.differential-inline-comment-edit-buttons {
-  padding: 4px 0 0 0;
-}
-
-.differential-inline-comment-edit-buttons button {
-  float: right;
-  margin-left: 6px;
-}
-
-.differential-inline-comment-edit-title {
-  font-weight:    bold;
-  color:          #333333;
-  padding-bottom: 2px;
-  margin-bottom:  6px;
-}
-
-/*  When the inline editor is active, disable all the other inline comment links
-    on the page ("Edit", "Reply", "Delete", etc). The goal here is to prevent
-    issues where you open up multiple editors and run into problems with
-    assumptions about modalness. They are disabled explicitly by the JS, but
-    render them in a disabled state as well.
-*/
-.inline-editor-active .differential-inline-comment-links a,
-.inline-editor-active .differential-inline-comment-links a:hover,
-.inline-editor-active .differential-inline-comment-links a:active {
-  color: {$lightgreytext};
-  cursor: normal;
-  text-decoration: none;
-}
-
 tr.differential-inline-hidden {
   display: none;
 }
@@ -443,57 +357,3 @@
 tr.differential-inline-loading {
   opacity: 0.5;
 }
-
-
-/*  In the document, the anchor is positioned inside the inline comment, but
-    this makes the browser jump into the comment so the top isn't visible.
-    Instead, artificially position it a bit above the comment so we'll jump a
-    bit before the comment. This allows us to see the entire comment (and
-    generally the commented-on lines, at least in the case of one or two-line
-    comments) after the jump.
-*/
-.differential-inline-comment-anchor {
-  position: absolute;
-  display: block;
-  margin-top: -72px;
-}
-
-.differential-loading {
-  border-top: 1px solid {$yellow};
-  border-bottom: 1px solid {$yellow};
-  background-color: {$lightyellow};
-  padding: 12px;
-  text-align: center;
-}
-
-.differential-collapse-undo {
-  background: #FFE;
-  color: #000;
-  padding: 1em 0em;
-  border: 1px solid #CCA;
-  text-align: center;
-  background-color: #FFE;
-}
-
-.differential-collapse-undo a {
-  font-weight: bold;
-}
-
-.differential-file-icon-header .phui-icon-view {
-  display: inline-block;
-  margin: 0 6px 2px 0;
-  vertical-align: middle;
-  font-size: 14px;
-}
-
-.device-phone .differential-file-icon-header .phui-icon-view {
-  display: none;
-}
-
-.inline-is-done {
-  opacity: 0.75;
-}
-
-.inline-state-is-draft input.differential-inline-done[type="checkbox"] {
-  /* TODO: Possibly style this. */
-}
diff --git a/webroot/rsrc/css/application/differential/phui-inline-comment.css b/webroot/rsrc/css/application/differential/phui-inline-comment.css
new file mode 100644
--- /dev/null
+++ b/webroot/rsrc/css/application/differential/phui-inline-comment.css
@@ -0,0 +1,381 @@
+/**
+ * @provides phui-inline-comment-view-css
+ */
+
+.differential-comment-list .anchor-target {
+  background-color: #ffffdd;
+  border-color: #ffff00;
+}
+
+/*  In the document, the anchor is positioned inside the inline comment, but
+    this makes the browser jump into the comment so the top isn't visible.
+    Instead, artificially position it a bit above the comment so we'll jump a
+    bit before the comment. This allows us to see the entire comment (and
+    generally the commented-on lines, at least in the case of one or two-line
+    comments) after the jump.
+*/
+.differential-inline-comment-anchor {
+  position: absolute;
+  display: block;
+  margin-top: -72px;
+}
+
+.differential-inline-comment-content {
+  overflow: auto;
+}
+
+.differential-inline-comment,
+.differential-inline-comment-edit {
+  background: #fff;
+  border: 1px solid {$sh-yellowborder};
+  font: {$basefont};
+  margin: 0;
+  width: 100%;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  overflow: hidden;
+  white-space: normal;
+  border-radius: 3px;
+}
+
+.differential-inline-comment-unsaved-draft {
+  border: 1px solid {$lightgreyborder};
+}
+
+.differential-inline-comment-head {
+  font-weight:  bold;
+  color: {$darkbluetext};
+  border-bottom: 1px solid {$sh-lightyellowborder};
+  padding: 4px 5px 2px 12px;
+  background-color: {$sh-yellowbackground};
+}
+
+.device-desktop .differential-inline-comment .button.simple:hover
+  .phui-icon-view,
+.device-desktop .differential-inline-comment .button.simple:hover {
+  color: {$sky};
+}
+
+.differential-inline-comment-content {
+  padding: 12px;
+}
+
+.differential-inline-comment-unsaved-draft .differential-inline-comment-head {
+  border-bottom: 1px solid {$lightgreyborder};
+  background-color: {$lightgreybackground};
+}
+
+/* Tighten up spacing on replies */
+.differential-inline-comment.inline-comment-is-reply {
+  margin-top: -4px;
+}
+
+.differential-inline-comment .inline-head-right {
+  float: right;
+}
+
+.differential-inline-comment .inline-head-right .button {
+  vertical-align: top;
+}
+
+.differential-inline-comment .inline-head-left {
+  float: left;
+  padding: 5px 0;
+}
+
+.device-phone .differential-inline-comment .inline-head-left {
+  float: none;
+}
+
+.device-phone .differential-inline-comment .inline-head-right {
+  float: none;
+}
+
+.device-phone .differential-inline-comment .inline-head-right .mml {
+  margin: 0 4px 0 0;
+}
+
+.device-phone .differential-inline-comment .differential-inline-comment-head {
+  padding: 0px 0px 4px 8px;
+}
+
+
+/* - Sythetic Comment ---------------------------------------------------------
+
+  Comments left by our robot overlords.
+
+*/
+
+.differential-inline-comment.differential-inline-comment-synthetic {
+  border: 1px solid {$blue};
+}
+
+.differential-inline-comment.differential-inline-comment-synthetic
+  .differential-inline-comment-head {
+    border-bottom: 1px solid {$blueborder};
+    background-color: {$lightblue};
+}
+
+.differential-inline-comment.differential-inline-comment-synthetic
+  .button.simple {
+  border-color: {$blue};
+}
+
+.differential-inline-comment.differential-inline-comment-synthetic
+  .button.simple .phui-icon-view {
+  color: {$blue};
+}
+
+.differential-inline-comment.differential-inline-comment-synthetic
+  .differential-inline-comment-head {
+    padding-bottom: 4px;
+}
+
+
+/* - New/Edit Inline Comment --------------------------------------------------
+
+  Styles for when you are creating or editing an inline comment.
+
+*/
+
+.differential-inline-comment-edit-body .aphront-form-input {
+  margin: 0;
+  width: 100%;
+}
+
+.differential-inline-comment-edit {
+  padding: 8px;
+}
+
+.differential-inline-comment-edit-buttons {
+  padding: 8px 0 0 0;
+}
+
+.differential-inline-comment-edit-buttons button {
+  float: right;
+  margin-left: 6px;
+}
+
+.differential-inline-comment-edit-title {
+  font-weight: bold;
+  color: {$darkbluetext};
+  padding: 4px 0 12px;
+  font-size: 14px;
+}
+
+.differential-inline-comment-unsaved-draft .phui-button-bar .button {
+  border-color: {$lightgreyborder};
+}
+
+.differential-inline-comment-unsaved-draft .phui-button-bar .phui-icon-view {
+  color: {$lightgreytext};
+}
+
+.differential-inline-comment-edit {
+  background-color: {$lightgreybackground};
+  border: 1px solid {$lightgreyborder};
+}
+
+.differential-inline-comment-edit .remarkup-assist-textarea {
+  border-left-color: {$lightgreyborder};
+  border-right-color: {$lightgreyborder};
+  border-bottom-color: {$greyborder};
+}
+
+.differential-inline-comment-edit .remarkup-assist-bar {
+  border-left-color: {$lightgreyborder};
+  border-right-color: {$lightgreyborder};
+  border-top-color: {$lightgreyborder};
+}
+
+.differential-inline-comment-edit .aphront-form-control-textarea {
+  padding: 0;
+}
+
+
+/* - Action Buttons -----------------------------------------------------------
+
+  Reply, Edit, Delete, View, Button Bars...
+
+*/
+
+.differential-inline-comment .differential-inline-done-label,
+.differential-inline-comment .button.simple {
+  border-color: {$sh-yellowborder};
+  color: {$sh-yellowicon};
+}
+
+.differential-inline-comment .button.simple .phui-icon-view {
+  color: {$sh-yellowicon};
+}
+
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+  .differential-inline-done-label,
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+  .button.simple {
+  border-color: {$lightgreyborder};
+  color: {$lightgreytext};
+}
+
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+  .button.simple .phui-icon-view {
+  color: {$lightgreytext};
+}
+
+.device-desktop .differential-inline-comment-unsaved-draft
+  a.button.simple:hover {
+    border-color: {$lightgreyborder};
+}
+
+/* - Done Button --------------------------------------------------------------
+
+  Default colors, hovers, checked styles for the Done Button.
+
+*/
+
+.differential-inline-done-label {
+  border: 1px solid {$sh-yellowborder};
+  border-radius: 3px;
+  display: inline-block;
+  overflow: hidden;
+  margin-left: 8px;
+  padding: 3px 8px 4px;
+  cursor: pointer;
+}
+
+.differential-inline-done-label .differential-inline-done {
+  margin: 0 6px 0 0;
+  display: inline;
+  cursor: pointer;
+}
+
+input.differential-inline-done[disabled="disabled"] {
+  cursor: auto;
+}
+
+.device-desktop .differential-inline-comment.inline-is-done
+  .differential-inline-done-label:hover,
+.device-desktop .differential-inline-comment
+  .differential-inline-done-label:hover {
+    background-color: #fff;
+    color: {$sky};
+    border-color: {$lightblueborder};
+}
+
+.differential-inline-comment
+  .differential-inline-done-label.done-is-disabled {
+  color: {$sh-yellowtext};
+  border-color: {$sh-yellowborder};
+  opacity: .5;
+}
+
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+  .differential-inline-done-label.done-is-disabled {
+  color: {$lightgreytext};
+  border-color: {$lightgreyborder};
+  opacity: .5;
+}
+
+.device-desktop
+  .differential-inline-comment.differential-inline-comment-unsaved-draft
+  .differential-inline-done-label.done-is-disabled:hover {
+    background-color: transparent;
+    cursor: auto;
+}
+
+.differential-inline-comment
+  .differential-inline-done-label.done-is-disabled {
+    border-color: {$sh-lightyellowborder};
+    color: {$sh-yellowtext};
+}
+
+.device-desktop .differential-inline-comment
+  .differential-inline-done-label.done-is-disabled:hover {
+    background-color: transparent;
+    cursor: auto;
+}
+
+.differential-inline-comment.inline-is-done
+  .differential-inline-done-label {
+    background-color: #fff;
+    border-color: {$lightblueborder};
+    color: {$sky} !important;
+    opacity: 1;
+}
+
+.device-desktop .differential-inline-comment.inline-is-done
+  .differential-inline-done-label:hover {
+    background-color: #fff;
+    color: {$sky};
+}
+
+
+/* - Inline Is Done -----------------------------------------------------------
+
+  Is Done for Diff Author = grey, for Diff Viewer = yellow.
+
+*/
+
+.inline-is-done.viewer-is-diff-author {
+  border-color: {$lightgreyborder};
+}
+
+.inline-is-done.viewer-is-diff-author
+   .differential-inline-comment-head {
+    background-color: {$lightgreybackground};
+    border-bottom-color: {$lightgreyborder};
+}
+
+.inline-is-done.viewer-is-diff-author .differential-inline-comment-head
+  .button.simple,
+.inline-is-done.viewer-is-diff-author .differential-inline-comment-head
+  .differential-inline-done-label {
+    border-color: {$lightgreyborder};
+    color: {$lightgreytext};
+}
+
+.inline-is-done.viewer-is-diff-author
+  .button.simple .phui-icon-view {
+    color: {$lightgreytext};
+}
+
+
+
+/* - Unsaved Draft ------------------------------------------------------------
+
+  The Unsubmitted state of the comment / done checkbox styles.
+
+*/
+
+.differential-inline-comment .inline-draft-text {
+  display: none;
+}
+
+.differential-inline-comment.differential-inline-comment-unsaved-draft
+  .inline-draft-text {
+    display: inline-block;
+}
+
+
+/* - Undo ---------------------------------------------------------------------
+
+  A wild undo box appears!
+
+*/
+
+.differential-inline-undo {
+  padding: 8px;
+  text-align: center;
+  background: {$sh-yellowbackground};
+  border: 1px solid {$sh-yellowborder};
+  margin: 4px 0;
+  color: {$darkgreytext};
+  font: {$basefont};
+  font-size: 13px;
+  border-radius: 3px;
+}
+
+.differential-inline-undo a {
+  font-weight: bold;
+}
diff --git a/webroot/rsrc/css/application/differential/revision-comment.css b/webroot/rsrc/css/application/differential/revision-comment.css
--- a/webroot/rsrc/css/application/differential/revision-comment.css
+++ b/webroot/rsrc/css/application/differential/revision-comment.css
@@ -51,12 +51,3 @@
 .differential-haunt-mode-1 {
   padding-bottom: 250px;
 }
-
-.differential-comment-list .anchor-target {
-  background-color: #ffffdd;
-  border-color: #ffff00;
-}
-
-.differential-inline-comment-content {
-  overflow: auto;
-}
diff --git a/webroot/rsrc/css/phui/phui-button.css b/webroot/rsrc/css/phui/phui-button.css
--- a/webroot/rsrc/css/phui/phui-button.css
+++ b/webroot/rsrc/css/phui/phui-button.css
@@ -132,6 +132,11 @@
   background-image: none;
   border-bottom-color: {$darkblueborder};
   box-shadow: none;
+  text-decoration: none;
+}
+
+a.button.simple .phui-icon-view {
+  border: none;
 }
 
 a.button.simple.phuix-dropdown-open {
@@ -299,7 +304,7 @@
 }
 
 .phui-button-bar .button .phui-icon-view {
-  left: 12px;
+  left: 9px;
 }
 
 .button.has-icon .phui-button-text {
@@ -332,7 +337,7 @@
 .phui-button-bar a.button.has-icon {
   display: inline-block;
   height: 16px;
-  width: 12px;
+  width: 6px;
 }
 
 .phui-button-bar .phui-button-bar-first {