/* Sors Duo: the rules page, a long read in the table's colours | games/Sors_Duo/css/rules.css | v.0.1 */
html, body.rules-page { height: auto; }
body.rules-page { overflow-y: auto; scrollbar-color: var(--gold-lo) transparent; }
html[data-lang="pl"] [data-l="en"], html[data-lang="en"] [data-l="pl"] { display: none; }
.rules-top { display: flex; justify-content: space-between; align-items: center; max-width: 780px; margin: 0 auto; padding: 16px 18px 0; }
.rules-top .back { color: var(--gold); text-decoration: none; letter-spacing: 1px; font-size: 14px; }
.rules-top .back:hover { color: var(--gold-hi); }
.rules { max-width: 780px; margin: 0 auto; padding: 10px 18px 60px; line-height: 1.65; font-size: 15.5px; color: var(--ivory); }
.rules h1 { text-align: center; margin: 12px 0 4px; font-family: var(--font-deco); font-size: 46px; letter-spacing: 12px; color: var(--gold); }
.rules h1 span { color: var(--ivory); }
.rules .lead { text-align: center; font-family: var(--font-deco); color: var(--ivory-dim); letter-spacing: 1px; margin-bottom: 30px; }
.rules h2 { margin: 34px 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--gold-lo); font-family: var(--font-deco); font-size: 22px; letter-spacing: 3px; color: var(--gold); }
.rules b { color: var(--gold-hi); font-weight: 600; }
.rules ol { padding-left: 22px; }
.rules li { margin-bottom: 6px; }
.rules .small { font-size: 13px; color: var(--ivory-dim); }
.odds { width: 100%; border-collapse: collapse; margin: 12px 0; font-size: 14.5px; }
.odds th, .odds td { padding: 7px 12px; border-bottom: 1px solid #2a2a22; text-align: left; }
.odds th { color: var(--gold); font-weight: 600; letter-spacing: 1px; }
.odds td:last-child, .odds th:last-child { text-align: right; }
.keys { display: grid; grid-template-columns: max-content 1fr; gap: 4px 18px; }
.keys dt { font-weight: 600; color: var(--gold-hi); }
.keys dd { margin: 0; color: var(--ivory-dim); }
@media (max-width: 600px) { .rules h1 { font-size: 32px; letter-spacing: 6px; } .odds { font-size: 13px; } }