/* Public pages retain the site's palette and fonts; admin styles are independent. */
body.site-page {
    display: flex;
    flex-direction: column;
    max-width: 70em;
    margin-inline: auto;
    line-height: 1.6;
}
.site-page *, .site-page *::before, .site-page *::after { box-sizing: border-box; }
.site-page [hidden] { display: none !important; }
.site-page :focus-visible { outline: 3px solid var(--link-color); outline-offset: 3px; }
.site-page .skip-to-content {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}
.site-page .skip-to-content:focus {
    position: fixed;
    inset-block-start: .5rem;
    inset-inline-start: .5rem;
    z-index: 1000;
    width: auto;
    height: auto;
    max-width: calc(100% - 1rem);
    min-height: 2.75rem;
    padding: .5rem .75rem;
    clip-path: none;
    white-space: normal;
    color: var(--text-main-color);
    background: var(--main-color);
}
.site-page .page-contents { margin-block: 0 1.5rem; padding: 1rem; border-radius: .4rem; }
.site-page .page-contents h2 { margin: 0 0 .5rem; font-size: 1rem; }
.site-page .page-contents ul { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin: 0; padding: 0; list-style: none; }
.site-page .page-contents a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .25rem .5rem; }
.site-page header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1rem;
    padding: 1rem;
    text-align: start;
    min-width: 0;
}
.site-page header p { min-width: 0; margin: 0; font-size: 1.65rem; line-height: 1.3; overflow-wrap: anywhere; }
.site-page header span#lang, .site-page header jv-theme-switcher { position: static; inset: auto; margin: 0; font-size: 1rem; }
.site-page header jv-theme-switcher { margin-inline-start: auto; }
.site-page #site-menu-toggle { margin-inline-start: auto; }
.site-page .sidebar { min-width: 0; padding: .75rem 1rem; }
.site-page .sidebar nav.main-menu { width: auto; max-width: 100%; margin: 0; padding: 1rem; border-radius: .4rem; overflow-wrap: anywhere; }
.site-page .main-menu h2 { margin: 1.25rem 0 .35rem; font-size: 1rem; line-height: 1.4; }
.site-page .main-menu .menu-group:first-child h2 { margin-block-start: 0; }
.site-page .main-menu ul { margin: 0; padding: 0; list-style: none; }
.site-page .main-menu li { min-width: 0; padding: 0; }
.site-page .main-menu a {
    display: block;
    min-height: 2.75rem;
    padding: .45rem .65rem;
    border-inline-start: .25rem solid transparent;
    border-radius: .2rem;
    line-height: 1.5;
    text-decoration: none;
}
.site-page .main-menu a:hover, .site-page .main-menu a[aria-current] { background: var(--main-color); }
.site-page .main-menu a[aria-current] { border-inline-start-color: var(--link-color); font-weight: bold; }
.site-page main { min-width: 0; margin: 0; padding: 1rem; overflow-wrap: anywhere; }
.site-page main h1, .site-page main h2, .site-page main h3 { line-height: 1.3; overflow-wrap: anywhere; }
.site-page main h1 { margin: 0 0 1.25rem; font-size: 1.75rem; }
.site-page main h2 { margin-block: 1.5rem .75rem; }
.site-page main h3 { margin-block: 1.25rem .5rem; }
.site-page .reading-prose { display: flow-root; max-inline-size: 70ch; margin-inline: auto; line-height: 1.6; }
.site-page .reading-prose p { margin-block: .75em; padding: 0; text-align: start; }
.site-page .reading-prose :is(ul, ol) { margin-block: .75em; padding-inline-start: 1.5em; }
.site-page .reading-prose li { margin-block: .35em; }
.site-page .reading-prose li > :is(p, ul, ol) { margin-block: .35em; }
.site-page .reading-prose blockquote { margin: 1em 0; padding: .5em 1em; }
.site-page .reading-prose blockquote > :first-child, .site-page .reading-prose > :first-child { margin-block-start: 0; }
.site-page .reading-prose blockquote > :last-child, .site-page .reading-prose > :last-child { margin-block-end: 0; }
.site-page .reading-prose table { display: block; max-width: 100%; overflow-x: auto; }
.site-page button, .site-page input, .site-page select, .site-page textarea { max-width: 100%; font: inherit; }
.site-page button:not(.video-js button), .site-page input[type="submit"], .site-page select { min-height: 2.75rem; padding: .4rem .65rem; white-space: normal; }
.site-page input:is([type="text"], [type="search"], [type="date"]), .site-page textarea { min-width: 0; padding: .4rem .65rem; }
.site-page filter-category, .site-page filter-word { position: static; gap: .5rem; line-height: 1.5; }
.site-page filter-category label { flex: 0 1 auto; min-width: 0; margin: 0; padding: .4rem .5rem; white-space: normal; }
.site-page filter-word input { min-width: 0; margin: 0; }
.site-page nav.tabs, .site-page nav.subnav { gap: .5rem; line-height: 1.5; }
.site-page nav.tabs .tab, .site-page nav.subnav a { min-width: 0; min-height: 2.75rem; padding: .45rem .65rem; }
.site-page .tab-label, .site-page .murli label { white-space: normal; overflow-wrap: anywhere; }
.site-page .murli-date-nav .row { gap: .5rem; flex-wrap: wrap; }
.site-page .murli-date-nav a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .4rem .65rem; white-space: normal; }
.site-page jv-bi-text { display: block; min-width: 0; max-width: 100%; }
.site-page jv-bi-text[format*="two-cols"] { overflow-x: auto; }
.site-page jv-bi-text[format*="two-cols"] jv-bi-sentences { min-width: 28rem; }
.site-page jv-bi-text[format*="two-cols"] jv-sentences, .site-page jv-bi-text[format*="two-cols"] jv-bi-sentences > p { min-width: 0; }
.site-page jv-bi-text[format="interlinear"] jv-sentences, .site-page jv-bi-text[format="interlinear"] jv-sentence { display: block; min-width: 0; max-width: 100%; }
.site-page img:not(.comic-pan-area img), .site-page video, .site-page audio { max-width: 100%; }
@media screen and (min-width: 53.125em) {
    body.site-page {
        display: grid;
        grid-template-columns: 15rem minmax(0, 1fr);
        grid-template-rows: auto minmax(0, 1fr);
        grid-template-areas: "header header" "sidebar content";
        gap: .5rem;
    }
    .site-page main { padding: 1.5rem; }
    .site-page .sidebar { padding: 0 .5rem .75rem; }
}
@media (prefers-reduced-motion: reduce) {
    .site-page *, .site-page *::before, .site-page *::after { scroll-behavior: auto; transition: none; animation: none; }
}
.site-page .years { grid-template-columns: repeat(auto-fit, minmax(min(100%, 6rem), 1fr)); }
.site-page .months { grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); }
.site-page .daily-cal-weekdays { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.site-page .date-jump__label { white-space: normal; }
.site-page audio { height: auto; min-height: 3.5rem; }
.site-page .search__main, .site-page .search__picker, .site-page .search__group { min-width: 0; max-width: 100%; }
.site-page .search__group { flex-wrap: wrap; }
.site-page nav.tabs, .site-page nav.subnav { align-items: center; }
.site-page nav.subnav .subnav-link { display: inline-flex; align-items: center; min-height: 2.75rem; min-width: 0; max-width: 100%; padding: .45rem .65rem; }
/* Keep the lesson aligned with the definitions that follow it. */
html.lesson .site-page .reading-prose { margin-inline: 0; }
/* Keep controls and subtle separators in the same palette as the content. */
.site-page :is(input[type="text"], input[type="search"], input[type="date"], select, textarea) { border: 1px solid var(--input-border-color); border-radius: .25rem; }
.site-page button:not(.video-js button), .site-page input[type="submit"] { border: 1px solid var(--border-color); }
.site-page button:not(.video-js button, jv-theme-switcher button, .lemma-badge__close):not(:disabled):hover, .site-page input[type="submit"]:not(:disabled):hover { background-color: var(--btn-hover-color); }
.site-page .lemma-badge__close { color: inherit; }
.site-page jv-bi-text[format*="two-cols"] :is(jv-sentences, jv-bi-sentences > p) { border-color: var(--border-color); }
