unit-number:not([hasseparator]) > number-value + number-unit {
  margin-left: .2em;
}

unit-number[type=lat] > number-value + number-unit,
unit-number[type=lon] > number-value + number-unit {
  margin-left: 0;
}

unit-number > number-unit + number-value {
  margin-left: .2em;
}

unit-number[type=lat] > number-sign,
unit-number[type=lon] > number-sign {
  text-transform: lowercase;
  font-variant: small-caps;
}

/*

Per CC0 <https://creativecommons.org/publicdomain/zero/1.0/>, to the
extent possible under law, the author has waived all copyright and
related or neighboring rights to this work.

*/
popup-menu:not([open]) > menu-main {
  display: none;
}

popup-menu[open] > menu-main:not([hidden]) {
  display: block;
  position: absolute;
}

tab-set > section:not(.active) {
  display: none;
}

sub-window:not([hidden]) {
  display: block;
}

sub-window-minimized:not([hidden]) {
  display: block;
  pointer-events: auto;
}

sub-window-minimized-container:not([hidden]) {
  display: block;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  max-height: 50%;
  overflow: auto;
  pointer-events: none;
}

action-status:not([hidden]) {
  display: block;
  font-size: 90%;
  color: gray;
  background: transparent;
}

action-status > * {
  margin-right: .5em;
}

action-status-message {
  unicode-bidi: embed;
}

action-status[status=ok] action-status-message {
  background-color: transparent;
  color: green;
}

action-status[status=ng] action-status-message {
  background-color: red;
  color: white;
}

action-status progress:not([hidden]) {
  display: block;
  width: 100%;
  margin-top: .5em;
  margin-bottom: .5em;
}

sandboxed-viewer:not([hidden]) {
  display: inline-block;
}

sandboxed-viewer > iframe:not([hidden]) {
  display: block;
}

sandboxed-viewer > iframe {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border: none;
}

image-editor:not([hidden]) {
  display: inline-block;
  position: relative;
}

image-editor > image-layer:not([hidden]) {
  display: inline-block;
}

image-editor > image-layer {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
}

image-editor > image-layer[useplaceholderui].placeholder {
  cursor: pointer;
}

image-editor > image-layer[useplaceholderui].placeholder::before {
  position: absolute;
  display: block;
  content: url(noimage.svg);
  width: 100%;
  height: 100%;
}

image-editor > image-layer[movable] {
  cursor: move;
}

image-editor > image-layer.drop-target {
  --background-box-color: rgb(153, 153, 243);
  background-color: transparent;
  background-image:
    linear-gradient(45deg, var(--background-box-color) 25%, transparent 25%, transparent 75%, var(--background-box-color) 75%, var(--background-box-color)),
    linear-gradient(45deg, var(--background-box-color) 25%, transparent 25%, transparent 75%, var(--background-box-color) 75%, var(--background-box-color));
  background-position: 0px 0px, 30px 30px;
  background-size: 60px 60px;
}

image-editor > image-layer > video.capture {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  background: white;
  color: black;
}

image-editor > image-layer > canvas {
  display: block;
  vertical-align: bottom;
}

qr-code:not([hidden]) {
  display: inline-block;
}

qr-code img {
  vertical-align: bottom;
}

map-area:not([hidden]) {
  display: block;
  width: 100%;
  height: 300px;
}

map-area > iframe.googlemapsembed:not([hidden]) {
  display: block;
  width: 100%;
  height: 100%;
  border: none;
}

map-area map-credit {
  padding: 0 6px;
  background: rgba(245, 245, 245, 0.7);
  color: rgb(68, 68, 68);
  line-height: 14px;
  font-size: 10px;
}

map-area map-credit a {
  color: inherit;
  background: transparent;
  text-decoration: none;
}

template-set {
  display: none ! important;
}

/*

Per CC0 <https://creativecommons.org/publicdomain/zero/1.0/>, to the
extent possible under law, the author has waived all copyright and
related or neighboring rights to this work.

*/