body {
    font-family: system-ui, -apple-system, Roboto, "Segoe UI", sans-serif;
    color: #000000;
    padding: 1em 10%;
}
ul.no-marker {
    list-style-type: none;
    padding-left: 0;
}
.document-row {
    display: flex;
    align-items: center;
    gap: 0.75em;
    margin: 0.5em 0;
    padding: 0.5em;
    border: 1px solid #888;
    border-radius: 4px;
}
.document-row > .document-select {
    flex: 1;
    min-width: 0;
    padding: 0.5em;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    overflow-wrap: anywhere;
}
.document-row.selected {
    background: #164eac;
    border-color: #164eac;
    color: #fff;
}
.document-row button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}
hr {
    margin: 2em 0;
}
.hidden {
    display: none;
}
details > summary {
    cursor: pointer;
    font-size: 1.5em;
}
.tooltip {
    text-decoration: underline;
    cursor: help;
}
.tooltip-content {
    border-radius: 6px;
    display: none;
    position: absolute;
    background: #fff;
    border: 1px solid black;
    max-width: 500px;
    padding: 1em;
    text-align: left;
    font-weight: normal;
    pointer-events: none;
}
.tooltip:hover > .tooltip-content {
    display: block;
}
table {
    margin: 1.0em auto 1.5em 0;
    border-collapse: collapse;
}
th, td {
    padding: 0.5em 1em 0.5em 1em;
    border: 1px solid;
    border-color: black;
}
a, button {
    color: #2A6286;
}
button {
    background: #eee;
    cursor: pointer;
    border: none;
    border-radius: 3px;
    padding: 0.2em 0.5em;
}
button.big-btn {
    font-size: 1.3em;
}
button.linkish {
    background: none;
    text-decoration: underline;
    padding: 0;
}
button:disabled {
    color: #888;
    cursor: not-allowed;
}
.document-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75em;
    margin-top: 1.5em;
}
button.command-button {
    padding: 0.2em 0.5em;
    border: none;
    border-radius: 3px;
    background: #eee;
    color: #f7a41d;
    font-family: inherit;
    font-size: 1.3em;
}
button.command-button:hover {
    background: #e2e2e2;
}
button.command-button:active {
    background: #d6d6d6;
}
button.command-button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}
.badge {
    margin-left: 0.4em;
    padding: 0 0.45em;
    border-radius: 1em;
    background: #164eac;
    color: #fff;
    font-size: 0.6em;
    vertical-align: middle;
}
.options-panel {
    margin-top: 0.75em;
    padding: 0 1em;
    border: 1px solid #888;
    border-radius: 4px;
    max-width: 34em;
}
.options-panel h3 {
    margin: 0.75em 0 0.5em;
    font-size: 1em;
}
.options-panel label {
    display: block;
    margin: 0.6em 0;
}
.options-panel input[type="text"] {
    font: inherit;
    width: 16em;
    max-width: 100%;
}
.options-panel small, .options-hint {
    color: #555;
}
.command-line {
    font-family: "Source Code Pro", monospace;
    background-color: #F5F5F5;
    color: #181;
    margin: 0;
    padding: 1em 1em 0;
    overflow-wrap: anywhere;
}
.command-line::before {
    content: "$ ";
    color: #888;
}
pre.stale {
    opacity: 0.45;
}
pre {
    font-family: "Source Code Pro", monospace;
    font-size: 1em;
    background-color: #F5F5F5;
    padding: 1em;
    margin: 0;
    color: #181;
    overflow-x: auto;
}
:not(pre) > code {
    white-space: break-spaces;
}
code {
    font-family: "Source Code Pro", monospace;
    font-size: 0.9em;
}
code a {
    color: #000000;
}
kbd {
    color: #000;
    background-color: #fafbfc;
    border-color: #d1d5da;
    border-bottom-color: #c6cbd1;
    display: inline-block;
    padding: 0.3em 0.2em;
    font: 1.2em monospace;
    line-height: 0.8em;
    vertical-align: middle;
    border: solid 1px;
    border-radius: 3px;
    box-shadow: inset 0 -1px 0 #c6cbd1;
    cursor: default;
}
@media (prefers-color-scheme: dark) {
    body {
        background-color: #111;
        color: #ddd;
    }
    pre {
        background-color: #222;
    }
    a, button {
        color: #88f;
    }
    button {
        background: #333;
    }
    button:disabled {
        color: #555;
    }
    code a {
        color: #eee;
    }
    th, td {
        border-color: white;
    }
    .tooltip-content {
        background: #060606;
        border-color: white;
    }
}
@media (max-width: 600px) {
    body {
        margin: 0;
        padding: 0 0.75em;
    }
}