/* /marshals: the public Marshal page. Hero, headings and panels come from x-scrims.css (scr-); these are its own parts, mrs-. */
.mrs-reqs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s3); }
.mrs-req { position: relative; overflow: hidden; padding: var(--s4) var(--s4) var(--s5); border: 1px solid var(--line-2); border-top: 3px solid var(--gold); border-radius: var(--rl); background: linear-gradient(180deg, rgba(201,162,39,.1), rgba(12,14,16,.94) 70%); animation: scr-up .5s cubic-bezier(.2,.8,.2,1) both; }
.mrs-req::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(-45deg, rgba(255,255,255,.03) 0 2px, transparent 2px 14px); }
.mrs-req > * { position: relative; }
.mrs-req b { display: block; font: 500 34px/1 var(--fm); letter-spacing: -.03em; color: var(--gold-2); }
.mrs-req p { margin: var(--s3) 0 0; color: var(--ink-2); line-height: 1.5; }
.mrs-req:nth-child(2) { animation-delay: .05s; } .mrs-req:nth-child(3) { animation-delay: .1s; } .mrs-req:nth-child(4) { animation-delay: .15s; }
.mrs-req:nth-child(5) { animation-delay: .2s; } .mrs-req:nth-child(6) { animation-delay: .25s; } .mrs-req:nth-child(7) { animation-delay: .3s; }
.mrs-rules { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: var(--rl); background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%); counter-reset: mrs; }
.mrs-rules li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: var(--s3); padding: var(--s4) var(--s5); border-top: 1px solid var(--line); color: var(--ink-2); line-height: 1.55; }
.mrs-rules li:first-child { border-top: 0; }
.mrs-rules li::before { counter-increment: mrs; content: counter(mrs, decimal-leading-zero); font: 500 20px/1.3 var(--fm); color: var(--gold-2); }
.mrs-rules.is-conduct { border-left: 3px solid var(--gold); }
.mrs-rules a { color: var(--gold-2); }
@media (prefers-reduced-motion: reduce) { .mrs-req { animation: none; } }
@media (max-width: 900px) { .mrs-reqs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .mrs-reqs { grid-template-columns: 1fr; } .mrs-rules li { grid-template-columns: 40px minmax(0, 1fr); padding: var(--s4); } }