:root { color-scheme: light; }
* { box-sizing: border-box; }
body { margin: 8px; color: #000; background: #fff; font: 15px/1.65 sans-serif; }
main { max-width: 1280px; margin: 0 auto; min-width: 0; }
h1 { color: #fff; background: #009d88; padding: 5px 10px; margin: 0 0 10px; font-size: 1.1rem; overflow-wrap: anywhere; }
h2 { color: #000; background: #f4fff4; padding: 3px 8px; border: solid #009d88; border-width: 1px 0 0 13px; font-size: 1rem; margin-top: 24px; }
a { color: #005f55; text-underline-offset: 3px; }
a:visited { color: #604483; }
a:hover { color: #003e36; }
a:focus-visible, [tabindex]:focus-visible { outline: 3px solid #007b6b; outline-offset: 3px; }
p { margin: 12px 16px; }
hr { border: 0; border-top: 1px solid #ccc; margin: 16px 0; }
footer { margin-top: 24px; padding: 12px 4px; border-top: 1px solid #ccc; }
.archive-nav, .race-links { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.archive-nav a, .race-links a { display: inline-flex; align-items: center; min-height: 44px; }
.archive-nav a[aria-current="page"] { font-weight: bold; text-decoration-thickness: 2px; }
.archive-notice { color: #b00020; }
.year-links { display: grid; gap: 8px; justify-items: center; padding: 12px; font-size: 1.1rem; }
.year-links a { min-height: 44px; display: flex; align-items: center; }
.muted, .scroll-hint { color: #555; font-size: .9rem; }
.table-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; margin: 12px 0; }
table.default { font-size: 14px; border: 1px solid #6b6b6b; border-collapse: separate; border-spacing: 0; margin: 0; }
caption { text-align: left; font-weight: bold; padding: 5px 0; }
table.default th, table.default td { padding: 4px 10px; border-right: 1px solid #808080; border-bottom: 1px solid #808080; white-space: nowrap; }
table.default tr > :last-child { border-right: 0; }
table.default tbody tr:last-child > * { border-bottom: 0; }
table.default th { background: #e5e5e5; }
table.default tbody th { background: #fff; text-align: left; font-weight: normal; }
table.default tbody tr:hover > * { background: #f4fff4; }
.numeric { text-align: right; font-variant-numeric: tabular-nums; }
.center { text-align: center; }
.race-list a { display: inline-flex; align-items: center; min-height: 36px; }
.race-list tbody th { white-space: normal; min-width: 9em; }
.ranking tbody th { position: sticky; left: 0; z-index: 1; }
.result-summary { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 8px 32px; }
.result-summary .table-scroll { flex: 0 1 auto; }
.scores .total { font-weight: bold; background: #f4fff4; }
.predictions { text-align: center; }
.predictions .horse-name { vertical-align: top; background: #fff; padding: 8px 10px; }
.horse-name span { display: inline-block; writing-mode: vertical-rl; text-orientation: upright; letter-spacing: 2px; }
.predictions .row-label { position: sticky; right: 0; background: #f4fff4; z-index: 1; }
table.default .frame-1 { background: white; color: black; }
table.default .frame-2 { background: black; color: white; }
table.default .frame-3 { background: #d50000; color: white; }
table.default .frame-4 { background: #1749c6; color: white; }
table.default .frame-5 { background: #ffe500; color: black; }
table.default .frame-6 { background: #087d37; color: white; }
table.default .frame-7 { background: #ffad32; color: black; }
table.default .frame-8 { background: #ffb7ce; color: black; }
.skip-link { position: absolute; top: -100px; background: #fff; padding: 8px; z-index: 10; }
.skip-link:focus { top: 0; }
@media (max-width: 600px) {
    body { font-size: 16px; }
    p { margin-left: 4px; margin-right: 4px; }
    h1 { font-size: 1.05rem; }
    table.default { font-size: 14px; }
    .archive-nav { column-gap: 12px; font-size: 14px; }
    .rules { min-width: 650px; }
    .race-list { min-width: 570px; }
}
@media print {
    .archive-nav, .race-links, .scroll-hint, footer, .skip-link { display: none; }
    main { max-width: none; }
    .table-scroll { overflow: visible; }
    table.default { font-size: 9px; }
    table.default th, table.default td { padding: 2px 3px; }
    .predictions .row-label, .ranking tbody th { position: static; }
    .horse-name span { letter-spacing: 0; }
}