diff --git a/nummi/main/static/main/css/form.css b/nummi/main/static/main/css/form.css
index 3f792b5..1ee72a6 100644
--- a/nummi/main/static/main/css/form.css
+++ b/nummi/main/static/main/css/form.css
@@ -5,56 +5,64 @@ form ul.errorlist {
   margin: 0;
 }
 
-form > table > tbody > tr > th {
-  background: var(--bg-01);
-  background-clip: padding-box;
+form {
+  > table > tbody > tr > th {
+    background: var(--bg-01);
+    background-clip: padding-box;
+  }
+  tbody :is(input, select, textarea) {
+    font: inherit;
+    border: none;
+    background: transparent;
+    width: 100%;
+    height: 100%;
+    line-height: 1.5;
+  }
+  input[type="checkbox"] {
+    width: initial;
+  }
+  tfoot {
+    text-align: right;
+  }
 }
-form tbody :is(input, select, textarea) {
-  font: inherit;
-  border: none;
-  background: transparent;
-  width: 100%;
-  height: 100%;
-  line-height: 1.5;
-}
-form input[type="checkbox"] {
-  width: initial;
-}
-table.file-input tr {
-  border: none;
-}
-table.file-input th {
-  text-align: left;
-}
-table.file-input tr :first-child {
-  padding-left: 0;
-}
-table.file-input tr :last-child {
-  padding-right: 0;
+table.file-input {
+  tr {
+    border: none;
+
+    :first-child {
+      padding-left: 0;
+    }
+    :last-child {
+      padding-right: 0;
+    }
+  }
+  th {
+    text-align: left;
+  }
 }
 
-form tfoot {
-  text-align: right;
-}
-.buttons input {
-  font: inherit;
-  line-height: 1.5;
-  margin-left: var(--gap);
-  border-radius: var(--radius);
-  padding: 0 var(--gap);
-  cursor: pointer;
-}
-.buttons input:hover {
-  text-decoration: underline;
-}
-.buttons input[type="submit"] {
-  border: 0.1rem solid var(--green);
-  background: var(--green-1);
-}
-.buttons input[type="reset"] {
-  border: 0.1rem solid var(--red);
-  background: var(--red-1);
-}
-.buttons a.del {
-  color: var(--red);
+.buttons {
+  input {
+    font: inherit;
+    line-height: 1.5;
+    margin-left: var(--gap);
+    border-radius: var(--radius);
+    padding: 0 var(--gap);
+    cursor: pointer;
+
+    &:hover {
+      text-decoration: underline;
+    }
+    &[type="submit"] {
+      border: 0.1rem solid var(--green);
+      background: var(--green-1);
+    }
+    &[type="reset"] {
+      border: 0.1rem solid var(--red);
+      background: var(--red-1);
+    }
+  }
+  a.del {
+    color: var(--red);
+  }
 }
diff --git a/nummi/main/static/main/css/main.css b/nummi/main/static/main/css/main.css
index de17985..4ec7b8e 100644
--- a/nummi/main/static/main/css/main.css
+++ b/nummi/main/static/main/css/main.css
@@ -60,9 +60,17 @@ a {
   color: var(--text-link);
   text-decoration: none;
   display: inline-block;
-}
-a:is(:hover, :focus) {
-  text-decoration: underline;
+
+  &:is(:hover, :focus) {
+    text-decoration: underline;
+  }
+
+  &.big-link {
+    margin-right: 1em;
+  }
+  &.big-link [class^="ri-"] {
+    margin-right: 0.5em;
+  }
 }
 
 .red {
@@ -83,6 +91,9 @@ main {
   grid-column: 2;
   grid-row: 1;
   overflow-x: hidden;
+  h2.new {
+    opacity: 0.8;
+  }
 }
 nav {
   grid-column: 1;
@@ -95,32 +106,34 @@ nav {
 
   background: var(--bg-01);
   line-height: 2rem;
-}
-nav h1 img {
-  height: 1cap;
-}
-nav ul {
-  list-style: none;
-  padding: 0;
-  margin: 0;
-  position: relative;
-}
-nav .skip-link {
-  font-weight: 300;
-}
-nav .skip-link:is(:active, :focus) {
-  font-weight: 500;
-}
-nav a {
-  display: block;
-}
-nav a.cur {
-  font-weight: 550;
-}
-nav a.cur::after {
-  content: "◎";
-  position: absolute;
-  right: 0;
+
+  h1 img {
+    height: 1cap;
+  }
+  ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    position: relative;
+  }
+  a {
+    &.skip-link {
+      font-weight: 300;
+
+      &:is(:active, :focus) {
+        font-weight: 500;
+      }
+    }
+    display: block;
+    &.cur {
+      font-weight: 550;
+      &::after {
+        content: "◎";
+        position: absolute;
+        right: 0;
+      }
+    }
+  }
 }
 :is(nav, main) > :first-child {
   margin-top: 0;
@@ -134,17 +147,19 @@ footer {
 .pagination {
   text-align: center;
   font-feature-settings: var(--num);
-}
-.pagination a {
-  min-width: 1rem;
-  padding: 0 0.5rem;
-}
-.pagination a.cur {
-  font-weight: 650;
-  text-decoration: underline dotted;
-}
-.pagination a.cur:is(:hover, :focus) {
-  text-decoration: underline;
+  a {
+    min-width: 1rem;
+    padding: 0 0.5rem;
+
+    &.cur {
+      font-weight: 650;
+      text-decoration: underline dotted;
+
+      &:is(:hover, :focus) {
+        text-decoration: underline;
+      }
+    }
+  }
 }
 
 @media (width < 1024px) {
@@ -160,13 +175,6 @@ footer {
     height: initial;
   }
 }
-
-a.big-link {
-  margin-right: 1em;
-}
-a.big-link [class^="ri-"] {
-  margin-right: 0.5em;
-}
 [class^="ri-"] {
   font-weight: normal;
 }
@@ -188,9 +196,6 @@ h2 {
 h3 {
   font-size: 1.5rem;
 }
-main h2.new {
-  opacity: 0.8;
-}
 p {
   margin: 0.5em 0;
 }
@@ -201,18 +206,19 @@ ul.messages {
   margin: 0;
   background: var(--bg-01);
   padding: 0;
-}
-ul.messages li {
-  padding: calc(var(--gap) / 2) var(--gap);
-  border-left: var(--border) solid var(--gray);
-}
 
-ul.messages li.msg-level-25 {
-  border-left-color: var(--green-1);
-}
-ul.messages li.msg-level-30 {
-  border-left-color: var(--red-1);
-}
-ul.messages li.msg-level-40 {
-  border-left-color: var(--red);
+  li {
+    padding: calc(var(--gap) / 2) var(--gap);
+    border-left: var(--border) solid var(--gray);
+
+    &.msg-level-25 {
+      border-left-color: var(--green-1);
+    }
+    &.msg-level-30 {
+      border-left-color: var(--red-1);
+    }
+    &.msg-level-40 {
+      border-left-color: var(--red);
+    }
+  }
 }
diff --git a/nummi/main/static/main/css/plot.css b/nummi/main/static/main/css/plot.css
index 1f025d2..631d3c4 100644
--- a/nummi/main/static/main/css/plot.css
+++ b/nummi/main/static/main/css/plot.css
@@ -1,116 +1,99 @@
 table.full-width col.bar {
   width: auto;
 }
+
 .plot {
   overflow-x: auto;
-}
 
-.plot td.bar {
-  position: relative;
-  padding: 0;
-}
-.plot td.bar div {
-  position: absolute;
-  height: 0.5rem;
-  top: 0;
-}
+  td.bar {
+    position: relative;
+    padding: 0;
+    @media (width < 720px) {
+      width: 0;
+      overflow: hidden;
+    }
 
-.plot td.bar div:not(.tot) {
-  width: 0;
-  box-sizing: border-box;
-  z-index: 1;
-  display: inline-block;
-}
-.plot td.bar.p div {
-  left: 0;
-  border-radius: 0 var(--radius) var(--radius) 0;
-}
-.plot td.bar.m div {
-  right: 0;
-  border-radius: var(--radius) 0 0 var(--radius);
-}
-.plot td.bar.m div {
-  background: var(--red-1);
-}
-.plot td.bar.p div {
-  background: var(--green-1);
-}
+    div {
+      position: absolute;
+      height: 0.5rem;
+      top: 0;
+      &:not(.tot) {
+        width: 0;
+        box-sizing: border-box;
+        z-index: 1;
+        display: inline-block;
+      }
+      &.tot {
+        z-index: 10;
+        height: 0.5rem;
 
-.plot td.bar div.tot {
-  z-index: 10;
-  height: 0.5rem;
-}
-.plot td.bar.m div.tot {
-  background: var(--red);
-}
-.plot td.bar.p div.tot {
-  background: var(--green);
-}
-.plot td.bar div.tot span {
-  position: absolute;
-  display: inline-block;
-  white-space: nowrap;
-  margin: 0 var(--gap);
-  font-weight: 650;
-  top: 0.5rem;
-  line-height: 1.5rem;
-  height: 1.5rem;
-  font-feature-settings: var(--num);
-}
-.plot td.bar.p div.tot span {
-  left: 0;
-}
-.plot td.bar.m div.tot span {
-  right: 0;
-}
-.plot tr.empty {
-  height: 0.5rem;
-}
-.plot tr.even {
-  background: #eeeeff;
-}
+        span {
+          position: absolute;
+          display: inline-block;
+          white-space: nowrap;
+          margin: 0 var(--gap);
+          font-weight: 650;
+          top: 0.5rem;
+          line-height: 1.5rem;
+          height: 1.5rem;
+          font-feature-settings: var(--num);
+        }
+      }
+    }
+    &.p div {
+      left: 0;
+      border-radius: 0 var(--radius) var(--radius) 0;
+      background: var(--green-1);
+      &.tot {
+        background: var(--green);
 
-@media (width < 720px) {
-  .plot .bar {
-    width: 0;
-    overflow: hidden;
+        span {
+          left: 0;
+        }
+      }
+    }
+    &.m div {
+      right: 0;
+      border-radius: var(--radius) 0 0 var(--radius);
+      background: var(--red-1);
+      &.tot {
+        background: var(--red);
+
+        span {
+          right: 0;
+        }
+      }
+    }
+  }
+  tr.empty {
+    height: 0.5rem;
+  }
+  tr.even {
+    background: #eeeeff;
+  }
+  tfoot {
+    background: var(--bg-01);
   }
 }
 
-.plot tfoot {
-  background: var(--bg-01);
-}
-
-.calendar tbody tr {
-  background: initial;
-}
 .calendar {
   margin-top: var(--gap);
-}
-.calendar .p {
-  background: var(--green);
-}
-.calendar .o-0 {
-  opacity: 0.1;
-}
-.calendar .o-1 {
-  opacity: 0.5;
-}
-.calendar .o-2 {
-  opacity: 0.75;
-}
-.calendar .o-3 {
-  opacity: 0.9;
-}
-.calendar .o-4 {
-  opacity: 1;
-}
-.calendar .m {
-  background: var(--red);
-}
-.calendar tbody tr:not(:last-child) {
-  border-bottom: none;
-}
-.calendar tbody tr:not(:first-child) {
-  border-top: none;
+
+  tbody tr {
+    background: initial;
+  }
+  .p {
+    background: var(--green);
+  }
+  .m {
+    background: var(--red);
+  }
+  tbody tr {
+    &:not(:last-child) {
+      border-bottom: none;
+    }
+    &:not(:first-child) {
+      border-top: none;
+    }
+  }
 }
diff --git a/nummi/main/static/main/css/table.css b/nummi/main/static/main/css/table.css
index 133fb68..5116345 100644
--- a/nummi/main/static/main/css/table.css
+++ b/nummi/main/static/main/css/table.css
@@ -4,37 +4,46 @@ form {
 }
 table {
   border-collapse: collapse;
+
+  &.more tbody:last-child tr:last-child {
+    border-bottom: 1px dashed var(--gray);
+  }
+  &.full-width {
+    width: 100%;
+
+    col {
+      width: 8rem;
+    }
+  }
+  col.icon {
+    width: 1ch;
+  }
+  thead {
+    background: var(--bg-01);
+  }
+  tr {
+    border: 1px solid var(--gray);
+    height: 2rem;
+    line-height: 2rem;
+
+    tbody &:nth-of-type(even) {
+      background: #eeeeff;
+    }
+  }
+  td,
+  th {
+    padding: 0 var(--gap);
+    position: relative;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    &.empty {
+      text-align: center;
+      opacity: 0.8;
+      font-weight: 300;
+    }
+  }
 }
-table.more tbody:last-child tr:last-child {
-  border-bottom: 1px dashed var(--gray);
-}
-table.full-width {
-  width: 100%;
-}
-thead {
-  background: var(--bg-01);
-}
-table.full-width col {
-  width: 8rem;
-}
-table col.icon {
-  width: 1ch;
-}
-tr {
-  border: 1px solid var(--gray);
-  height: 2rem;
-  line-height: 2rem;
-}
-.table tbody tr:nth-of-type(even) {
-  background: #eeeeff;
-}
-td,
-th {
-  padding: 0 var(--gap);
-  position: relative;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
+
 .date,
 .value {
   font-feature-settings: var(--num);
@@ -50,8 +59,3 @@ th {
 .date {
   text-align: center;
 }
-td.empty {
-  text-align: center;
-  opacity: 0.8;
-  font-weight: 300;
-}