-body {
+:root {
+ color-scheme: light dark;
font-family: sans-serif;
+ background: white;
+ color: black;
+}
+h1 {
+ margin-top: 0em;
}
h3 {
margin-top: 1em;
margin-bottom: 0;
}
-#score {
+#scorecontainer {
font-size: x-large;
margin-top: 0;
}
+#score {
+ float: left;
+}
+#scoresparkcontainer {
+ overflow: hidden;
+}
+#scorespark {
+ margin-left: 0.5em;
+ margin-right: 0.5em;
+}
+#pvcontainer {
+ clear: left;
+ margin-top: 1em;
+}
.window {
position: absolute;
width: 0px;
display: block;
width: 100%;
padding: 0;
+ transform: translate(0,0); /* Make it a containing block. */
}
#hiddenboard {
display: none;
width: auto;
text-align: center;
}
-#whiteclock {
+#whiteinfo {
float: left;
- width: 20%;
text-align: left;
+ min-width: 20%;
}
-#blackclock {
+#blackinfo {
float: right;
- width: 20%;
text-align: right;
+ min-width: 20%;
margin-right: 5px;
}
+#whiteimbalance img, #blackimbalance img {
+ vertical-align: text-top;
+}
+#whiteimbalance {
+ margin-left: 5px;
+}
+#blackimbalance {
+ margin-right: 5px;
+}
+.running-clock {
+ font-weight: bold;
+}
#analysis {
display: block;
min-width: 400px;
#linenav {
display: none;
}
+#lomonosov {
+ display: none;
+}
+
+#games {
+ font-size: smaller;
+ margin-bottom: 0.5em;
+}
+.game {
+ padding: 0.25em 1em 0.25em 1em;
+ margin: 0;
+ background: #eee;
+ border-right: 1px solid #bbb;
+}
+.game:last-of-type {
+ border-right: none;
+}
+
+.pv, #pv, #history { /* Mute move colors a bit. */
+ color: #555;
+}
+
+.imbalance-inverted-piece {
+ display: none;
+ filter: invert(1);
+}
+
+@media (prefers-color-scheme: dark) {
+
+:root {
+ background: black;
+ color: #eee;
+}
+.pv, #pv, #history { /* Mute move colors a bit. */
+ color: #bbb;
+}
+#numviewers {
+ color: #bbb;
+}
+a.move, a.move:link {
+ color: #eee;
+}
+a:link {
+ color: rgb(128,128,238);
+}
+.imbalance-piece {
+ display: none;
+}
+.imbalance-inverted-piece {
+ display: initial;
+}
+
+}