/* Dedicated rules page. Shared branding and join dialog remain in style.css/app.js. */
.rules-page .header { position: relative; height: auto; min-height: 94px; background: #101114; }
.rules-page .header-inner { padding-block: 20px; }
.rules-page .header nav a[aria-current="page"] { color: #ff397d; }
.rules-document { max-width: 960px; padding-block: 42px 70px; }
.rules-back { display: inline-block; color: #b5b6be; font-size: 12px; padding-block: 8px; }
.rules-back:hover { color: #fff; }
.rules-intro { margin: 38px 0 32px; }
.rules-intro h1 { margin: 18px 0 24px; font-size: clamp(48px, 8vw, 84px); }
.rules-intro > p { max-width: 65ch; color: #d4d5db; font-size: 16px; }
.rules-intro .rules-agreement { margin-top: 18px; color: #a4a6b0; font-size: 13px; }
.rules-contents { padding: 26px; border: 1px solid #303139; background: #141519; }
.rules-contents h2 { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: 700; margin-bottom: 18px; }
.rules-contents > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 24px; }
.rules-contents a { display: flex; align-items: baseline; gap: 12px; font-size: 13px; padding: 8px 0; }
.rules-contents a span { color: #ff397d; font-size: 11px; }
.rules-contents a:hover { color: #b6ee38; }
.rule-section { padding: 36px 0; border-bottom: 1px solid #303139; scroll-margin-top: 24px; }
.rule-section h2 { font-family: Arial, Helvetica, sans-serif; font-weight: 700; font-size: 21px; line-height: 1.4; display: flex; gap: 16px; align-items: baseline; }
.rule-section h2 span { color: #ff397d; font-size: 12px; font-weight: 400; }
.rule-section ul { margin: 22px 0 0; padding-left: 22px; color: #c6c7cf; font-size: 15px; line-height: 1.85; }
.rule-section li + li { margin-top: 12px; }
.rule-section li::marker { color: #a4a6b0; }
.rules-help { margin: 38px 0 24px; padding: 28px; border: 1px solid #303139; background: #141519; }
.rules-help h2 { font-family: Arial, Helvetica, sans-serif; font-weight: 700; font-size: 20px; line-height: 1.4; }
.rules-help p { margin: 12px 0 22px; color: #b5b6be; font-size: 14px; max-width: 65ch; }
@media (max-width: 700px) {
 .rules-page .header-inner { flex-wrap: wrap; gap: 18px; }
 .rules-page .header nav { display: flex; order: 3; width: 100%; gap: 8px 20px; flex-wrap: wrap; }
 .rules-page .header nav a { padding-block: 6px; font-size: 10px; }
 .rules-document { padding-block: 24px 48px; }
 .rules-intro { margin-top: 26px; }
 .rules-contents { padding: 22px; }
 .rules-contents > div { grid-template-columns: 1fr; gap: 0; }
 .rule-section { padding-block: 28px; }
 .rule-section h2 { font-size: 19px; }
 .rule-section ul { font-size: 14px; }
 .rules-help { padding: 22px; }
}
