.khRules{max-width:960px;margin:auto;color:#203f40;font:17px/1.75 system-ui,sans-serif;padding:clamp(12px,3vw,30px);background:#fffdf6;overflow-wrap:break-word}.khRules *{box-sizing:border-box}.khRuleHero{display:grid;grid-template-columns:1fr 42%;align-items:center;gap:24px;padding:clamp(16px,4vw,38px);border-radius:20px;background:linear-gradient(125deg,#153f43,#26706a);color:#fff6d9}.khRuleHero h1{font:700 clamp(42px,7vw,72px)/1.1 Georgia,serif;letter-spacing:-.04em;margin:14px 0}.khRuleHero span{font-size:13px;letter-spacing:.12em;text-transform:uppercase}.khRuleHero p{margin:0;font-size:18px}.khRules .khRuleHero img{margin:0;border-radius:12px;box-shadow:0 8px 30px #001d2855}.khRuleNav{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.khRuleNav a{font-size:13px;line-height:1.3;padding:11px 14px;display:flex;align-items:center;min-height:44px;border-radius:22px;border:1px solid #cddbd0;background:#eef3e9;color:#225a52;text-decoration:none}.khRules section{padding:12px 0 28px;border-bottom:1px solid #e1e5d5;scroll-margin-top:20px}.khRules h2{font:700 clamp(25px,4vw,34px)/1.25 Georgia,serif;color:#204f49;margin:24px 0 16px}.khRules p{margin:12px 0}.khRules li{margin:10px 0;padding-left:5px}.khRules ul{padding-left:25px}.khRules img{display:block;max-width:100%;height:auto;margin:22px auto;border-radius:10px}.khRules .khRuleArrow{width:50px}.khRules table{width:100%;border-collapse:collapse;background:#f4f3e5;border-radius:12px}.khRules td{padding:8px;vertical-align:top}.khRules td:first-child{width:44px;text-align:right;font-weight:700}.khRules .khRuleOnline{margin-top:28px;padding:12px 24px 24px;border:1px solid #c8d9c9;border-radius:15px;background:#eef4e9}.khRuleNav a:focus-visible{outline:3px solid #bd631c;outline-offset:2px}@media(max-width:580px){.khRules{font-size:16px}.khRuleHero{grid-template-columns:1fr}.khRules .khRuleHero img{max-height:220px;object-fit:cover;width:100%}.khRules .khRuleOnline{padding:8px 16px 18px}.khRuleNav{gap:6px}.khRuleNav a{padding:10px 12px}}
.khRules section>img:not(.khRuleArrow){width:min(100%,440px)}

/* Respond to the rule article width, including a narrow panel on a wide screen. */
.khRules{container-type:inline-size}
@container (max-width:580px){
.khRuleHero{grid-template-columns:1fr;gap:14px;padding:18px}
.khRuleHero h1{font-size:42px}.khRuleHero p{font-size:16px}
.khRules .khRuleHero img{max-height:200px;object-fit:cover;width:100%}
.khRuleNav{gap:6px;margin:16px 0}.khRuleNav a{padding:8px 10px}
.khRules h2{font-size:25px}.khRules .khRuleOnline{padding:8px 14px 18px}
}
#panelRules .khRules{padding:12px;font-size:15px;line-height:1.65;min-width:0}

.khRules .khRuleHero h1{color:inherit;text-align:left}.khRules p,.khRules ul,.khRules ol{line-height:inherit}