
.page-banner{width:100%;height:320px;min-height:320px;position:relative;display:flex;align-items:center;overflow:hidden;color:#fff;background:center/cover no-repeat}
.page-banner-rules{background-image:url("../images/banners/rules.jpg")}
.page-banner::before{position:absolute;inset:0;content:"";background:linear-gradient(90deg,rgba(6,36,52,.56) 0%,rgba(6,36,52,.30) 36%,rgba(6,36,52,.08) 62%,rgba(6,36,52,0) 100%)}
.page-banner-inner{position:relative;z-index:1;padding:34px 0 30px}
.page-banner h1{max-width:790px;margin:0;font-family:"Barlow Condensed",Arial,sans-serif;font-size:clamp(3rem,5.2vw,5rem);font-weight:800;line-height:.88;letter-spacing:-.025em;text-transform:uppercase;text-shadow:0 3px 18px rgba(4,25,38,.28)}
.page-title-line,.page-title-accent{display:block}.page-title-line{color:#fff}.page-title-accent{margin-top:6px;color:#44bdf7}
.page-banner-rule{display:block;width:76px;height:3px;margin-top:18px;background:#44bdf7}
.page-banner-text{max-width:620px;margin:18px 0 0;color:rgba(255,255,255,.96);font-size:1rem;line-height:1.55;text-shadow:0 2px 12px rgba(4,25,38,.28)}
.rules-page{padding-top:82px}.rules-head{align-items:flex-end}
.rules-draft-note{margin-top:34px;padding:22px 26px;border-left:5px solid var(--coral);border-radius:14px;background:#fff8e8}
.rules-draft-note strong{display:block;color:var(--coral);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.rules-draft-note p{margin:7px 0 0;color:#526371}
.rules-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:30px;align-items:start;margin-top:40px}
.rules-toc{position:sticky;top:22px;padding:24px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 12px 28px rgba(23,63,87,.06)}
.rules-toc h3{font-size:2rem}.rules-toc nav{display:grid;gap:7px;margin-top:18px}.rules-toc a{padding:8px 10px;border-radius:9px;color:var(--muted);font-size:.82rem}.rules-toc a:hover{color:#fff;background:var(--ocean)}
.rules-content{display:grid;gap:15px}.rule-card{border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 12px 28px rgba(23,63,87,.06);overflow:hidden;scroll-margin-top:24px}
.rule-card summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:48px 1fr auto;gap:14px;align-items:center;padding:20px 22px}.rule-card summary::-webkit-details-marker{display:none}
.rule-number{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:var(--ocean);background:#eefaff;font-family:"Barlow Condensed",Arial,sans-serif;font-size:1.2rem;font-weight:800}
.rule-title{color:var(--navy);font-family:"Barlow Condensed",Arial,sans-serif;font-size:1.55rem;font-weight:700}.rule-toggle{color:var(--ocean);font-size:1.35rem;transition:transform .2s ease}details[open] .rule-toggle{transform:rotate(45deg)}
.rule-body{padding:0 22px 24px 84px;color:var(--muted)}.rule-body p+p,.rule-body ul+p,.rule-body p+ul{margin-top:12px}.rule-body ul{margin:10px 0 0 18px;display:grid;gap:7px}.rule-body strong{color:var(--navy)}
.rule-highlight{margin-top:14px;padding:16px 18px;border-left:4px solid var(--sun);border-radius:8px 14px 14px 8px;background:#fff8e8}
.rules-table-wrap{margin-top:14px;overflow-x:auto;border:1px solid var(--line);border-radius:14px}.rules-table{width:100%;min-width:620px;border-collapse:collapse}.rules-table th,.rules-table td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;font-size:.86rem}.rules-table th{color:#fff;background:var(--navy)}.rules-table tr:last-child td{border-bottom:0}
.rules-source-note{margin-top:30px;padding:22px 26px;border-left:5px solid var(--ocean);border-radius:14px;background:#eefaff;color:#526371}
@media(max-width:980px){.rules-layout{grid-template-columns:1fr}.rules-toc{position:static}.rules-toc nav{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.page-banner{height:300px;min-height:300px;background-position:62% center}.page-banner::before{background:rgba(7,37,54,.62)}.page-banner-inner{padding:28px 0}.page-banner h1{font-size:clamp(2.7rem,12vw,4.2rem)}.page-banner-text{max-width:100%;font-size:.9rem}.rules-toc nav{grid-template-columns:1fr}.rule-card summary{grid-template-columns:40px 1fr auto;padding:17px}.rule-body{padding:0 17px 20px}}
