remove spec specific css or inline it

[jnurthen]

[jnurthen]

Rules used in aria

ol{ list-style:decimal; }
ol ol{ list-style:upper-alpha; }
ol ol ol{ list-style:lower-roman; }
ol ol ol ol{ list-style:lower-alpha; }
.role-parent ul,
.role-base ul,
.role-children ul,
.role-related ul,
.role-scope ul,
.role-mustcontain ul,
.role-required-properties ul,
.role-properties ul,
.role-inherited ul,
.role-disallowed ul,
.role-namefrom ul,
.state-value ul, .state-related ul,
.state-applicability ul,
.state-descendants ul,
.property-value ul,
.property-related ul,
.property-applicability ul,
.property-descendants ul,
.quickref-required ul,
.quickref-supported ul {
	margin:0;
	padding:0;
	list-style-type:none;
}
table{
	border:solid 2px #999;
	border-width:1px 0 0 1px;
	margin:0.1em 0 1em;
	padding:0;
	border-spacing:0;
	border-collapse:collapse;
}
th, td{
	border:solid 2px #999;
	border-width:0 1px 1px 0;
	padding:0.15em 0.3em 0.1em;
	vertical-align:top;
	text-align:left;
}
th{
	background-color:#eee;
}
caption{
	text-align:left;
	color:#555;
	font-style:normal;
	margin:1em 0 0.1em;
	padding:0 0 0 0.3em;
}
table.role-features th, table.role-features td, table.state-features th, table.state-features td, table.property-features th, table.property-features td, table.value-descriptions th, table.value-descriptions td {
	min-width:20em;
}
table.role-features tbody th, table.state-features tbody th, table.property-features tbody th, table.value-descriptions tbody th {
    text-align: left !important;
}
th+th, td+td{
	width:auto;
}
html code, html pre, html kbd{ /* more specific selector than the default W3C style sheet */
	/* Most browsers default 'monospace' to Courier, which has an ex-height of about 60% normal size. */
	/* Monaco has a normal ex-height so font sizes appear more consistent with surrounding non-monospaced text. */
	font-family: "Monaco", "Courier New", "Courier", monospace;
	font-family: "Monaco", "Courier New", "Courier"; /* declare as separate rule to account for browser font-size inconsistencies, monospace fallback from previous rule should still work in the [almost non-existant] case that a user system does not have Courier */
	font-size:0.9em;
}
html pre { /* more specific selector than the default W3C style sheet */
	border: solid 1px #999;
	background-color: #fcfcfc;
	margin:1em 0;
	padding:0.5em 0.8em;
	font-size:0.75em; /* text in blocks code blocks looked too big now that font is back to normal size */
	line-height:1.4; /* [sic] unitless multiplier, not EM size */
}
.termref, a.termref:link {
	color:#006400;
	text-decoration:none;
	font-style:italic;
}
a.termref:visited {
	color:inherit;
}
.note {
	color:#444;
	border:solid 1px #ccc;
	margin:1em 0;
	padding:1em 2em;
}
.image {
	text-align: center;
}
.img-caption {
	font-weight: bold;
}
dl.compact dt {
	font-weight:normal;
}
.rfc2119 {
	font-weight: bold;
	text-transform: uppercase;
}
.termlist dt {margin-top: 1em;}

[jnurthen]

Rules used in core-aam (core.css)

ol{ list-style:decimal; }
ol ol{ list-style:upper-alpha; }
ol ol ol{ list-style:lower-roman; }
ol ol ol ol{ list-style:lower-alpha; }
table{
	border:solid 2px #999;
	border-width:1px 0 0 1px;
	margin:0.1em 0 1em;
	padding:0;
	border-spacing:0;
	border-collapse:collapse;
}
th, td{
	border:solid 2px #999;
	border-width:0 1px 1px 0;
	padding:0.15em 0.3em 0.1em;
	vertical-align:top;
	text-align:left;
}
th{
	background-color:#eee;
}
caption{
	text-align:left;
	color:#555;
	font-style:normal;
	margin:1em 0 0.1em;
	padding:0 0 0 0.3em;
}
th+th, td+td{
	width:auto;
}
html code, html pre, html kbd{ /* more specific selector than the default W3C style sheet */
	/* Most browsers default 'monospace' to Courier, which has an ex-height of about 60% normal size. */
	/* Monaco has a normal ex-height so font sizes appear more consistent with surrounding non-monospaced text. */
	font-family: "Monaco", "Courier New", "Courier", monospace;
	font-family: "Monaco", "Courier New", "Courier"; /* declare as separate rule to account for browser font-size inconsistencies, monospace fallback from previous rule should still work in the [almost non-existant] case that a user system does not have Courier */
	font-size:0.9em;
}
html pre { /* more specific selector than the default W3C style sheet */
	border: solid 1px #999;
	background-color: #fcfcfc;
	margin:1em 0;
	padding:0.5em 0.8em;
	font-size:0.75em; /* text in blocks code blocks looked too big now that font is back to normal size */
	line-height:1.4; /* [sic] unitless multiplier, not EM size */
}
.termref, a.termref:link {
	color:#006400;
	text-decoration:none;
	font-style:italic;
}
a.termref:visited {
	color:inherit;
}
.note {
	color:#444;
	border:solid 1px #ccc;
	margin:1em 0;
	padding:1em 2em;
}
.rfc2119 {
	font-weight: bold;
	text-transform: uppercase;
}
.termlist dt {margin-top: 1em;}

mapping-tables.css

caption {
    text-align:left;
    font-size: 120%;
    font-weight:bold;
    margin-bottom: 0.25em;
}
table {
    width:100%;
    border-collapse: collapse;
    border: 1px solid #630;
}
th, td {
    text-align: left;
    vertical-align: top;
    padding: 0.3em;
    border-collapse: collapse;
    border: 1px solid #630;
}
th code, td code {font-size: 123%;}
details, summary {display: block;}
details {border-bottom: 1px solid #ccc; padding: 0.5em;}
summary {padding: 0.25em;background: #fff url(../img/rightArrow.png) no-repeat 0.5em center; padding: 0.25em 0.25em 0.25em 2em;}
summary::-webkit-details-marker {display: none;}
.open summary, details[open] summary {background-color: #f5f5f5; background-image: url(../img/downArrow.png);}
summary .el-context {display: inline;}
summary:hover, summary:focus, details[open] summary:hover, details[open] summary:focus {background-color: #eee;}

core-aam.css

ol{ list-style:decimal; }
ol ol{ list-style:upper-alpha; }
ol ol ol{ list-style:lower-roman; }
ol ol ol ol{ list-style:lower-alpha; }

table{
	border:solid 2px #999;
	border-width:1px 0 0 1px;
	margin:0.1em 0 1em;
	padding:0;
	border-spacing:0;
	border-collapse:collapse;
}
th, td{
	border:solid 2px #999;
	border-width:0 1px 1px 0;
	padding:0.15em 0.3em 0.1em;
	/*min-width:20em;*/
	vertical-align:top;
	text-align:left;
}
th+th, td+td{
	width:auto;
}
th{
	background-color:#eee;
}
caption{
	text-align:left;
	color:#555;
	font-style:normal;
	margin:1em 0 0.1em;
	padding:0 0 0 0.3em;
}
html code, html pre, html kbd{ /* more specific selector than the default W3C style sheet */
	/* Most browsers default 'monospace' to Courier, which has an ex-height of about 60% normal size. */
	/* Monaco has a normal ex-height so font sizes appear more consistent with surrounding non-monospaced text. */
	font-family: "Monaco", "Courier New", "Courier", monospace;
	font-family: "Monaco", "Courier New", "Courier"; /* declare as separate rule to account for browser font-size inconsistencies, monospace fallback from previous rule should still work in the [almost non-existant] case that a user system does not have Courier */
	font-size:0.9em;
}
html pre { /* more specific selector than the default W3C style sheet */
	border: solid 1px #999;
	background-color: #fcfcfc;
	margin:1em 0;
	padding:0.5em 0.8em;
	font-size:0.75em; /* text in blocks code blocks looked too big now that font is back to normal size */
}
.role-reference, .state-reference, .property-reference, .widget-reference, .design-pattern-reference {}
.termref, a.termref:link {
	color:#006400;
	text-decoration:none;
	font-style:italic;
}
a.termref:visited {
	color:inherit;
}
.note {
	color:#444;
	border:solid 1px #ccc;
	margin:1em 0;
	padding:1em 2em;
}
.rfc2119 {
	font-weight: bold;
	text-transform: uppercase;
}
.section {}

[jnurthen]

Rules used in accname

ol{ list-style:decimal; }
ol ol{ list-style:upper-alpha; }
ol ol ol{ list-style:lower-roman; }
ol ol ol ol{ list-style:lower-alpha; }

table{
	border:solid 2px #999;
	border-width:1px 0 0 1px;
	margin:0.1em 0 1em;
	padding:0;
	border-spacing:0;
	border-collapse:collapse;
}
th, td{
	border:solid 2px #999;
	border-width:0 1px 1px 0;
	padding:0.15em 0.3em 0.1em;
	vertical-align:top;
	text-align:left;
}
th{
	background-color:#eee;
}
html code, html pre, html kbd{ /* more specific selector than the default W3C style sheet */
	/* Most browsers default 'monospace' to Courier, which has an ex-height of about 60% normal size. */
	/* Monaco has a normal ex-height so font sizes appear more consistent with surrounding non-monospaced text. */
	font-family: "Monaco", "Courier New", "Courier", monospace;
	font-family: "Monaco", "Courier New", "Courier"; /* declare as separate rule to account for browser font-size inconsistencies, monospace fallback from previous rule should still work in the [almost non-existant] case that a user system does not have Courier */
	font-size:0.9em;
}
html pre { /* more specific selector than the default W3C style sheet */
	border: solid 1px #999;
	background-color: #fcfcfc;
	margin:1em 0;
	padding:0.5em 0.8em;
	font-size:0.75em; /* text in blocks code blocks looked too big now that font is back to normal size */
	line-height:1.4; /* [sic] unitless multiplier, not EM size */
}
.termref, a.termref:link {
	color:#006400;
	text-decoration:none;
	font-style:italic;
}
a.termref:visited {
	color:inherit;
}
.note {
	color:#444;
	border:solid 1px #ccc;
	margin:1em 0;
	padding:1em 2em;
}
.rfc2119 {
	font-weight: bold;
	text-transform: uppercase;
}
.termlist dt {margin-top: 1em;}

[stiiin]

The headings of the tables under the Definition of Roles sections are unreadable under dark mode. This is because the th elements have color: var(--text) (through base.css), which computes to color: #ddd (when dark.css is applied), and background-color: #eee (through this repository's common.css).

Removing the CSS specific to these specifications should solve this.