:root {
    color-scheme: light;
    font: 100%/1.6 system-ui, sans-serif;
    color: #18222b;
    background: #f8fafb;
}

body { max-width: 66rem; margin: auto; padding: 0 1rem 3rem; }
a { color: #195777; }
.site-header, .actions, nav { display: flex; flex-wrap: wrap; gap: 1rem; }
.site-header { justify-content: space-between; padding: 1rem 0; border-bottom: 1px solid #ccd7dd; }
.site-header > a { font-weight: 700; }
main { padding-top: 1rem; }
h1, h2 { line-height: 1.2; }
form { max-width: 42rem; }
label { display: block; margin-top: 0.75rem; font-weight: 600; }
input, textarea, select, button {
    border-radius: 0;
    font: inherit;
    resize: none;
}
form :is(input, textarea, select, button):focus {
    outline: none;
    background: color-mix(in srgb, var(--form-control-background, #fff) 99.75%, black);
}

input, textarea, select { box-sizing: border-box; width: 100%; padding: 0.4rem; }
input[type="hidden"] { display: none; }
textarea { min-height: 8rem; }
button, .button { display: inline-block; margin-top: 0.75rem; padding: 0.35rem 0.8rem; }
button { cursor: pointer; }
.rows { padding: 0; list-style: none; }
.rows li { padding: 0.55rem 0; border-bottom: 1px solid #ccd7dd; }
.copy { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 72ch; }
.notice { padding: 0.65rem; border-left: 0.25rem solid #195777; background: #eaf3f7; }
.grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
figure { margin: 0; }
img { max-width: 100%; height: auto; }

.markdown-editor {
    min-height: 16rem;
    font-family: ui-monospace, monospace;
}

.prose { max-width: 72ch; overflow-wrap: anywhere; }
.prose pre { white-space: pre-wrap; padding: 0.75rem; background: #eaf3f7; }
.prose blockquote { margin-left: 0; padding-left: 1rem; border-left: 3px solid #ccd7dd; }

input.checkbox { width: auto; }

.site-footer {
    margin-top: 3rem;
    padding-top: 1rem;
    border-top: 1px solid #ccd7dd;
    color: #40535f;
    overflow-wrap: anywhere;
}

.public-site,
.public-site *,
.public-site *::before,
.public-site *::after {
    box-sizing: border-box;
}

.public-theme {
    background: var(--site-background, #f8fafb);
    color: var(--site-text, #18222b);
}

body.public-site {
    --form-control-background: var(--site-background, #f8fafb);
    max-width: none;
    margin: 1%;
    padding: 0;
    font-family: Lato, system-ui, sans-serif;
}

.public-site h1,
.public-site h2,
.public-site h3,
.public-site h4,
.public-site h5,
.public-site h6,
.public-site .site-header > a {
    font-family: Montserrat, system-ui, sans-serif;
    font-weight: 700;
}

.public-site a { color: var(--site-link, #195777); }
.public-site main a { color: var(--site-text, #18222b); }
.public-site .site-header > a { text-decoration: none; }

.public-site .page-card {
    --window-inset: 12px;
    width: 100%;
    max-width: 575px;
    margin-inline: auto;
    border: 1px solid var(--site-line, #ccd7dd);
    overflow-wrap: anywhere;
}

.public-site .site-header,
.public-site .site-footer {
    display: flex;
    align-items: center;
    height: 32px;
    padding: 0;
    line-height: 15px;
}

.public-site .site-header > a,
.public-site .site-footer small {
    min-width: 0;
    padding-inline: var(--window-inset);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.public-site .site-header {
    height: 42px;
    flex-wrap: nowrap;
    border-bottom: 1px solid var(--site-line, #ccd7dd);
}

.public-site .site-navigation,
.public-site .site-navigation-foldout {
    padding: 0;
    border-bottom: 1px solid var(--site-line, #ccd7dd);
}

.public-site .site-header > a { font-size: 0.9375rem; }

.public-site .window-close {
    flex: none;
    margin-inline-start: auto;
    padding-inline: var(--window-inset);
    color: var(--site-muted, #40535f);
    font-size: 18px;
    line-height: inherit;
    user-select: none;
}

.public-site main {
    --heading-size: clamp(1.375rem, 5vw, 1.5rem);
    min-height: 8rem;
    padding: 18px var(--window-inset);
    border-top: 0;
    font-size: 1rem;
    line-height: 1.25;
    text-align: left;
}

.public-site main :is(label, input, textarea, select, option, optgroup, button) {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.public-site main input::file-selector-button { font: inherit; }

.public-site main :is(h1, h2, h3, h4, h5, h6) {
    margin: 1.2em 0 0.45em;
    font-weight: 400;
    line-height: 1.25;
    text-wrap: balance;
}

.public-site main :is(p, li, blockquote) {
    text-wrap: pretty;
    orphans: 2;
    widows: 2;
}

.public-site main h1 {
    margin: 0 0 0.75rem;
    font-size: var(--heading-size);
}
.public-site main h2 { font-size: calc(var(--heading-size) * 0.9); }
.public-site main h3 { font-size: calc(var(--heading-size) * 0.81); }
.public-site main h4 { font-size: calc(var(--heading-size) * 0.729); }
.public-site main h5 { font-size: calc(var(--heading-size) * 0.6561); }
.public-site main h6 { font-size: calc(var(--heading-size) * 0.59049); }

.public-site .prose > :is(p, ul, ol, blockquote, pre, table) {
    margin-block: 0 0.85rem;
}

.public-site .grid h2,
.public-site .prose > :first-child { margin-top: 0; }

.public-site .prose > :last-child { margin-bottom: 0; }

.public-site .site-footer {
    margin: 0;
    border-top: 1px solid var(--site-line, #ccd7dd);
    color: var(--site-muted, #40535f);
}

.public-site .site-footer small { font-size: 0.8125rem; }

.public-site .grid > * { min-width: 0; }
.public-site .grid img { display: block; }
.public-site .grid figcaption { margin-top: 0.35rem; }

.public-site .notice,
.public-site .prose pre {
    background: transparent;
}

.public-site .prose pre { border: 1px solid var(--site-line, #ccd7dd); }

.public-site :is(input, textarea, button) {
    border: 1px solid var(--site-line, #ccd7dd);
    color: inherit;
    background: transparent;
}

.public-site form :is(input, textarea, select, button):focus-visible {
    border-color: var(--site-link, #195777);
}

.public-site .notice { border-color: var(--site-link, #195777); }

.public-site .rows li,
.public-site .prose blockquote { border-color: var(--site-line, #ccd7dd); }

.site-navigation { display: block; }

.site-menu-items {
    margin: 0;
    padding: 0;
    font-size: 0;
    list-style: none;
}

.site-menu-items li {
    display: inline-block;
    max-width: 100%;
    margin: 0;
    vertical-align: top;
}

.site-navigation a,
.site-navigation-foldout a,
.site-navigation-foldout summary {
    display: block;
    margin: 0;
    padding: 5px var(--window-inset);
    color: var(--site-text, #18222b);
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    background: transparent;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.site-navigation .site-menu-items li + li {
    border-inline-start: 1px solid var(--site-line, #ccd7dd);
}

.site-navigation .site-menu-items li:last-child {
    border-inline-end: 1px solid var(--site-line, #ccd7dd);
}

.site-navigation-foldout .site-menu-items li + li {
    border-block-start: 1px solid var(--site-line, #ccd7dd);
}

.site-navigation-foldout[open] summary {
    border-block-end: 1px solid var(--site-line, #ccd7dd);
}

.site-navigation a:hover,
.site-navigation a:focus-visible,
.site-navigation-foldout a:hover,
.site-navigation-foldout a:focus-visible,
.site-navigation-foldout summary:hover,
.site-navigation-foldout summary:focus-visible,
.site-navigation a[aria-current="page"],
.site-navigation-foldout a[aria-current="page"] {
    background: color-mix(in srgb, var(--site-background, #f8fafb) 95%, black);
}

.site-navigation a[aria-current="page"],
.site-navigation-foldout a[aria-current="page"] {
    color: color-mix(in srgb, var(--site-text, #18222b) 75%, var(--site-background, #f8fafb));
}

.site-navigation-foldout { display: none; }

.site-navigation-foldout summary {
    list-style: none;
    width: 100%;
    cursor: pointer;
}

.site-navigation-foldout summary::-webkit-details-marker { display: none; }

.site-navigation-foldout nav {
    display: block;
    width: 100%;
}

@media (max-width: 575px) {
    .site-navigation { display: none; }
    .site-navigation-foldout { display: block; }
    .site-menu-items li { display: block; }
    .site-menu-items a { width: 100%; }
    .site-navigation-foldout a,
    .site-navigation-foldout summary { padding-block: 7px; }
}

.prose table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: separate;
    border-spacing: 0;
}

.prose :is(th, td) {
    padding: 0.3rem 0.55rem;
    border: 1px solid var(--site-line, #ccd7dd);
    text-align: left;
}

.public-site a.content-item-title {
    color: inherit;
    text-decoration: none;
}

.public-site a.content-item-title:hover,
.public-site a.content-item-title:focus-visible { text-decoration: underline; }

.public-site .content-list-title {
    margin: 0;
    font: inherit;
}

.public-site .content-timestamp {
    color: var(--site-muted, #40535f);
    font-size: 0.8125rem;
}

.public-site .content-date { margin: 0 0 0.25rem; }

@media print {
    .public-site .site-navigation,
    .public-site .site-navigation-foldout { display: none; }
}

.public-theme.theme-mode-dark { color-scheme: dark; }
