* {
    box-sizing: border-box;
    font-family: monospace;
    background-position: center;
    background-repeat: no-repeat;
}

body,
html {
    height: 100%;
    width: 100%;
    margin: 0;
}

body {
    display: flex;
    flex-direction: column;
    background-size: cover;
    background-position: 50% 50%;
}

.fail {
    background-color: tomato !important;
    font-weight: bold;
}

.active,
.neutral {
    background-color: gold !important;
}

.row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.col {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.col:last-child {
    margin-bottom: auto;
}

.rm-right {
    margin-left: auto;
}

.rm-lpad {
    margin-left: 0.5rem;
}

.rm-rpad {
    margin-right: 0.5rem;
}

/* Icons */
.rm-icon-logout {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-log-out"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg>');
}
.rm-icon-invite {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-user-plus"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7" r="4"></circle><line x1="20" y1="8" x2="20" y2="14"></line><line x1="23" y1="11" x2="17" y2="11"></line></svg>');
}
.rm-icon-filter {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-filter"><polygon points="22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"></polygon></svg>');
}

.rm-icon-edit {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-edit"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>');
}

.rm-icon-save {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="green" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check"><polyline points="20 6 9 17 4 12"></polyline></svg>');
}

.rm-icon-discard {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="tomato" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>');
}

.rm-icon-delete {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="tomato" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="feather feather-trash-2"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>');
}

.rm-icon-clear {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="tomato" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-delete"><path d="M21 4H8l-7 8 7 8h13a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2z"></path><line x1="18" y1="9" x2="12" y2="15"></line><line x1="12" y1="9" x2="18" y2="15"></line></svg>');
}

.rm-icon-copy {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-copy"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>');
}

.banner {
    text-align: center;
}

form {
    max-width: 20rem;
    padding: 0 0.25rem;
    margin: auto;
    display: flex;
    flex-direction: column;
    margin-bottom: 2em;
}

form input {
    font-size: 1.2rem;
    margin: 0.25rem;
    border-radius: 0.25rem;
    outline: none;
    border: 1px solid #999;
}

form input[type="submit"] {
    background-color: palegreen;
}

.shortprompt {
    height: 1rem;
    margin: 0.25rem;
    border-radius: 0.25rem;
    font-size: 0.7rem;
    text-align: center;
}

.rm-basemap-linz-tiles {
    image-rendering: crisp-edges;
    image-rendering: pixelated;
    filter: saturate(0.4) brightness(120%);
    mix-blend-mode: unset !important;
}

.rockmap-pie-outline {
    fill: #444;
}

.rockmap-pie {
    filter: drop-shadow(0 0 1px #333) drop-shadow(0 0 3px white);
}

.rockmap-pie-count-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
}

.rockmap-pie-count {
    text-align: center;
    margin: auto;
    font-weight: bold;
    font-family: monospace;
    text-shadow:
        0 0 1px white,
        0 0 2px white,
        0 0 3px white;
    color: #444;
}

.rm-cluster-icon {
    background: none;
    border: none;
}