/* base.css — base styles shared by multiple "user-facing" stylesheets */

@import "variables.css";
@import "patterns.css";

/* 4 The elements of HTML */

/* 4.1 The document element */
/* 4.1.1 The html element */

html {
    font-family: var(--page-font-stack);
    font-size: 125%;
    line-height: 1.25;
    font-size-adjust: 0.528;
    font-size-adjust: from-font;
    text-underline-position: from-font;
}

/* 4.2 Document metadata */
/* 4.2.1 The head element */
/* 4.2.2 The title element */
/* 4.2.3 The base element */
/* 4.2.4 The link element */
/* 4.2.5 The meta element */
/* 4.2.6 The style element */
/* 4.3 Sections */
/* 4.3.1 The body element */
/* 4.3.2 The article element */
/* 4.3.3 The section element */
/* 4.3.4 The nav element */
/* 4.3.5 The aside element */
/* 4.3.6 The h1, h2, h3, h4, h5, and h6 elements */

h1, h2, h3, h4, h5, h6, legend, th {
    font-family: var(--heading-font-stack);
}

/* 4.3.7 The hgroup element */

hgroup {
    margin-block-start: 1rem;
    margin-block-end: 1rem;
}

hgroup > :is(h1, h2, h3, h4, h5, h6) {
    line-height: 1;
}
hgroup > :is(h1, h2, h3, h4, h5, h6, p) {
    margin-block-start: 0;
    margin-block-end: 0;
}
hgroup > p {
    line-height: 1.4;
}

/* 4.3.8 The header element */
/* 4.3.9 The footer element */
/* 4.3.10 The address element */
/* 4.4 Grouping content */

dl, figcaption, footer, h1, h2, h3, h4, h5, h6, ol, p, table, ul {
    margin-block-start: 1rem;
    margin-block-end: 1rem;
}

/* 4.4.1 The p element */
/* 4.4.2 The hr element */
/* 4.4.3 The pre element */

pre, code {
    font-family: var(--code-font-stack);
    white-space: pre-wrap;
}

/* 4.4.4 The blockquote element */

blockquote > p:first-child {
    margin-block-start: 0;
}

blockquote > p:last-child {
    margin-block-end: 0;
}

/* 4.4.5 The ol element */
/* 4.4.6 The ul element */
/* 4.4.7 The menu element */
/* 4.4.8 The li element */

li {
    marker-side: match-parent;
}

/* 4.4.9 The dl element */
/* 4.4.10 The dt element */
/* 4.4.11 The dd element */
/* 4.4.12 The figure element */

figure {
    margin: 1em auto;
}

figcaption {
    text-align: center;
}

blockquote + figcaption:last-child {
    margin-block-start: 0;
    text-align: right;
}

figcaption:first-child + blockquote {
    margin-block-end: 0;
    text-align: left;
}

figure:has(figcaption:only-child) {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    backround-color: var(--muted-fg);
    background-image: url(/images/placeholder.svg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: 90% 90%;
    position: relative;
}

/* 4.4.13 The figcaption element */

figcaption:only-child {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

/* 4.4.14 The main element */
/* 4.4.15 The div element */
/* 4.5 Text-level semantics */
/* 4.5.1 The a element */

#skipnav {
    display: block;
    position: absolute;
    inset-block-start: -2em;
}

#skipnav:focus {
    position: static;
    inset-block-start: auto;
}

/* 4.5.2 The em element */

em:lang(ja), em:lang(ko), em:lang(zh) {
    text-emphasis: open dot;
    font-style: normal;
}

/* 4.5.3 The strong element */

strong:lang(ja), strong:lang(ko), strong:lang(zh) {
    text-emphasis: filled dot;
    font-weight: normal;
}

h1 strong {
    font-variant: small-caps;
}

/* 4.5.4 The small element */
/* 4.5.5 The s element */
/* 4.5.6 The cite element */
/* 4.5.7 The q element */

:lang(fr) {
    quotes: "« " " »" "‹ " " ›";
}

:lang(ga), :lang(tok) {
    quotes: "“" "”" "‘" "’";
}

/* 4.5.8 The dfn element */
/* 4.5.9 The abbr element */
/* 4.5.10 The ruby element */
/* 4.5.11 The rt element */

:lang(zh-Hant) rt:lang(zh-Bopo), :lang(zh-TW) rt:lang(zh-Bopo) {
    -webkit-ruby-position: inter-character;
    ruby-position: inter-character;
}

/* 4.5.12 The rp element */
/* 4.5.13 The data element */
/* 4.5.14 The time element */
/* 4.5.15 The code element */
/* 4.5.16 The var element */
/* 4.5.17 The samp element */
/* 4.5.18 The kbd element */
/* 4.5.19 The sub and sup elements */

sub, sup {
    font-size: 0.75em;
    line-height: 1;
}

/* 4.5.20 The i element */
/* 4.5.21 The b element */
/* 4.5.22 The u element */

:lang(zh) u { /* Chinese proper name mark */
    text-decoration: underline;
}

/* 4.5.23 The mark element */

mark {
    background-color: yellow;
    color: black;
}

/* 4.5.24 The bdi element */
/* 4.5.25 The bdo element */
/* 4.5.26 The span element */
/* 4.5.27 The br element */
/* 4.5.28 The wbr element */
/* 4.6 Links */
/* 4.6.1 Introduction */
/* 4.6.2 Links created by a and area elements */
/* 4.6.3 API for a and area elements */
/* 4.6.4 Following hyperlinks */
/* 4.6.5 Downloading resources */
/* 4.6.5.1 Hyperlink auditing */
/* 4.6.6 Link types */
/* 4.6.6.1 Link type "alternate" */
/* 4.6.6.2 Link type "author" */
/* 4.6.6.3 Link type "bookmark" */
/* 4.6.6.4 Link type "canonical" */
/* 4.6.6.5 Link type "dns-prefetch" */
/* 4.6.6.6 Link type "external" */
/* 4.6.6.7 Link type "help" */
/* 4.6.6.8 Link type "icon" */
/* 4.6.6.9 Link type "license" */
/* 4.6.6.10 Link type "manifest" */
/* 4.6.6.11 Link type "modulepreload" */
/* 4.6.6.12 Link type "nofollow" */
/* 4.6.6.13 Link type "noopener" */
/* 4.6.6.14 Link type "noreferrer" */
/* 4.6.6.15 Link type "opener" */
/* 4.6.6.16 Link type "pingback" */
/* 4.6.6.17 Link type "preconnect" */
/* 4.6.6.18 Link type "prefetch" */
/* 4.6.6.19 Link type "preload" */
/* 4.6.6.20 Link type "prerender" */
/* 4.6.6.21 Link type "search" */
/* 4.6.6.22 Link type "stylesheet" */
/* 4.6.6.23 Link type "tag" */
/* 4.6.6.24 Sequential link types */
/* 4.6.6.24.1 Link type "next" */
/* 4.6.6.24.2 Link type "prev" */
/* 4.6.6.25 Other link types */
/* 4.7 Edits */
/* 4.7.1 The ins element */
/* 4.7.2 The del element */
/* 4.8 Embedded content */
/* 4.8.1 The picture element */
/* 4.8.2 The source element */
/* 4.8.3 The img element */
/* 4.8.5 The iframe element */
/* 4.8.6 The embed element */
/* 4.8.7 The object element */
/* 4.8.8 The param element */
/* 4.8.9 The video element */
/* 4.8.10 The audio element */
/* 4.8.11 The track element */
/* 4.8.12 Media elements */
/* 4.8.13 The map element */
/* 4.8.14 The area element */
/* 4.8.16 MathML */
/* 4.8.17 SVG */
/* 4.9 Tabular data */
/* 4.9.1 The table element */

table {
    table-layout: fixed;
    border-collapse: collapse;
    font-variant-numeric: tabular-nums;
}

/* 4.9.2 The caption element */

caption {
    caption-side: bottom;
    border-block-start: none;
}

caption, td, th {
    padding: 0.25em;
}

/* 4.9.3 The colgroup element */
/* 4.9.4 The col element */
/* 4.9.5 The tbody element */
/* 4.9.6 The thead element */
/* 4.9.7 The tfoot element */
/* 4.9.8 The tr element */
/* 4.9.9 The td element */

td, th {
    vertical-align: top;
    border: 1px solid var(--page-fg);
}

/* 4.9.10 The th element */
/* 4.10 Forms */
/* 4.10.3 The form element */
/* 4.10.4 The label element */
/* 4.10.5 The input element */
/* 4.10.5.1 States of the type attribute */
/* 4.10.5.1.1 Hidden state (type=hidden) */
/* 4.10.5.1.2 Text (type=text) state and Search state (type=search) */
/* 4.10.5.1.3 Telephone state (type=tel) */
/* 4.10.5.1.4 URL state (type=url) */
/* 4.10.5.1.5 Email state (type=email) */
/* 4.10.5.1.6 Password state (type=password) */
/* 4.10.5.1.7 Date state (type=date) */
/* 4.10.5.1.8 Month state (type=month) */
/* 4.10.5.1.9 Week state (type=week) */
/* 4.10.5.1.10 Time state (type=time) */
/* 4.10.5.1.11 Local Date and Time state (type=datetime-local) */
/* 4.10.5.1.12 Number state (type=number) */
/* 4.10.5.1.13 Range state (type=range) */
/* 4.10.5.1.14 Color state (type=color) */
/* 4.10.5.1.15 Checkbox state (type=checkbox) */
/* 4.10.5.1.16 Radio Button state (type=radio) */
/* 4.10.5.1.17 File Upload state (type=file) */
/* 4.10.5.1.18 Submit Button state (type=submit) */
/* 4.10.5.1.19 Image Button state (type=image) */
/* 4.10.5.1.20 Reset Button state (type=reset) */
/* 4.10.5.1.21 Button state (type=button) */
/* 4.10.6 The button element */
/* 4.10.7 The select element */
/* 4.10.8 The datalist element */
/* 4.10.9 The optgroup element */
/* 4.10.10 The option element */
/* 4.10.11 The textarea element */
/* 4.10.12 The output element */
/* 4.10.13 The progress element */
/* 4.10.14 The meter element */
/* 4.10.15 The fieldset element */
/* 4.10.16 The legend element */
/* 4.11 Interactive elements */
/* 4.11.1 The details element */
/* 4.11.2 The summary element */
/* 4.11.4 The dialog element */
/* 4.12 Scripting */
/* 4.12.1 The script element */
/* 4.12.2 The noscript element */
/* 4.12.3 The template element */
/* 4.12.4 The slot element */
/* 4.12.5 The canvas element */
/* 4.13 Custom elements */
/* 4.14 Common idioms without dedicated elements */
/* 4.14.1 Bread crumb navigation */
/* 4.14.2 Tag clouds */
/* 4.14.3 Conversations */
/* 4.14.4 Footnotes */
/* 4.16 Matching HTML elements using selectors and CSS */
/* 4.16.3 Pseudo-classes */

:lang(ja), :lang(ko) {
    text-emphasis-position: over right;
}

:lang(zh) {
    text-emphasis-position: under right;
}