.rules-subnav{
max-width:1200px;
margin:24px auto 0;
padding:0 7%;
}

.rules-subnav-inner{
display:flex;
align-items:center;
gap:8px;
padding:6px;
border:1px solid var(--nova-border,rgba(142,157,190,.18));
border-radius:14px;
background:rgba(17,21,32,.86);
box-shadow:0 12px 34px rgba(0,0,0,.22);
backdrop-filter:blur(10px);
-webkit-backdrop-filter:blur(10px);
}

.rules-subnav a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:42px;
padding:10px 18px;
border:1px solid transparent;
border-radius:10px;
color:var(--nova-text-muted,var(--nova-muted,#c7ccda));
font-size:.92rem;
font-weight:750;
line-height:1.2;
text-decoration:none;
transition:background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease;
}

.rules-subnav a:hover{
border-color:rgba(155,108,255,.35);
background:rgba(124,77,255,.1);
color:var(--nova-text,#f5f7ff);
}

.rules-subnav a[aria-current="page"]{
border-color:rgba(0,212,255,.38);
background:linear-gradient(135deg,rgba(124,77,255,.2),rgba(0,212,255,.11));
color:var(--nova-cyan,#00d4ff);
box-shadow:0 0 20px rgba(124,77,255,.16);
}

.rules-subnav a:focus-visible{
outline:3px solid var(--nova-cyan,#00d4ff);
outline-offset:3px;
}

@media(max-width:600px){
.rules-subnav{margin-top:16px;padding:0 5%;}
.rules-subnav-inner{display:grid;grid-template-columns:1fr 1fr;}
.rules-subnav a{padding:10px 8px;font-size:.84rem;text-align:center;}
}