.kmRules { max-width:1080px; margin:0 auto; padding:clamp(12px,3vw,30px); color:#302b25; background:#fffdf8; font:1rem/1.65 system-ui,sans-serif; overflow-wrap:anywhere; }
.kmRules * { box-sizing:border-box; }
.kmRules header { border-bottom:3px solid #a77738; margin-bottom:1.5em; padding-bottom:1em; }
.kmRules h1 { font-size:clamp(1.6rem,4vw,2.6rem); color:#6c4a29; }
.kmRules h2 { font-size:1.5rem; margin:1.8em 0 .6em; border-bottom:1px solid #dcc9ad; padding-bottom:.3em; }
.kmRules h4,.kmRules h5 { font-size:1.1rem; color:#6c4a29; margin:1.5em 0 .5em; }
.kmRules nav { display:flex; flex-wrap:wrap; gap:8px 18px; }
.kmRules a { color:#765019; text-decoration:underline; }
.kmRules ul { padding:1em 1em 1em 2em; background:#f4eddf; border-radius:8px; }
.kmRules li+li { margin-top:.5em; }
.kmRules img { display:block; max-width:100%; height:auto; margin:.5em auto; }
.kmRules .kmRulesExamples { container-type:inline-size; }
.kmRules figure { display:flex; align-items:center; flex-wrap:wrap; gap:16px; margin:1em 0; padding:12px; background:#f3eee5; border-radius:8px; }
.kmRules figure img { width:min(100%,340px); flex:0 1 340px; margin:0; }
#rules .kmRules,#panelRules .kmRules { padding:12px; font-size:.9rem; }
.kmRules figure figcaption { flex:1 1 220px; min-width:0; }
.kmRules .kmRulesRanks { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,165px),1fr)); gap:10px; font-size:.9em; }
.kmRules .kmRulesRank { padding:12px; border:1px solid #dacbb6; border-radius:8px; background:#f4eddf; }
.kmRules .kmRulesRank h3 { font-size:1.05em; text-align:center; margin:0 0 10px; }
.kmRules .kmRulesRank img { width:64px; height:64px; object-fit:contain; }
.kmRules .kmRulesRank dl { display:grid; grid-template-columns:1fr auto; gap:6px; margin:12px 0 0; }
.kmRules .kmRulesRank dt { font-weight:normal; } .kmRules .kmRulesRank dd { margin:0; font-weight:bold; }