diff --git a/dist/shoelace.css b/dist/shoelace.css
index efd52d06..763c4ba7 100644
--- a/dist/shoelace.css
+++ b/dist/shoelace.css
@@ -16,7 +16,7 @@
 
 /*! Buttons */@-webkit-keyframes button-loader{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes button-loader{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.button,button{font-family:inherit;font-size:1rem;font-weight:inherit;text-align:center;text-decoration:none;color:#fff;background-color:#0074d9;border-radius:.25rem;border:none;height:2rem;line-height:2rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:middle;white-space:nowrap;padding:0 .75em;-webkit-box-shadow:inset 0 2px 0 hsla(0,0%,100%,.1),inset 0 -2px 0 rgba(0,0,0,.1);box-shadow:inset 0 2px 0 hsla(0,0%,100%,.1),inset 0 -2px 0 rgba(0,0,0,.1);cursor:pointer;display:inline-block;-webkit-transition:box-shadow .1s,background-color .1s;transition:box-shadow .1s,background-color .1s}.button-small{font-size:.8rem;height:1.25rem;line-height:1.25rem}.button-big{font-size:1.2rem;height:2.75rem;line-height:2.75rem}.button-block{width:100%!important;display:block}.button-link{text-decoration:none}.button-link,.button-link:hover:not(:disabled):not(.disabled){background-color:transparent;color:#0074d9;-webkit-box-shadow:none;box-shadow:none}.button-link:hover:not(:disabled):not(.disabled){text-decoration:underline}.button:hover,button:hover{color:#fff;text-decoration:none}.button:hover:not(.disabled),button:hover:not(:disabled){color:#fff;-webkit-box-shadow:inset 0 2px 5rem rgba(0,0,0,.1),inset 0 -2px 0 rgba(0,0,0,.1);box-shadow:inset 0 2px 5rem rgba(0,0,0,.1),inset 0 -2px 0 rgba(0,0,0,.1)}.button.active:not(.button-link):not(.disabled),.button:active:not(.button-link):not(.disabled),button.active:not(.button-link):not(:disabled),button:active:not(.button-link):not(:disabled){-webkit-box-shadow:inset 0 2px 5rem rgba(0,0,0,.1),inset 0 2px 0 rgba(0,0,0,.1);box-shadow:inset 0 2px 5rem rgba(0,0,0,.1),inset 0 2px 0 rgba(0,0,0,.1)}.button.disabled,button:disabled{opacity:.5;cursor:not-allowed}label.button input[type=file]{display:none}.button-loader,.button-loader:hover{position:relative;min-width:2.8em;color:transparent!important;overflow:hidden}.button-loader:after{content:"";position:absolute;top:calc(50% - .7em);left:calc(50% - .7em);width:1.4em;height:1.4em;border-radius:50%;border:.2em solid hsla(0,0%,100%,.2);border-top-color:#fff;border-left-color:#fff;display:inline-block;-webkit-animation:button-loader .75s linear infinite;animation:button-loader .75s linear infinite}.button-light.button-loader:after{border-top-color:#111;border-left-color:#111}.button-dark.button-loader:after{border-top-color:#fff;border-left-color:#fff}.button-secondary{background-color:#aaa}.button-success{background-color:#2ecc40}.button-info{background-color:#39cccc}.button-warning{background-color:#ff851b}.button-danger{background-color:#ff4136}.button-light,.button-light:hover:not(.disabled),button.button-light:hover:not(:disabled){color:#111;background-color:#fff}.button-dark,.button-dark:hover:not(.disabled),button.button-dark:hover:not(:disabled){color:#fff;background-color:#111}
 
-/*! Dropdowns */.dropdown{position:relative;display:inline-block}.dropdown-trigger:after{content:"▼";font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue;font-size:.6em;vertical-align:middle;margin-left:.5em;display:inline-block;-webkit-transform:scaleY(.75);transform:scaleY(.75);margin-top:-.2em}.dropdown-top .dropdown-trigger:after{-webkit-transform:scaleY(.75) rotate(180deg);transform:scaleY(.75) rotate(180deg)}.dropdown-menu{position:absolute;top:calc(100% + 1px);left:0;z-index:100;min-width:10rem;max-width:25rem;max-height:none;background-color:#fff;border:1px solid #ddd;border-radius:.25rem;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.05);box-shadow:0 1px 0 rgba(0,0,0,.05);display:none;padding:.25rem 0;overflow-y:auto}.dropdown-top .dropdown-menu{top:auto;bottom:calc(100% + 1px)}.dropdown-left .dropdown-menu{left:auto;right:0}.dropdown.active .dropdown-menu{display:block}.dropdown-menu a{position:relative;color:#111;text-decoration:none;padding:.25rem calc(1rem + .5em);display:block;white-space:nowrap;overflow-x:hidden;text-overflow:ellipsis}.dropdown-menu a:hover:not(.disabled){color:#fff;background-color:#0074d9}.dropdown-menu a.disabled{cursor:not-allowed;opacity:.5}.dropdown-menu a.checked:before{position:absolute;left:calc(.5rem - .1em);content:"✓";font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue;font-weight:600}.dropdown-menu hr{width:100%;border-top:1px solid #ddd;margin:.25rem 0}
+/*! Dropdowns */.dropdown{position:relative;display:inline-block}.dropdown .dropdown-trigger:after{content:"▼";font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue;font-size:.6em;vertical-align:middle;margin-left:.5em;display:inline-block;-webkit-transform:scaleY(.75);transform:scaleY(.75);margin-top:-.2em}.dropdown.dropdown-top .dropdown-trigger:after{-webkit-transform:scaleY(.75) rotate(180deg);transform:scaleY(.75) rotate(180deg)}.dropdown .dropdown-menu{position:absolute;top:calc(100% + 1px);left:0;z-index:100;min-width:10rem;max-width:25rem;max-height:none;background-color:#fff;border:1px solid #ddd;border-radius:.25rem;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.05);box-shadow:0 1px 0 rgba(0,0,0,.05);display:none;padding:.25rem 0;overflow-y:auto;-webkit-transform:translateZ(0);transform:translateZ(0)}.dropdown .dropdown-menu a{position:relative;color:#111;text-decoration:none;padding:.25rem calc(1rem + .5em);display:block;white-space:nowrap;overflow-x:hidden;text-overflow:ellipsis}.dropdown .dropdown-menu a:hover:not(.disabled){color:#fff;background-color:#0074d9}.dropdown .dropdown-menu a.disabled{cursor:not-allowed;opacity:.5}.dropdown .dropdown-menu a.checked:before{position:absolute;left:calc(.5rem - .1em);content:"✓";font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue;font-weight:600}.dropdown .dropdown-menu hr{width:100%;border-top:1px solid #ddd;margin:.25rem 0}.dropdown.dropdown-top .dropdown-menu{top:auto;bottom:calc(100% + 1px)}.dropdown.dropdown-left .dropdown-menu{left:auto;right:0}.dropdown.dropdown.active .dropdown-menu{display:block}
 
 /*! Forms */fieldset{border:1px solid #ddd;border-radius:.25rem;padding:1rem 1.5rem;margin-bottom:1rem}fieldset legend{font-weight:700;padding:0 .25rem}label{display:inline-block;margin-bottom:.25rem}label+label{margin-left:1rem}input[type=color],input[type=date],input[type=datetime-local],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{width:100%;font-family:inherit;font-size:1rem;font-weight:inherit;color:#111;border:1px solid #ddd;border-radius:.25rem;-webkit-box-shadow:inset 0 1px 0 rgba(0,0,0,.05);box-shadow:inset 0 1px 0 rgba(0,0,0,.05);background-color:#fff;height:2rem;line-height:2rem;vertical-align:middle;display:block;padding-left:.5rem;padding-right:.5rem;margin:0;-webkit-transition:border-color .1s,background-color .1s,color .1s;transition:border-color .1s,background-color .1s,color .1s;white-space:nowrap;-moz-appearance:none;-webkit-appearance:none}input[type=color]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=email]:focus,input[type=month]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=time]:focus,input[type=url]:focus,input[type=week]:focus,select:focus,textarea:focus{outline:none;border-color:#0074d9}select{position:relative;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='41' height='26' viewBox='0 0 41 26' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 5.382l19.983 19.983L40.14 5.208 34.932 0 19.869 15.062 4.84.032z' fill-rule='evenodd'/%3E%3C/svg%3E");background-position:right .4rem center;background-repeat:no-repeat;background-size:.75rem;padding-top:0;padding-bottom:0;padding-right:1.5rem}textarea{height:auto;resize:vertical;line-height:1.5;white-space:normal}input[type=color]{padding:.5rem}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:.25rem}input[type=checkbox],input[type=radio]{padding:0}input[disabled]{opacity:.5;cursor:not-allowed}input[readonly]{background-color:#f2f2f2}input[type=color].input-small,input[type=date].input-small,input[type=datetime-local].input-small,input[type=email].input-small,input[type=month].input-small,input[type=number].input-small,input[type=password].input-small,input[type=search].input-small,input[type=tel].input-small,input[type=text].input-small,input[type=time].input-small,input[type=url].input-small,input[type=week].input-small,select.input-small{font-size:.8rem;height:1.25rem;line-height:1.25rem}textarea.input-small{font-size:.8rem}input[type=color].input-big,input[type=date].input-big,input[type=datetime-local].input-big,input[type=email].input-big,input[type=month].input-big,input[type=number].input-big,input[type=password].input-big,input[type=search].input-big,input[type=tel].input-big,input[type=text].input-big,input[type=time].input-big,input[type=url].input-big,input[type=week].input-big,select.input-big{font-size:1.2rem;height:2.75rem;line-height:2.75rem}textarea.input-big{font-size:1.2rem}input[type=range]{-webkit-appearance:none;width:100%;margin:1rem 0}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{width:100%;height:.5rem;cursor:pointer;background:#f2f2f2;border-radius:.25rem;border:none;-webkit-box-shadow:inset 0 1px 0 rgba(0,0,0,.05);box-shadow:inset 0 1px 0 rgba(0,0,0,.05)}input[type=range]::-webkit-slider-thumb{border:none;width:1.5rem;height:1.5rem;border-radius:50%;background:#0074d9;cursor:pointer;-webkit-appearance:none;margin-top:-.5rem}input[type=range]:focus::-webkit-slider-runnable-track{background:#f2f2f2}input[type=range]::-moz-range-track{width:100%;height:.5rem;cursor:pointer;background:#f2f2f2;border-radius:.25rem;border:none;box-shadow:inset 0 1px 0 rgba(0,0,0,.05)}input[type=range]::-moz-range-thumb{border:none;height:1.5rem;width:1.5rem;border-radius:50%;background:#0074d9;cursor:pointer}input[type=range]::-ms-track{width:100%;height:.5rem;cursor:pointer;background:transparent;border-color:transparent;color:transparent}input[type=range]::-ms-fill-lower{background:#2f6ea5;border:none;border-radius:.25rem}input[type=range]::-ms-fill-upper{background:#f2f2f2;border:none;border-radius:.25rem}input[type=range]::-ms-thumb{border:none;height:.5rem;width:.5rem;border-radius:50%;background:#0074d9;cursor:pointer}input[type=range]:focus::-ms-fill-lower,input[type=range]:focus::-ms-fill-upper{background:#f2f2f2}progress{width:100%;vertical-align:middle}.input-group,.input-single{margin-bottom:1rem}.input-group{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex}.input-group>.button,.input-group>.dropdown .button,.input-group>.dropdown button,.input-group>button,.input-group>input{border-radius:0}.input-group>.button:first-child,.input-group>.dropdown:first-child .button,.input-group>.dropdown:first-child button,.input-group>button:first-child,.input-group>input:first-child{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.input-group>.button:last-child,.input-group>.dropdown:last-child .button,.input-group>.dropdown:last-child button,.input-group>button:last-child,.input-group>input:last-child{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.input-group>input+input{border-left-width:0}.input-group>input+input:focus{border-left-width:1px;margin-left:-1px}.input-group :focus{-webkit-transform:translateZ(0);transform:translateZ(0)}.input-addon{font-size:1rem;color:#aaa;height:2rem;line-height:2rem;border-top:1px solid #ddd;border-bottom:1px solid #ddd;background:#f8f8f8;padding:0 .5rem;white-space:nowrap}.input-addon-small{font-size:.8rem;height:1.25rem;line-height:1.25rem}.input-addon-big{font-size:1.2rem;height:2.75rem;line-height:2.75rem}.input-addon:first-child{border-left:1px solid #ddd;border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.input-addon:last-child{border-right:1px solid #ddd;border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.input-invalid label{color:#ff4136!important}.input-invalid,.input-invalid input,.input-invalid select{color:#ff4136!important;border-color:#ff4136!important}.input-valid label{color:#2ecc40!important}.input-valid,.input-valid input,.input-valid select{color:#2ecc40!important;border-color:#2ecc40!important}
 
diff --git a/source/css/dropdowns.css b/source/css/dropdowns.css
index b8eb6e8f..5a616570 100644
--- a/source/css/dropdowns.css
+++ b/source/css/dropdowns.css
@@ -3,8 +3,6 @@
   --dropdown-min-width: 10rem;
   --dropdown-max-width: 25rem;
   --dropdown-max-height: none;
-  --dropdown-offset-x: 0;
-  --dropdown-offset-y: 1px;
   --dropdown-border-color: var(--component-border-color);
   --dropdown-border-radius: var(--component-border-radius);
   --dropdown-border-width: var(--component-border-width);
@@ -13,95 +11,100 @@
   --dropdown-bg-color: var(--color-white);
   --dropdown-bg-color-hover: var(--state-primary);
   --dropdown-box-shadow: 0 1px 0 rgba(0, 0, 0, .05);
-  --dropdown-divider-border-color: var(--component-border-color);
-  --dropdown-divider-border-width: var(--component-border-width);
+  --dropdown-divider-color: var(--component-border-color);
+  --dropdown-divider-width: var(--component-border-width);
   --dropdown-padding-x: 1rem;
   --dropdown-padding-y: .25rem;
+  --dropdown-offset-x: 0;
+  --dropdown-offset-y: 1px;
   --dropdown-z-index: 100;
 }
 
 .dropdown {
   position: relative;
   display: inline-block;
-}
 
-.dropdown-trigger::after {
-  content: '▼';
-  font-family: var(--font-system);
-  font-size: .6em;
-  vertical-align: middle;
-  margin-left: .5em;
-  display: inline-block;
-  transform: scaleY(.75);
-  margin-top: -.2em;
-}
+  /* Trigger */
+  & .dropdown-trigger::after {
+    content: '▼';
+    font-family: var(--font-system);
+    font-size: .6em;
+    vertical-align: middle;
+    margin-left: .5em;
+    display: inline-block;
+    transform: scaleY(.75);
+    margin-top: -.2em;
+  }
 
-.dropdown-top .dropdown-trigger::after {
-  transform: scaleY(.75) rotate(180deg);
-}
+  &.dropdown-top .dropdown-trigger::after {
+    transform: scaleY(.75) rotate(180deg);
+  }
 
-.dropdown-menu {
-  position: absolute;
-  top: calc(100% + var(--dropdown-offset-y));
-  left: var(--dropdown-offset-x);
-  z-index: var(--dropdown-z-index);
-  min-width: var(--dropdown-min-width);
-  max-width: var(--dropdown-max-width);
-  max-height: var(--dropdown-max-height);
-  background-color: var(--dropdown-bg-color);
-  border: solid var(--dropdown-border-width) var(--dropdown-border-color);
-  border-radius: var(--dropdown-border-radius);
-  box-shadow: var(--dropdown-box-shadow);
-  display: none;
-  padding: var(--dropdown-padding-y) 0;
-  overflow-y: auto;
-}
+  /* Menu */
+  & .dropdown-menu {
+    position: absolute;
+    top: calc(100% + var(--dropdown-offset-y));
+    left: var(--dropdown-offset-x);
+    z-index: var(--dropdown-z-index);
+    min-width: var(--dropdown-min-width);
+    max-width: var(--dropdown-max-width);
+    max-height: var(--dropdown-max-height);
+    background-color: var(--dropdown-bg-color);
+    border: solid var(--dropdown-border-width) var(--dropdown-border-color);
+    border-radius: var(--dropdown-border-radius);
+    box-shadow: var(--dropdown-box-shadow);
+    display: none;
+    padding: var(--dropdown-padding-y) 0;
+    overflow-y: auto;
+    transform: translateZ(0);
 
-.dropdown-top .dropdown-menu {
-  top: auto;
-  bottom: calc(100% + var(--dropdown-offset-y));
-}
+    & a {
+      position: relative;
+      color: var(--dropdown-color);
+      text-decoration: none;
+      padding: var(--dropdown-padding-y) calc(var(--dropdown-padding-x) + .5em);
+      display: block;
+      white-space: nowrap;
+      overflow-x: hidden;
+      text-overflow: ellipsis;
 
-.dropdown-left .dropdown-menu {
-  left: auto;
-  right: var(--dropdown-offset-x);
-}
+      &:hover:not(.disabled) {
+        color: var(--dropdown-color-hover);
+        background-color: var(--dropdown-bg-color-hover);
+      }
 
-.dropdown.active .dropdown-menu {
-  display: block;
-}
+      &.disabled {
+        cursor: not-allowed;
+        opacity: .5;
+      }
 
-.dropdown-menu a {
-  position: relative;
-  color: var(--dropdown-color);
-  text-decoration: none;
-  padding: var(--dropdown-padding-y) calc(var(--dropdown-padding-x) + .5em);
-  display: block;
-  white-space: nowrap;
-  overflow-x: hidden;
-  text-overflow: ellipsis;
-}
+      &.checked::before {
+        position: absolute;
+        left: calc(var(--dropdown-padding-x) / 2 - .1em);
+        content: '✓';
+        font-family: var(--font-system);
+        font-weight: 600;
+      }
+    }
 
-.dropdown-menu a:hover:not(.disabled) {
-  color: var(--dropdown-color-hover);
-  background-color: var(--dropdown-bg-color-hover);
-}
+    & hr {
+      width: 100%;
+      border-top: solid var(--dropdown-divider-width) var(--dropdown-divider-color);
+      margin: var(--dropdown-padding-y) 0;
+    }
+  }
 
-.dropdown-menu a.disabled {
-  cursor: not-allowed;
-  opacity: .5;
-}
+  &.dropdown-top .dropdown-menu {
+    top: auto;
+    bottom: calc(100% + var(--dropdown-offset-y));
+  }
 
-.dropdown-menu a.checked::before {
-  position: absolute;
-  left: calc(var(--dropdown-padding-x) / 2 - .1em);
-  content: '✓';
-  font-family: var(--font-system);
-  font-weight: 600;
-}
+  &.dropdown-left .dropdown-menu {
+    left: auto;
+    right: var(--dropdown-offset-x);
+  }
 
-.dropdown-menu hr {
-  width: 100%;
-  border-top: solid var(--dropdown-divider-border-width) var(--dropdown-divider-border-color);
-  margin: var(--dropdown-padding-y) 0;
+  &.dropdown.active .dropdown-menu {
+    display: block;
+  }
 }