.alchemistRules { max-width:58rem; margin:auto; padding:clamp(12px,3vw,30px); color:#33291e; background:#fffbf0; font:1rem/1.65 system-ui,sans-serif; overflow-wrap:anywhere; }
.alchemistRules { container-type:inline-size; }
.alchemistRules * { box-sizing:border-box; }
.alchemistRules header { padding:1.5em; background:linear-gradient(125deg,#423323,#796344); color:#fff4ce; border-radius:12px; margin-bottom:2em; }
.alchemistRules header p { margin:0; letter-spacing:.2em; font-size:.8em; }
.alchemistRules h1 { font:700 clamp(1.4rem,4vw,2.3rem)/1.2 Georgia,serif; margin:.3em 0 0; }
.alchemistRules h2 { font:700 1.5em/1.3 Georgia,serif; color:#71502a; margin:1.7em 0 .6em; border-bottom:2px solid #d7be83; padding-bottom:.3em; }
.alchemistRules h3 { font:700 1.15em/1.4 system-ui,sans-serif; color:#735332; margin-top:1.5em; }
.alchemistRules p,.alchemistRules li { max-width:75ch; }
.alchemistRules table { width:100%; border-collapse:collapse; font-size:.9em; margin:1.2em 0; table-layout:fixed; }
.alchemistRules td,.alchemistRules th { padding:.55em .3em; border:1px solid #ddcba5; text-align:center; overflow-wrap:anywhere; }
.alchemistRules tr:first-child { background:#735d3c; color:white; font-weight:bold; }
.alchemistRules tr:nth-child(even) { background:#f2e6ca; }
.alchemistRules img { max-width:100%; height:auto; }
@container (max-width:400px) {
 .alchemistRules header { padding:12px; margin-bottom:1em; }
 .alchemistRules h1 { font-size:1.25rem; }
 .alchemistRules h2 { font-size:1.15rem; }
 .alchemistRules h3 { font-size:1rem; }
 .alchemistRules header p { font-size:.65rem; letter-spacing:.1em; }
 .alchemistRules table { font-size:.75rem; }
}
@media(max-width:480px){.alchemistRules{font-size:.92rem;padding:12px}.alchemistRules table{font-size:.78em}.alchemistRules td{padding:.4em .2em}}

#rulesPage .alchemistRules { padding-left:8px; padding-right:8px; }