:root { color-scheme: light; font: 16px/1.45 Arial, Helvetica, sans-serif; color: #202122; background: #fff; }
* { box-sizing: border-box; }
body { margin: 0; }
main { max-width: 1080px; margin: 24px auto; padding: 0 20px 40px; }
main.login { max-width: 470px; margin-top: 48px; }
a, .link { color: #0645ad; text-decoration: underline; }
a:visited { color: #51369a; }
button, input, select { font: inherit; }
button, select { min-height: 42px; }
button { padding: 5px 12px; cursor: pointer; }
button:disabled { cursor: wait; }
input, select { border: 1px solid #72777d; border-radius: 2px; background: white; color: #202122; padding: 7px 9px; }
input[type=url], input[type=password] { display: block; width: 100%; min-height: 44px; }
label { display: block; margin-bottom: 4px; }
:focus-visible { outline: 3px solid #36c; outline-offset: 3px; }
h1 { font: bold 23px/1.3 Georgia, 'Times New Roman', serif; margin: 0; }
h2 { font: bold 19px/1.35 Georgia, 'Times New Roman', serif; margin: 24px 0 10px; }
header { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
nav { display: flex; gap: 18px; align-items: baseline; }
.link { border: 0; padding: 0; background: transparent; min-height: 42px; }
hr { border: 0; border-top: 1px solid #a2a9b1; margin: 12px 0 20px; }
p { margin: 10px 0; }
.hint { font-size: 14px; color: #54595d; }
.controls { display: flex; gap: 14px; align-items: end; flex-wrap: wrap; margin-top: 14px; }
#message:empty, #announcements:empty { margin: 0; }
#message { color: #a21a16; }
.login button { margin-top: 14px; }
table { width: 100%; border-collapse: collapse; table-layout: fixed; }
th { text-align: left; font-weight: normal; border-bottom: 1px solid #72777d; padding: 7px 8px; color: #54595d; }
th:first-child { width: 36%; }
th:last-child { width: 23%; }
td { vertical-align: top; padding: 12px 8px; border-bottom: 1px solid #c8ccd1; overflow-wrap: anywhere; }
.title { font-weight: bold; }
.actions { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; }
.actions a { display: inline-flex; align-items: center; min-height: 42px; }
.actions button { font-size: 14px; padding: 4px 8px; }
progress { display: block; width: 100%; max-width: 290px; height: 12px; margin: 8px 0; accent-color: #36c; }
details { margin: 9px 0; }
summary { cursor: pointer; color: #0645ad; padding: 5px 0; min-height: 36px; }
dl { margin: 8px 0; font-size: 14px; }
dt { color: #54595d; }
dd { margin: 0 0 7px; white-space: pre-wrap; }
.error, .warning { color: #8a2c10; }
.sr-only, .skip:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip:focus { display: block; padding: 8px; }
[hidden] { display: none !important; }
@media (max-width: 600px) {
  main { margin: 16px auto; padding: 0 12px 28px; }
  .controls { gap: 10px; }
  .controls > div, .controls select { width: 100%; }
  .controls > button { width: 100%; }
  table, tbody, tr, td { display: block; width: 100%; }
  thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  tr { border-top: 1px solid #a2a9b1; padding: 8px 0 12px; }
  td { border: 0; padding: 4px 0; }
  td[data-label]::before { content: attr(data-label); display: block; font-size: 13px; color: #54595d; }
}
