--- a/app/assets/stylesheets/application.scss	Mon Jun 08 19:14:53 2015 +0900
+++ b/app/assets/stylesheets/application.scss	Sat Jun 27 14:46:01 2015 +0900
@@ -1,6 +1,224 @@
-@import "variables";
-@import "components";
-@import "layout";
+$spacing: 10px;
+$screen-sm: 600px;
+
+$bg: #fff;
+$gray: #eee;
+$gray-dark: darken($gray, 20%);
+$danger: scale-color(#f00, $lightness: 90%);
+$danger-dark: darken($danger, 60%);
+$info: scale-color(#0f0, $lightness: 90%);
+$info-dark: darken($info, 60%);
+$primary: scale-color(#06f, $lightness: 90%);
+
+$monospace: Consolas, monospace;
+
+*, ::before, ::after {
+  position: relative;
+  box-sizing: border-box;
+}
+
+body, button, input, textarea {
+  font-family: Segoe UI, Helvetica Neue, Helvetica, Arial, sans-serif;
+  font-size: 12px;
+}
+
+p, h1 {
+  margin: 0px;
+}
+
+html {
+  height: 100%;
+}
+
+body {
+  height: 100%;
+  margin: 0px;
+  display: flex;
+  flex-direction: column;
+}
+
+.input-url1 { display: none !important; }
+
+.monospaced {
+  font-family: $monospace;
+}
+
+.header {
+  background-color: $gray;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: $spacing;
+  flex: none;
+}
+
+.main {
+  display: flex;
+  flex: 1 0 auto;
+  padding: $spacing;
+  flex-direction: column;
+}
+
+.main-form {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+.main-textarea-container {
+  flex: 1 0 auto;
+  display: flex;
+}
+
+.main-textarea {
+  width: 100%;
+}
+
+.settings {
+  display: flex;
+  margin: $spacing (-$spacing/2) 0px;
+}
+
+.settings-item {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  margin: 0px $spacing/2;
+
+  @media (min-width: $screen-sm) {
+    flex: none;
+  }
+}
+
+.settings-label {
+  margin-bottom: $spacing/2;
+}
+
+.actions {
+  display: flex;
+}
+
+.action {
+  flex: 1;
+  @media (min-width: $screen-sm) {
+    flex: none;
+  }
+  margin: 0px $spacing/2;
+}
 
-@import "new-paste";
-@import "show-paste";
+.alert {
+  padding: $spacing;
+  flex: none;
+}
+
+.alert-danger {
+  background-color: $danger;
+}
+
+.alert-info {
+  background-color: $info;
+}
+
+.field_with_errors {
+  display: flex;
+  width: 100%;
+  border: 1px solid $danger-dark;
+}
+
+.paste-content {
+  flex: 1 0 auto;
+  display: flex;
+  flex-direction: column;
+}
+
+.paste-nav {
+  display: flex;
+  justify-content: space-between;
+  margin: 0px (-$spacing/2);
+}
+
+.paste-nav-item {
+  flex: 1 1 0px;
+  text-align: center;
+  border: 1px solid $gray-dark;
+  margin: 0px $spacing/2 $spacing;
+  padding: $spacing;
+
+  &:hover {
+    background-color: $gray-dark;
+  }
+}
+
+.active {
+  background-color: $gray;
+}
+
+.paste-plain {
+  background-color: $gray;
+  margin: 0px;
+  border: 1px solid $gray-dark;
+  flex: none;
+}
+
+.line {
+  background-color: $bg;
+  flex: 1;
+}
+
+.paste-nav--bottom {
+  margin-top: $spacing;
+  margin-bottom: 0px;
+}
+
+.settings-item--inline {
+  flex-direction: row;
+  flex: 1;
+}
+
+.action--horizontal-minimum {
+  margin: 0px;
+  flex: none;
+}
+
+.settings-group {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+
+  @media (min-width: $screen-sm) {
+    flex-direction: row;
+    justify-content: space-between;
+  }
+}
+
+.btn {
+  box-shadow: 0px -2px 0px rgba(0, 0, 0, 0.1) inset;
+  border: 0px;
+  background-color: $gray;
+  cursor: pointer;
+  padding: $spacing ($spacing*2);
+}
+
+@mixin btn-color($color) {
+  background-color: $color;
+
+  &:hover {
+    background-color: darken($color, 10%);
+  }
+
+  &:focus {
+    background-color: darken($color, 20%);
+  }
+}
+
+.btn--primary {
+  @include btn-color($primary);
+}
+
+.btn--danger {
+  @include btn-color($danger);
+}
+
+.btn--min-width {
+  flex: none;
+}