diff --git a/less/actors.less b/less/actors.less
new file mode 100644
index 00000000..d57bb084
--- /dev/null
+++ b/less/actors.less
@@ -0,0 +1,605 @@
+@import "./variables.less";
+.sw5e.sheet.actor {
+
+  /* ----------------------------------------- */
+  /*  Sheet Header                             */
+  /* ----------------------------------------- */
+
+  .sheet-header {
+    .charlevel {
+      flex: 0 0 160px;
+      height: 60px;
+      margin: 0;
+      padding: 5px;
+      text-align: right;
+
+      .level {
+        width: 100%;
+        height: 30px;
+        font-size: 20px;
+        line-height: 30px;
+
+        label {
+          display: inline;
+          font-size: 24px;
+          text-align: right;
+        }
+
+        input {
+          display: inline;
+          width: 36px;
+          font-size: 24px;
+          text-align: center;
+        }
+
+        // If the Experience Bar is disabled
+        &.noxp {
+          margin-top: 10px;
+          > label {
+            font-size: 32px;
+          }
+          > input {
+            font-size: 32px;
+            flex: 0 0 40px;
+            height: 44px;
+          }
+        }
+
+      }
+
+      .experience {
+        width: 100%;
+        height: 20px;
+        padding-right: 5px;
+        font-size: 16px;
+        color: @colorOlive;
+      }
+    }
+  }
+
+  .attributes {
+    input.temphp {
+      width: 48%;
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  General Styles                           */
+  /* ----------------------------------------- */
+
+  // Box Headers
+  h4.box-title {
+    line-height: 16px;
+    margin: 4px 8px 2px;
+    font-size: 18px;
+    border-bottom: 1px solid @colorBeige;
+  }
+
+  /* ----------------------------------------- */
+  /*  Attributes                               */
+  /* ----------------------------------------- */
+
+  ul.attributes {
+    list-style: none;
+    margin: 5px 0 0;
+    padding: 0;
+
+    li.attribute {
+      height: 70px;
+      margin: 0 5px;
+      border: @borderGroove;
+      border-radius: 4px;
+      .nodesto();
+      text-align: center;
+
+      .attribute-name {
+        flex: 0 0 18px;
+      }
+
+      .attribute-value {
+        height: 28px;
+        line-height: 28px;
+
+        input {
+          display: inline;
+          max-width: 80%;
+          height: 28px;
+          margin: 0;
+          font-size: 24px;
+        }
+
+        span.sep {
+          display: inline;
+          position: relative;
+          top: 2px;
+          font-size: 28px;
+          color: @colorTan;
+        }
+
+        &.multiple {
+          input { max-width: 33%; }
+        }
+      }
+
+      .attribute-footer {
+        flex: 0 0 18px;
+        margin-top: -1px;
+        line-height: 18px;
+        font-family: "Signika", "Palatino Linotype", serif;
+        font-size: 12px;
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Ability Scores                           */
+  /* ----------------------------------------- */
+
+  .ability-scores {
+    flex: 0 0 100%;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    .nodesto();
+
+    .ability {
+      height: 70px;
+      margin: 0 5px;
+      text-align: center;
+      border: @borderGroove;
+      border-radius: 3px;
+
+      input.ability-score {
+        height: 30px;
+        width: 50px;
+        margin: 0 auto;
+        line-height: 32px;
+        font-size: 24px;
+      }
+
+      .ability-modifiers {
+        height: 24px;
+        margin: -10px 0 0;
+
+        span.ability-mod,
+        span.ability-save {
+          flex: 0 0 24px;
+          height: 24px;
+          border-top: @borderGroove;
+        }
+
+        span.ability-mod {
+          border-right: @borderGroove;
+        }
+
+        .ability-proficiency {
+          line-height: 30px;
+        }
+
+        span.ability-save {
+          border-left: @borderGroove;
+        }
+      }
+
+      /* Hide modifier box on hover */
+
+      input.ability-score:hover + .ability-modifiers {
+        visibility: hidden;
+      }
+    }
+  }
+
+  // Proficiency Toggle Buttons
+  .proficiency-toggle {
+    color: @colorBeige;
+    font-size: 12px;
+  }
+  .proficient .proficiency-toggle {
+    color: @colorOlive;
+  }
+
+  .locked .proficiency-toggle {
+    color: @colorBeige;
+    text-shadow: none;
+    cursor: default;
+  }
+
+  /* ----------------------------------------- */
+  /*  Skills                                   */
+  /* ----------------------------------------- */
+
+  ul.skills-list {
+    flex: 0 0 192px;
+    list-style: none;
+    margin: 5px 5px 0;
+    padding: 2px 2px 0;
+    border: @borderGroove;
+    border-radius: 3px;
+
+    li.skill {
+      height: 22px;
+      padding: 3px 0;
+
+      h4 {
+        flex: 1px;
+        margin: 0;
+        font-size: 11px;
+        line-height: 18px;
+      }
+
+      .skill-proficiency {
+        flex: 0 0 16px;
+        line-height: 18px;
+      }
+
+      .skill-ability {
+        flex: 0 0 26px;
+      }
+
+      .skill-mod {
+        flex: 0 0 20px;
+      }
+
+      .skill-passive {
+        flex: 0 0 26px;
+        text-align: center;
+        color: @colorTan;
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Statuses                                 */
+  /* ----------------------------------------- */
+
+  .counters {
+    flex: 0 0 100%;
+    border-bottom: @borderGroove;
+    margin-bottom: 5px;
+
+    .counter {
+      padding: 0 3px;
+      line-height: 32px;
+
+      h4 {
+        flex: auto;
+        margin: 0;
+        .nodesto();
+        font-size: 14px;
+      }
+
+      .counter-value {
+        flex: 0 0 50px;
+        text-align: right;
+        > * {
+          display: inline;
+        }
+      }
+
+      input[type="text"] {
+        height: 20px;
+        max-width: 20px;
+        margin: 0;
+        padding: 0;
+        text-align: center;
+      }
+
+      input[type="checkbox"] {
+        position: relative;
+        margin: 0;
+        top: 6px;
+      }
+
+      span.sep {
+        margin: 0 -2px;
+        font-size: 12px;
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Traits                                   */
+  /* ----------------------------------------- */
+
+  .traits {
+    margin: 0 5px;
+
+    .form-group, .form-group-stacked {
+      margin: 0 0 4px 0;
+      justify-content: space-between;
+    }
+
+    .configure-flags {
+      flex: 1;
+    }
+
+
+    .actor-size {
+      flex: 0 0 150px;
+    }
+
+    label {
+      flex: 0 0 150px;
+      line-height: 20px;
+      font-weight: bold;
+      margin: 0;
+    }
+
+    input {
+      text-align: right;
+    }
+
+    i.fas {
+      float: right;
+      margin-right: 3px;
+      text-align: right;
+      color: #999;
+
+      &:hover {
+        color: #111;
+        text-shadow: 0 0 10px red;
+      }
+    }
+
+    .inactive {
+      color: @colorTan;
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Inventory Lists                          */
+  /* ----------------------------------------- */
+
+  .tab.features,
+  .tab.inventory,
+  .tab.powerbook {
+    overflow-y: hidden;
+  }
+
+  /* Inventory List Filters */
+  .inventory-filters {
+    margin: 0 8px;
+    flex: 0 0 20px;
+    h3, .filter-title {
+      .nodesto();
+      color: @colorOlive;
+      font-size: 18px;
+      margin: 0;
+    }
+
+    &.powerbook-filters {
+      flex: 0 0 40px;
+    }
+
+    .currency {
+      list-style: none;
+      margin: 4px 0 8px;
+      padding: 0;
+      font-size: 12px;
+
+      label {
+        flex: 0;
+        margin-left: 8px;
+        text-align: right;
+        line-height: 20px;
+        color: @colorTan;
+      }
+      input[type="text"] {
+        flex: 0 0 48px;
+        text-align: center;
+        margin-left: 8px;
+        border-bottom: @borderGroove;
+      }
+    }
+  }
+
+  .inventory-list {
+    list-style: none;
+    margin: 0;
+    padding: 0 5px;
+    overflow-y: auto;
+
+    // Inventory Item
+    .item {
+      line-height: 30px;
+      padding: 0 2px; // to align with the header border
+      border-bottom: 1px solid @colorFaint;
+      &:last-child { border-bottom: none; }
+
+      // Item Header Name
+      .item-name {
+        cursor: pointer;
+        max-height: 30px;
+        overflow: hidden;
+
+        .item-image {
+          flex: 0 0 30px;
+          background-size: 30px;
+          margin-right: 5px;
+        }
+
+        h4 {
+          margin: 0;
+          white-space: nowrap;
+          overflow-x: hidden;
+        }
+
+        &.rollable .item-image:hover {
+          background-image: url("/icons/svg/d20-black.svg") !important;
+        }
+        &.rollable:hover .item-image {
+          background-image: url("/icons/svg/d20-grey.svg") !important;
+        }
+
+        i.attuned {
+          color: @colorTan;
+        }
+      }
+
+      // Item uses
+      .item-uses input {
+        width: 24px;
+        text-align: center;
+      }
+
+      // Item Dropdown Properties
+      .item-properties {
+        margin-top: 3px;
+      }
+
+      // Charged
+      .item-recharge {
+        flex: 0 0 80px;
+        text-align: right;
+        font-size: 11px;
+        color: @colorTan;
+      }
+    }
+
+    // Inventory Header
+    .inventory-header {
+      margin: 2px 0;
+      padding: 0;
+      background: rgba(0, 0, 0, 0.05);
+      border: @borderGroove;
+      font-weight: bold;
+      line-height: 24px;
+
+      h3 {
+        margin: 0 -5px 0 0;
+        padding-left: 5px;
+        font-size: 13px;
+        font-weight: bold;
+      }
+
+      .item-controls a.item-create {
+        flex: 0 0 100%;
+      }
+    }
+
+    // Item Detail Sections
+    .item-detail {
+      flex: 0 0 70px;
+      font-size: 12px;
+      color: @colorTan;
+      text-align: center;
+      border-right: 1px solid @colorFaint;
+      &:last-child { border-right: none; }
+      &.item-action {flex: 0 0 100px}
+    }
+
+    .item-weight {
+      flex: 0 0 60px;
+      border-left: 1px solid @colorFaint;
+      border-right: 1px solid @colorFaint;
+    }
+
+    .item-list {
+      list-style: none;
+      margin: 0;
+      padding: 0;
+    }
+
+    // Item Control Buttons
+    .item-controls {
+      flex: 0 0 44px;
+      .flexrow();
+      justify-content: flex-end;
+
+      a {
+        flex: 0 0 22px;
+        font-size: 12px;
+        text-align: center;
+        color: @colorTan;
+      }
+    }
+
+    // Item Dropdown Summary
+    .item-summary {
+      flex: 0 0 100%;
+      font-size: 12px;
+      line-height: 16px;
+      padding: 0.25em 0.5em;
+      border-top: 1px solid @colorFaint;
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Powerbook                                */
+  /* ----------------------------------------- */
+
+  .powercasting-ability {
+    h3 {
+      flex: none;
+      margin-right: 5px;
+    }
+    input, span {
+      flex: 0 0 32px;
+      text-align: center;
+    }
+    select {
+      margin: 0 5px;
+      flex: 0 0 150px;
+    }
+    h3.power-dc {
+      flex: 1;
+      text-align: right;
+    }
+  }
+
+  .power-slots,
+  .power-comps {
+    flex: 0 0 72px;
+    padding-right: 5px;
+    text-align: right;
+    font-size: 12px;
+    color: @colorTan;
+    border-right: 1px solid @colorFaint;
+  }
+
+  .power-slots {
+    input, span.sep {
+      display: inline;
+      max-width: 20px;
+      text-align: center;
+    }
+  }
+
+  .power-uses {
+    padding-right: 8px;
+    text-align: right !important;
+  }
+
+  .power-school, .power-action, .power-target {
+    flex: 0 0 100px;
+    font-size: 12px;
+    color: @colorTan;
+    text-align: center;
+    border-right: 1px solid @colorFaint;
+  }
+
+  .power-component {
+    line-height: 14px;
+    &.C, &.R {
+      display: inline-block;
+      text-align: center;
+      padding-top: 1px;
+      width: 16px;
+      color: @colorFaint;
+      background: rgba(0, 0, 0, 0.4);
+      border: 1px solid transparent;
+      border-radius: 8px;
+    }
+  }
+
+  // Empty powerbook controls
+  .powerbook-empty .item-controls { flex: 1; }
+
+  /* ----------------------------------------- */
+  /*  TinyMCE                                  */
+  /* ----------------------------------------- */
+
+  .editor {
+    padding: 0 8px;
+  }
+}
diff --git a/less/apps.less b/less/apps.less
new file mode 100644
index 00000000..31c3a70c
--- /dev/null
+++ b/less/apps.less
@@ -0,0 +1,347 @@
+@import "./variables.less";
+
+@navHeight: 30px;
+@headerHeight: 100px;
+@detailsHeight: 40px;
+
+/* ----------------------------------------- */
+/*  All D&D5e Apps                           */
+/* ----------------------------------------- */
+
+.sw5e {
+  .window-content {
+    background: @sheetBackground;
+    font-size: 13px;
+    color: @colorDark
+  }
+
+  /* ----------------------------------------- */
+  /*  Element Styles                           */
+  /* ----------------------------------------- */
+
+  // Item Sheet form fields
+  input[type="text"], select {
+    height: calc(100% - 2px);
+    border: 1px solid @colorTan;
+    background: rgba(0, 0, 0, 0.05);
+    color: @colorDark;
+  }
+
+  // Hovered Fields
+  input[type="text"] {
+    &:hover,
+    &:focus {
+      border: 1px solid #111;
+      box-shadow: 0 0 8px red;
+    }
+  }
+
+  // Disabled Fields
+  input:disabled,
+  select:disabled,
+  textarea:disabled {
+    color: @colorOlive;
+    &:hover,
+    &:focus {
+      box-shadow: none !important;
+      border: 1px solid transparent !important;
+      outline: none !important;
+    }
+  }
+
+  // Buttons
+  button {
+    background: rgba(0, 0, 0, 0.10);
+    border: @borderGroove;
+  }
+
+  // Checkbox Labels
+  label.checkbox {
+    flex: auto;
+    margin: 0;
+    line-height: 20px;
+    font-size: 11px;
+    text-align: right;
+    input[type="checkbox"] {
+      height: auto;
+      margin: 0 5px 0;
+      position: relative;
+      top: 3px;
+    }
+  }
+
+  /* Form Groups */
+  .form-group {
+    label {
+      flex: 2;
+      color: @colorOlive;
+      font-weight: bold;
+    }
+    .form-fields {
+      .flexrow();
+      > * {
+        margin: 0 3px 0 0;
+        &:last-child { margin-right: 0; }
+      }
+    }
+  }
+
+  // Stacked Groups
+  .form-group.stacked {
+    label {
+      flex: 0 0 100%;
+      margin: 0;
+    }
+    label.checkbox {
+      flex: auto;
+      text-align: left;
+    }
+  }
+
+  // Form Headers
+  .form-header {
+    margin: 0 0 0.25em 0;
+    padding: 0 2px;
+    .nodesto();
+    font-size: 24px;
+    border-top: @borderGroove;
+    border-bottom: @borderGroove;
+  }
+
+  /* Tags */
+  .tag {
+    display: inline-block;
+    margin: 0 2px 0 0;
+    padding: 0 3px;
+    font-size: 10px;
+    line-height: 16px;
+    border: 1px solid #999;
+    border-radius: 3px;
+    background: rgba(0, 0, 0, 0.05);
+  }
+}
+
+
+/* ----------------------------------------- */
+/*  Entity Sheets Specifically               */
+/* ----------------------------------------- */
+
+.sw5e.sheet {
+  .window-content {
+    overflow-y: hidden;
+    padding: 5px;
+    background: @sheetBackground;
+    font-size: 13px;
+    color: @colorDark;
+
+    form {
+      height: 100%;
+      overflow: hidden;
+    }
+
+    .tab {
+      height: 100%;
+      overflow-y: auto;
+      align-content: flex-start;
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Element Styles                           */
+  /* ----------------------------------------- */
+
+  // Input Fields
+  input[type="text"] {
+    background: none;
+    border: 1px solid transparent;
+    &:hover,
+    &:focus {
+      border: 1px solid #111;
+    }
+  }
+
+  // Select Fields
+  select {
+    flex: 1;
+    font-size: 12px;
+    height: 22px;
+    background: transparent;
+  }
+
+  // Rollable Links
+  .editable .rollable:hover {
+    color: #000;
+    text-shadow: 0 0 10px red;
+    cursor: pointer;
+  }
+
+  /* ----------------------------------------- */
+  /*  TinyMCE                                  */
+  /* ----------------------------------------- */
+
+  .editor {
+    height: 100%;
+    .tox-toolbar-overlord,
+    .tox-toolbar__primary {
+      background: none;
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Sheet Header                             */
+  /* ----------------------------------------- */
+  .sheet-header {
+    flex: 0 0 @headerHeight;
+    border-bottom: @borderGroove;
+    .nodesto();
+
+    /* Character Name */
+    h1 {
+      flex: 1;
+      border-bottom: none;
+      height: 60px;
+      margin: 0;
+      padding: 5px;
+
+      input {
+        height: 50px;
+        font-size: 36px;
+      }
+    }
+
+    /* Profile Image */
+    img.profile {
+      flex: 0 0 @headerHeight;
+      max-width: @headerHeight;
+      height: @headerHeight;
+      object-fit: cover;
+      border: none;
+      border-right: @borderGroove;
+    }
+
+    /* Header Summary Details */
+    .summary {
+      flex: 0 0 100%;
+      height: @detailsHeight;
+      margin: 0;
+      padding: 0;
+      list-style: none;
+      border-top: @borderGroove;
+      border-bottom: none;
+
+      li {
+        width: 33.33%;
+        float: left;
+        height: @detailsHeight - 6px;
+        margin: 2px 0;
+        padding: 0 3px;
+        border-right: @borderGroove;
+        line-height: 34px;
+        color: @colorOlive;
+
+        &:last-child {
+          border-right: none;
+        }
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Sheet Navigation                         */
+  /* ----------------------------------------- */
+
+  .sheet-navigation {
+    flex: 0 0 @navHeight;
+    margin-bottom: 5px;
+    .nodesto();
+
+    .item {
+      height: 30px;
+      line-height: 32px;
+      margin: 0 24px;
+      border-bottom: 3px solid @colorBeige;
+
+      &.active {
+        border-bottom: 3px solid @colorCrimson;
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Sheet Body                               */
+  /* ----------------------------------------- */
+
+  .sheet-body {
+    flex: 1;
+    overflow: hidden;
+  }
+
+  /* ----------------------------------------- */
+  /*  List Filters                             */
+  /* ----------------------------------------- */
+
+  .filter-list {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    line-height: 16px;
+
+    .filter-title {
+      flex: 3;
+    }
+
+    .filter-item {
+      text-align: center;
+      font-size: 12px;
+      margin: 0 6px;
+      border-bottom: 3px solid @colorBeige;
+      white-space: nowrap;
+
+      &:hover {
+        text-shadow: 0 0 4px red;
+        border-bottom: 3px solid @colorTan;
+      }
+
+      &.active {
+        border-bottom: 3px solid @colorCrimson;
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Trait Lists                              */
+  /* ----------------------------------------- */
+
+  .trait-selector {
+    flex: 0 0 16px;
+    padding: 2px 0;
+    color: #999;
+    font-size: 10px;
+  }
+
+  .traits-list {
+    line-height: 20px;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    text-align: right;
+  }
+}
+
+
+/* ----------------------------------------- */
+/* Trait Selector
+/* ----------------------------------------- */
+
+#trait-selector {
+  .trait-list {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  input[type="text"] {
+    height: 24px;
+    margin: 2px;
+  }
+}
\ No newline at end of file
diff --git a/less/character.less b/less/character.less
new file mode 100644
index 00000000..1c22524b
--- /dev/null
+++ b/less/character.less
@@ -0,0 +1,250 @@
+@import "./variables.less";
+
+/* ----------------------------------------- */
+/*  Basic Structure                          */
+/* ----------------------------------------- */
+.sw5e.sheet.actor.character {
+  min-width: 672px;
+  min-height: 736px;
+
+  /* ----------------------------------------- */
+  /*  Sheet Header                             */
+  /* ----------------------------------------- */
+
+  .sheet-header {
+
+    // Character Profile image (larger than usual)
+    img.profile {
+      flex: 0 0 180px;
+      max-width: 180px;
+      height: 180px;
+    }
+
+    // Character level and experience bar
+    .charlevel {
+      flex: 0 0 180px;
+      padding: 0 5px 2px;
+
+      .level {
+        height: 28px;
+      }
+
+      .experience {
+        input[type="text"] {
+          width: 100px;
+        }
+      }
+
+      .xpbar {
+        width: 100%;
+        flex: 0 0 8px;
+        background: #666;
+        border: 1px solid #000;
+        border-radius: 3px;
+
+        .bar {
+          height: 4px;
+          margin: 1px;
+          display: block;
+          background: #afebff;
+          border: 1px solid #000;
+          border-radius: 2px;
+        }
+      }
+    }
+
+    // Character Summary
+    .summary {
+      border-bottom: @borderGroove;
+    }
+
+    // Primary Attributes
+    .attributes {
+      height: 80px;
+      margin: 0;
+
+      .attribute {
+        height: 80px;
+        margin: 0;
+        border: none;
+        border-right: @borderGroove;
+        border-radius: 0;
+
+        &:last-child {
+          border-right: none;
+        }
+
+        .attribute-value {
+          margin: 5px 0 0;
+          height: 32px;
+          line-height: 32px;
+        }
+
+        .attribute-name {
+          margin-top: 6px;
+        }
+
+        .attribute-footer {
+          margin-bottom: 2px;
+        }
+      }
+
+      a.rest {
+        border: 1px solid @colorBeige;
+        border-radius: 2px;
+        background: rgba(0, 0, 0, 0.05);
+        padding: 1px 3px;
+        margin: 0 6px;
+      }
+
+      .hit-dice {
+        font-size: 24px;
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Sheet Body                               */
+  /* ----------------------------------------- */
+
+  .attributes {
+    .resource {
+      .attribute-name {
+        margin: 0 8px;
+        input[type="text"] {
+          height: 20px;
+          margin: 2px 0 -2px;
+          line-height: 24px;
+        }
+      }
+      label.checkbox {
+        margin: 0 3px;
+        input[type="checkbox"] {
+          transform: scale(1.2);
+        }
+      }
+    }
+
+    .initiative .attribute-footer input {
+      width: 32px;
+    }
+  }
+
+  ul.skills-list {
+    flex: 0 0 212px;
+
+    li.skill {
+      padding: 3px;
+      h4 {
+        flex: 1px;
+        margin: 0;
+        font-size: 13px;
+      }
+    }
+  }
+
+  .counters {
+    .death-saves {
+      flex: 2;
+      .counter-value {
+        flex: 0 0 90px;
+      }
+    }
+  }
+
+  .item-detail.player-class {
+    flex: 0 0 180px;
+    text-align: right;
+    padding-right: 10px;
+  }
+
+  /* ----------------------------------------- */
+  /*  Inventory                                */
+  /* ----------------------------------------- */
+
+  /* Encumbrance Bar */
+  .encumbrance {
+    flex: 0 0 12px;
+    background: @colorTan;
+    margin: 1px 15px 0 1px;
+    border: 1px solid @colorDark;
+    border-radius: 3px;
+    position: relative;
+
+    .encumbrance-bar {
+      position: absolute;
+      top: 1px;
+      left: 1px;
+      background: #6c8aa5;
+      height: 8px;
+      border: 1px solid #cde4ff;
+      border-radius: 2px;
+    }
+
+    .encumbrance-label {
+      height: 10px;
+      padding: 0 5px;
+      position: absolute;
+      top: 0;
+      right: 0;
+      font-size: 13px;
+      line-height: 12px;
+      text-align: right;
+      color: #EEE;
+      text-shadow: 0 0 5px #000;
+    }
+
+    .encumbrance-breakpoint {
+      display: block;
+      position: absolute;
+      &.encumbrance-33 { left: 33% }
+      &.encumbrance-66 { left: 66% }
+    }
+
+    .arrow-up {
+      bottom: 0;
+      width: 0;
+      height: 0;
+      border-left: 4px solid transparent;
+      border-right: 4px solid transparent;
+      border-bottom: 4px solid #666;
+    }
+
+    .arrow-down {
+      top: 0;
+      width: 0;
+      height: 0;
+      border-left: 4px solid transparent;
+      border-right: 4px solid transparent;
+      border-top: 4px solid #666;
+    }
+
+    &.encumbered {
+      .arrow-up { border-bottom: 4px solid #000; }
+      .arrow-down { border-top: 4px solid #000; }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Item Controls                            */
+  /* ----------------------------------------- */
+
+  .inventory,
+  .powerbook {
+    .item-controls {
+      flex: 0 0 68px;
+      .item-toggle {
+        color: @colorBeige;
+        &.active {
+          color: @colorOlive;
+        }
+        &.fixed {
+          color: @colorCrimson;
+          &:hover {
+            text-shadow: none;
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/less/chat.less b/less/chat.less
new file mode 100644
index 00000000..5b31fa5e
--- /dev/null
+++ b/less/chat.less
@@ -0,0 +1,103 @@
+@import "variables.less";
+
+/* ----------------------------------------- */
+/*  Chat Cards
+/* ----------------------------------------- */
+
+.sw5e.chat-card {
+  font-style: normal;
+  font-size: 12px;
+
+  .card-header {
+    padding: 3px 0;
+    border-top: 2px groove #FFF;
+    border-bottom: 2px groove #FFF;
+
+    img {
+      flex: 0 0 36px;
+      margin-right: 5px;
+    }
+
+    h3 {
+      flex: 1;
+      margin: 0;
+      line-height: 36px;
+      .nodesto();
+      color: @colorOlive;
+      &:hover {
+        color: #111;
+        text-shadow: 0 0 10px red;
+      }
+    }
+  }
+
+  .card-content {
+    margin: 5px 0;
+
+    h3 {
+      font-size: 12px;
+      margin: 0;
+      font-weight: bold;
+    }
+
+    > * {
+      -webkit-user-select: text;
+      -moz-user-select: text;
+      -ms-user-select: text;
+      user-select: text;
+    }
+  }
+
+  .card-buttons {
+    margin: 5px 0;
+
+    span {
+      display: block;
+      line-height: 28px;
+      text-align: center;
+      border: 1px solid @borderLight;
+    }
+
+    button {
+      font-size: 12px;
+      height: 24px;
+      line-height: 20px;
+      margin: 2px 0;
+    }
+  }
+
+  .card-footer {
+    padding: 3px 0 0;
+    border-top: 2px groove #FFF;
+
+    span {
+      border-right: 2px groove #FFF;
+      padding: 0 5px 0 0;
+      font-size: 10px;
+
+      &:last-child {
+        border-right: none;
+        padding-right: 0;
+      }
+    }
+  }
+}
+
+.dice-roll .dice-total {
+  &.success {
+    color: inherit;
+    background: #c7d0c0;
+    border: 1px solid #006c00;
+  }
+  &.failure {
+    color: inherit;
+    background: #ffdddd;
+    border: 1px solid #6e0000;
+  }
+  &.critical {
+    color: green;
+  }
+  &.fumble {
+    color: red;
+  }
+}
\ No newline at end of file
diff --git a/less/items.less b/less/items.less
new file mode 100644
index 00000000..e040ddaa
--- /dev/null
+++ b/less/items.less
@@ -0,0 +1,221 @@
+@import "./variables.less";
+.sw5e.sheet.item {
+  min-height: 420px;
+
+  /* ----------------------------------------- */
+  /*  Sheet Header                             */
+  /* ----------------------------------------- */
+
+  .sheet-header {
+    img.profile {
+      border: 2px solid #000;
+    }
+
+    .item-subtitle {
+      flex: 0 0 80px;
+      height: 60px;
+      margin: 0;
+      padding: 5px;
+      text-align: right;
+      color: @colorTan;
+
+      .item-type {
+        font-size: 24px;
+        line-height: 26px;
+        margin: 0;
+      }
+
+      .item-status {
+        font-size: 16px;
+        line-height: 24px;
+      }
+    }
+  }
+
+  .sheet-navigation {
+    margin-bottom: 5px;
+    .item {
+      font-size: 18px;
+    }
+  }
+
+  .sheet-body {
+    overflow: hidden;
+
+    .tab {
+      padding: 0 5px;
+      overflow: hidden auto;
+    }
+
+    .item-properties {
+      flex: 0 0 120px;
+      margin: 5px 5px 5px 0;
+      padding-right: 5px;
+      border-right: @borderGroove;
+
+      .form-group {
+        margin: 0;
+        label {
+          line-height: 20px;
+        }
+        input {
+          text-align: right;
+        }
+      }
+
+      .properties-list {
+        list-style: none;
+        margin: 0;
+        padding: 0;
+
+        li {
+          margin: 3px 0;
+          padding: 0 2px;
+          background: rgba(0, 0, 0, 0.05);
+          border: @borderGroove;
+          text-align: center;
+          font-size: 12px;
+          line-height: 18px;
+        }
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Item Details Form                        */
+  /* ----------------------------------------- */
+
+  .details {
+
+    // Item Sheet form fields
+    input[type="text"], select {
+      height: 24px;
+      border: 1px solid @colorTan;
+      background: rgba(0, 0, 0, 0.05);
+    }
+
+    .form-group {
+      span {
+        text-align: center;
+        line-height: 24px;
+      }
+    }
+
+    .form-group.input-select {
+      select {
+        flex: 1.8;
+      }
+    }
+
+    .form-group.input-select-select {
+      select {
+        flex: 1.5;
+      }
+    }
+
+    .form-group.uses-per {
+      input {
+        flex: 1;
+      }
+      span {
+        flex: 0 0 16px;
+      }
+      select {
+        flex: 3;
+      }
+    }
+
+    span.sep {
+      flex: 0 0 8px;
+    }
+
+    .prepared {
+      flex: 1.3 !important;
+      text-align: right;
+      padding-right: 10px;
+    }
+
+    // Power Materials
+    .power-materials {
+      flex: 0 0 100%;
+      margin: 0.25em 0;
+      justify-content: flex-end;
+      label {
+        flex: 0 0 64px;
+        text-align: right;
+        margin-right: 5px;
+        font-size: 12px;
+        line-height: 24px;
+      }
+      input[type="text"] {
+        flex: 0 0 48px;
+        margin-right: 10px;
+      }
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Item Actions                             */
+  /* ----------------------------------------- */
+
+  h4.damage-header {
+    margin: 0;
+    padding: 0;
+    font-weight: bold;
+    line-height: 24px;
+    color: @colorOlive;
+  }
+
+  .damage-parts {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+
+    .damage-part {
+      flex: 0 0 100%;
+      padding: 0;
+      input {
+        flex: 3;
+      }
+      select {
+        margin-left: 5px;
+        flex: 1;
+      }
+    }
+  }
+
+  .damage-control {
+    width: 18px;
+    flex: 0 0 18px;
+    line-height: 24px;
+    float: right;
+    text-align: right;
+    color: @colorTan;
+  }
+
+  .recharge {
+    span {
+      flex: 0 0 80px;
+    }
+    label.checkbox {
+      flex: 0 0 80px;
+      text-align: right;
+    }
+  }
+
+  /* ----------------------------------------- */
+  /*  Item Actions                             */
+  /* ----------------------------------------- */
+
+  .weapon-properties label.checkbox {
+    flex: 0 0 98px;
+  }
+
+  /* ----------------------------------------- */
+  /*  Loot Sheet (No Tabs)                     */
+  /* ----------------------------------------- */
+
+  .loot-header {
+    margin-bottom: 10px;
+  }
+}
diff --git a/less/npc.less b/less/npc.less
new file mode 100644
index 00000000..9fe4c6be
--- /dev/null
+++ b/less/npc.less
@@ -0,0 +1,9 @@
+@import "./variables.less";
+
+/* ----------------------------------------- */
+/*  Basic Structure                          */
+/* ----------------------------------------- */
+.sw5e.sheet.actor.npc {
+  min-width: 600px;
+  min-height: 658px;
+}
\ No newline at end of file
diff --git a/less/sw5e.less b/less/sw5e.less
new file mode 100644
index 00000000..5d2ad9af
--- /dev/null
+++ b/less/sw5e.less
@@ -0,0 +1,7 @@
+@import "variables.less";
+@import "apps.less";
+@import "actors.less";
+@import "items.less";
+@import "chat.less";
+@import "character.less";
+@import "npc.less";
diff --git a/less/variables.less b/less/variables.less
new file mode 100644
index 00000000..acb137ae
--- /dev/null
+++ b/less/variables.less
@@ -0,0 +1,65 @@
+
+/* Deprecated vars */
+@borderLight: #CCC;
+@borderDark: #666;
+
+/* ----------------------------------------- */
+/*  Fonts                                    */
+/* ----------------------------------------- */
+
+@font-face {
+  font-family: "Nodesto";
+  src: url("fonts/NodestoCapsCondensed.otf");
+}
+.nodesto {
+  font-family: "Nodesto", "Signika", "Palatino Linotype", serif;
+  font-size: 20px;
+}
+
+/* ----------------------------------------- */
+/*  Sheet Styles                             */
+/* ----------------------------------------- */
+
+@colorDark: #191813;
+@colorFaint: #c9c7b8;
+@colorBeige: #b5b3a4;
+@colorTan: #7a7971;
+@colorOlive: #4b4a44;
+@colorCrimson: #44191A;
+@borderGroove: 2px groove #eeede0;
+@sheetBackground: url("ui/parchment.jpg") repeat;
+
+/* ----------------------------------------- */
+/*  Flexbox                                  */
+/* ----------------------------------------- */
+
+.flexrow {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+
+  > * {
+    flex: 1;
+  }
+
+  .flex1 { flex: 1; }
+  .flex2 { flex: 2; }
+  .flex3 { flex: 3; }
+  .flex4 { flex: 4; }
+}
+
+.flexcol {
+  display: flex;
+  flex-direction: column;
+  flex-wrap: nowrap;
+
+  > * {
+    flex: 1;
+  }
+
+  .flex1 { flex: 1; }
+  .flex2 { flex: 2; }
+  .flex3 { flex: 3; }
+  .flex4 { flex: 4; }
+}