@font-face { font-family: 'PT Sans Narrow'; src: url('fonts/PT_Sans-Narrow-Web-Regular.ttf') format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'PT Sans Narrow'; src: url('fonts/PT_Sans-Narrow-Web-Bold.ttf') format('truetype'); font-weight: 700; font-display: swap; }
/* Independent mobile presentation, using the desktop site's palette and fonts. */
:root { color-scheme: light; --ink: #333c4d; --blue: #5391ae; --teal: #d9e6e8; --line: #c8d9df; --paper: #fff; }
html { background: #edf1f2; -webkit-text-size-adjust: 100%; scroll-padding-top: 20px; }
body.mobile-site { margin: 0; color: var(--ink); background: #edf1f2; font: 18px/1.65 'PT Sans Narrow', 'Trebuchet MS', Arial, sans-serif; }
.mobile-site *, .mobile-site *::before, .mobile-site *::after { box-sizing: border-box; }
a { color: #285e78; text-underline-offset: 3px; overflow-wrap: anywhere; }
a:hover { color: #337fa7; }
:focus-visible { outline: 3px solid #337fa7; outline-offset: 3px; }
.masthead { background: white; border-top: 5px solid var(--blue); }
.masthead-inner { max-width: 820px; margin: auto; padding: 22px clamp(16px, 4vw, 30px); }
.brand { display: block; width: min(100%, 480px); }
.brand img { display: block; width: 100%; height: auto; }
.utility-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; background: var(--teal); padding: 8px max(16px, calc((100% - 760px) / 2)); border-block: 1px solid var(--line); font-size: 14px; }
#selectlanguage form { margin: 0; }
#selectlanguage select { min-height: 40px; padding: 6px 28px 6px 8px; border: 1px solid #afc7d0; background: #f7fafb; font-size: 14px; }
.version-switch a { display: inline-flex; align-items: center; min-height: 40px; }
.mobile-shell { width: min(100%, 820px); margin-inline: auto; padding: 18px clamp(12px, 3vw, 30px) 0; }
.browse { margin-bottom: 18px; }
.browse-panel { border: 1px solid #b9cfd8; background: white; }
.browse-panel > summary { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 12px 16px; background: var(--blue); color: white; font: 18px/1.4 'Ubuntu Condensed', Arial, sans-serif; cursor: pointer; list-style: none; }
.browse-panel > summary::-webkit-details-marker { display: none; }
.menu-chevron { margin-left: auto; }
.browse-panel[open] .menu-chevron { transform: rotate(180deg); }
.browse-content { padding: 16px; }
#search form { display: flex; gap: 8px; align-items: end; margin: 0 0 20px; }
.search-label { flex: 1; min-width: 0; font-size: 14px; }
.search-label input { display: block; width: 100%; margin-top: 4px; }
.navigation-groups { display: grid; gap: 0 24px; }
.navigation-groups details { min-width: 0; border-top: 1px solid var(--line); }
.navigation-groups summary { padding: 12px 0; cursor: pointer; font-family: 'Ubuntu Condensed', Arial, sans-serif; font-size: 20px; }
.navigation-links { font-size: 0; padding-bottom: 16px; }
.navigation-links a { display: inline-flex; align-items: center; min-height: 44px; margin: 4px 6px 0 0; padding: 6px 12px; background: #edf4f5; border: 1px solid #d9e6e8; font-size: 16px; text-decoration: none !important; }
.recent-changes { padding-top: 14px; border-top: 1px solid var(--line); font-size: 14px; }
#mainContent { min-width: 0; overflow-wrap: anywhere; }
.article-paper { background: var(--paper); border: 1px solid #d2dfe4; box-shadow: 0 3px 12px #333c4d06; }
.article-header { padding: clamp(20px, 5vw, 36px); border-top: 4px solid var(--teal); }
.back-link { font-size: 14px; }
.back-link:empty, .pageVersionsList:empty, .error:empty { display: none; }
h1, h2, h3, h4, h5, h6 { font-family: 'Ubuntu Condensed', 'Trebuchet MS', sans-serif; font-weight: 400; line-height: 1.2; letter-spacing: -.025em; }
h1 { margin: 10px 0 0; font-size: clamp(32px, 7vw, 48px); }
h2 { font-size: clamp(26px, 5vw, 34px); }
h3 { font-size: 24px; }
h4, h5, h6 { font-size: 21px; }
.pageVersionsList { margin-top: 12px; font-size: 14px; }
.article-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; padding: 10px clamp(20px, 5vw, 36px); background: var(--teal); color: #526773; font-size: 13px; }
.article-content { padding: clamp(20px, 5vw, 36px); display: flow-root; }
.article-content p { margin: 0 0 1.2em; }
.article-content ul, .article-content ol { padding-left: 24px; }
.headerspan { display: flow-root; padding: 14px 16px; margin: 30px 0 16px; background: #edf4f5; border: 1px solid var(--line); border-left: 4px solid var(--blue); }
.headerspan h2, .headerspan h3, .headerspan h4 { margin: 0; }
.buttonnext { float: right; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 12px; margin-left: 12px; background: #edf4f5; border: 1px solid var(--line); font-size: 14px; text-decoration: none; }
img, video { max-width: 100%; height: auto; }
iframe, embed, object { max-width: 100%; }
.article-content iframe[src*="youtube"], .article-content iframe[src*="vimeo"] { width: 100%; height: auto; aspect-ratio: 16 / 9; }
#image { max-width: 100%; margin: 24px 0; }
#image #caption { color: #62727c; font-size: 14px; margin: 8px 0; }
#shadow { border: 1px solid #d9e6e8; }
#toc { width: 100%; margin: 0 0 24px; padding: 16px 16px 16px 36px; border-left: 3px solid var(--blue); background: #edf4f5; font-size: 16px; }
#toc ul { list-style: none; padding-left: 16px; }
#toc a { display: inline-block; padding-block: 5px; }
.table-scroll { max-width: 100%; overflow-x: auto; margin-block: 20px; }
table { border-collapse: collapse; }
table.wikitable { border: 1px solid var(--line); }
table.wikitable td, table.wikitable th { padding: 10px; border: 1px solid var(--line); }
table.wikitable th, table.wikitable td.em { background: var(--teal); }
pre { max-width: 100%; overflow-x: auto; padding: 14px; background: #f2f5f6; border: 1px solid var(--line); font-size: 14px; }
blockquote { margin-inline: 0; padding-left: 18px; border-left: 3px solid var(--teal); }
input, select, textarea, button { min-height: 44px; max-width: 100%; padding: 9px 12px; border: 1px solid #afc7d0; border-radius: 3px; background: white; color: var(--ink); line-height: 1.4; font-family: inherit; font-size: 16px; }
input[type=submit], button { background: var(--blue); color: white; border-color: var(--blue); cursor: pointer; }
input[type=checkbox], input[type=radio] { min-height: auto; }
textarea { width: 100%; min-height: 180px; }
.editor-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-block: 16px; }
.error, .pending { color: #a33b3b; }
.tagList, .tagCloud { padding: 12px; margin-top: 20px; background: #edf4f5; font-size: 15px; }
#diff { white-space: pre-wrap; }
#diff ins { color: #286537; } #diff del { color: #a33b3b; }
.article-actions { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 12px clamp(20px, 5vw, 36px); border-top: 1px solid var(--line); background: #f5f8f9; font-size: 14px; }
.article-actions a { display: inline-flex; align-items: center; min-height: 44px; }
.contribute { margin: 0; padding: 18px clamp(20px, 5vw, 36px); font-size: 14px; color: #62727c; }
.mobile-ad { max-width: 100%; overflow-x: auto; text-align: center; }
.mobile-ad:empty { display: none; }
.mobile-comments { margin-top: 24px; padding: clamp(16px, 4vw, 28px); background: white; border: 1px solid #d2dfe4; border-top: 4px solid var(--blue); }
.mobile-comments:empty { display: none; }
.site-footer { padding: 32px 8px; text-align: center; }
.footer-mark { font: 26px 'Ubuntu Condensed', Arial, sans-serif; color: #426e83; }
.footer-mark span { color: #7a919d; }
.copyright, .counters { margin-top: 12px; color: #62727c; font-size: 12px; line-height: 1.7; }
.skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.skip-link:focus { display: block; padding: 12px; background: white; }
@media (min-width: 640px) { .navigation-groups { grid-template-columns: 1fr 1fr; } }
/* TalkBack overrides are scoped to the mobile template. */
.mobile-site .mobile-comments { overflow: visible; }
.mobile-site #tb-wrapper, .mobile-site #tb-panel-wrapper { width: 100%; max-width: 100%; min-width: 0; margin: 0; padding: 0; font-family: inherit; font-size: 16px; line-height: 1.6; overflow-wrap: anywhere; }
.mobile-site #tb-wrapper-link { padding: 12px; line-height: 1.6; border-radius: 8px; }
.mobile-site #tb-form-div { margin: 24px 0 0; min-width: 0; }
.mobile-site #tb_form, .mobile-site #tb-form-edit { margin: 0; padding: 14px; border: 1px solid #d5e0e7; border-radius: 10px; background: #f3f7f9; }
.mobile-site .tb-comment, .mobile-site .tb-reply { margin-top: 24px; padding: 16px 0 0; border-top: 1px solid #dce5eb; min-width: 0; }
.mobile-site .tb-reply { margin-left: 12px; padding-left: 12px; border-left: 2px solid #dce5eb; }
.mobile-site .tb-comment-header, .mobile-site .tb-comment-header-admin { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; height: auto; padding-bottom: 8px; font-size: 14px; }
.mobile-site .tb-author-loc, .mobile-site .tb-author-loc-admin, .mobile-site .tb-date, .mobile-site .tb-date-admin { float: none; min-width: 0; max-width: 100%; }
.mobile-site .tb-date, .mobile-site .tb-date-admin { color: #5b6b76; font-size: 12px; }
.mobile-site .tb-comment-text, .mobile-site .tb-comment-text-admin { overflow: visible; min-width: 0; max-width: 100%; }
.mobile-site .tb-comment-text pre, .mobile-site .tb-comment-text-admin pre { margin: 12px 0; overflow-x: auto; }
.mobile-site .tb-comment-text blockquote, .mobile-site .tb-comment-text-admin blockquote { margin: 12px 0; padding-left: 12px; }
.mobile-site .tb-comment-footer { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 8px; margin: 8px 0 20px; padding: 0; }
.mobile-site .tb-comment-footer a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 12px; }
.mobile-site #tb-wrapper a, .mobile-site #tb-wrapper a:visited { color: #426f86; }
.mobile-site #tb-wrapper strong { font-size: 1em; }
.mobile-site #tb-wrapper .tb-field, .mobile-site #tb-wrapper .tb-subject-field { display: block; width: 100%; margin: 12px 0 4px; }
.mobile-site #tb-wrapper .tb-label { font-size: 14px; }
.mobile-site #tb-form-div textarea { width: 100%; height: auto; min-height: 180px; padding: 12px; margin-top: 12px; font: inherit; resize: vertical; }
.mobile-site #ed_toolbar { display: flex; flex-wrap: wrap; gap: 6px; margin-block: 12px; }
.mobile-site #ed_toolbar .ed-button, .mobile-site #ed_toolbar .ed-button-hover { min-height: 44px; margin: 0; padding: 8px 10px; border: 1px solid #bdccd5; border-radius: 6px; background: white; color: #426f86; font: inherit; font-size: 14px; }
.mobile-site #tb-form-submit-line { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }
.mobile-site #tb-admin-options { flex-basis: 100%; }
.mobile-site #tb-sort, .mobile-site #tb-search-form, .mobile-site #tb-prev-next { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 8px; margin-block: 16px; text-align: left; }
.mobile-site #tb-sort .tb-num-rows { width: 68px; }
.mobile-site .tb-search-field { flex: 1 1 140px; width: auto; min-width: 0; }
.mobile-site #tb-wrapper .tb-submit, .mobile-site #tb-wrapper .tb-submit-hover { min-height: 44px; padding: 10px 14px; font: inherit; border: 1px solid #426f86; border-radius: 8px; background: #426f86; color: white; }
.mobile-site #tb-wrapper .tb-prev, .mobile-site #tb-wrapper .tb-next, .mobile-site #tb-wrapper .tb-first, .mobile-site #tb-wrapper .tb-last, .mobile-site #tb-wrapper .tb-prev-hover, .mobile-site #tb-wrapper .tb-next-hover, .mobile-site #tb-wrapper .tb-first-hover, .mobile-site #tb-wrapper .tb-last-hover { min-height: 44px; padding: 8px 14px; font-size: 14px; }
.mobile-site .recaptcha_widget { width: 100%; max-width: 100%; }
/* Keep the third-party CAPTCHA usable when its fixed widget is wider than the form. */
.mobile-site #tb_form .g-recaptcha { max-width: 100%; overflow-x: auto; }
.mobile-site .tb-credit { margin-top: 16px; font-size: 12px; }

/* Article images use their natural dimensions, constrained by the reading column. */
.mobile-site .article-content #image img { display: inline-block; float: none !important; width: auto !important; max-width: 100%; height: auto !important; }

.mobile-site .browse summary, .mobile-site .navigation-links a { text-transform: none; }

/* Sentence-style capitalization also covers nested contents and article headings. */
.mobile-site #toc a::first-letter,
.mobile-site .article-content h1::first-letter,
.mobile-site .article-content h2::first-letter,
.mobile-site .article-content h3::first-letter,
.mobile-site .article-content h4::first-letter,
.mobile-site .article-content h5::first-letter,
.mobile-site .article-content h6::first-letter { text-transform: uppercase; }
/* Full-screen mobile image inspection. */
.image-viewer-open { overflow: hidden; }
.mobile-site .article-content #image a:has(img) { cursor: zoom-in; }
.image-viewer { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: #15212a; color: white; }
.image-viewer[open] { display: flex; flex-direction: column; }
.image-viewer::backdrop { background: #15212a; }
.viewer-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: max(10px, env(safe-area-inset-top)) 12px 10px; background: #243441; flex-shrink: 0; }
.mobile-site .viewer-toolbar button, .mobile-site .viewer-toolbar a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 8px 12px; border: 1px solid #6c8b9c; border-radius: 4px; color: white; background: #345165; font: 16px/1.3 system-ui, sans-serif; text-decoration: none; }
.viewer-toolbar [data-action=close] { margin-left: auto; }
.viewer-stage { position: relative; flex: 1; min-height: 0; overflow: hidden; touch-action: none; cursor: grab; }
.viewer-stage:active { cursor: grabbing; }
.mobile-site .viewer-stage img { position: absolute; left: 50%; top: 50%; max-width: none; max-height: none; margin: 0; user-select: none; -webkit-user-select: none; transform-origin: center; }
