/* Rules-specific additions; the site's existing visual design is retained. */
#page-rules [hidden] { display: none !important; }
.rules-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin: 1.4rem 0; }
.rules-tabs a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .65rem 1rem; border: 1px solid #596274; border-radius: 4px; color: #e5e7eb; background: #06080a; text-decoration: none; font-family: Arimo, sans-serif; font-size: .9rem; font-weight: 700; }
.rules-tabs a[aria-selected="true"] { border-color: #00f2ff; color: #00f2ff; background: rgba(0,242,255,.08); }
.rules-tabs #tab-one-at-a-time[aria-selected="true"] { color: #86efac; border-color: #86efac; background: rgba(34,197,94,.08); }
.rules-tabs #tab-red-shift[aria-selected="true"] { color: #fca5a5; border-color: #fca5a5; background: rgba(239,68,68,.08); }
.rules-tabs a:focus-visible, #page-rules button:focus-visible, #rs-code:focus-visible { outline: 2px solid #00f2ff; outline-offset: 4px; }
#page-rules [role="tabpanel"] { outline: none; }
#page-rules .manual-tools button { cursor: pointer; background: transparent; font-family: inherit; }
.sequence-caption { text-align: center; margin-top: .8rem; font-size: .85rem; }
.turn-order-example { padding: 1rem; margin-top: 1rem; border: 1px solid rgba(0,242,255,.3); border-radius: 4px; background: rgba(0,242,255,.04); }
.rules-inline-link { color: #00f2ff; text-decoration: underline; text-underline-offset: 3px; }
.variant-table { width: 100%; margin-top: 1rem; border-collapse: collapse; font-size: .85rem; }
.variant-table th, .variant-table td { padding: .7rem; border: 1px solid #343b47; text-align: left; }
#rs-gate { max-width: 36rem; margin: 2rem auto; padding: 1.5rem; border: 1px solid #f87171; border-radius: 4px; background: #090506; }
#rs-gate h2 { color: #fca5a5; }
#rs-gate form { margin-top: 1rem; }
#rs-gate label { display: block; font-size: .9rem; font-weight: 700; margin-bottom: .5rem; }
#rs-gate input { width: 100%; max-width: 25rem; padding: .8rem; border: 1px solid #9ca3af; border-radius: 4px; background: #000; color: #fff; font: inherit; margin: 0 0 .8rem; }
#rs-gate button { display: block; min-height: 44px; padding: .7rem 1rem; font: inherit; font-weight: 700; color: #fff; border: 1px solid #f87171; border-radius: 4px; background: #651c24; cursor: pointer; }
#rs-error { color: #fca5a5; margin-top: .8rem; }
.redshift-rules { --red: #ef4444; --cyan: #00f2ff; --green: #22c55e; --purple: #bc13fe; --orange: #ff8c00; --grey: #9ca3af; }
.redshift-rules .rule-card { border-left-color: #ef4444; }
.redshift-rules .rule-card.cyan { border-left-color: #00f2ff; }
.redshift-rules .rule-card.green { border-left-color: #22c55e; }
.redshift-rules .rule-card.orange { border-left-color: #ff8c00; }
.redshift-rules .section-header.red, .redshift-rules .t-red { color: #fca5a5; }
.redshift-rules .section-header.cyan, .redshift-rules .t-cyan { color: #67e8f9; }
.redshift-rules .section-header.green, .redshift-rules .t-green { color: #86efac; }
.redshift-rules .section-header.orange, .redshift-rules .t-orange { color: #fdba74; }
.redshift-rules .t-grey { color: #d1d5db; }
.redshift-rules .step-num { background: #ef4444; }
.redshift-rules .step-num.cyan { background: #00f2ff; color: #000; }
.redshift-rules .step-num.green { background: #22c55e; color: #000; }
.redshift-rules .step-num.orange { background: #ff8c00; color: #000; }
.redshift-rules .rule-body { font-size: .9rem; }
.redshift-rules p { margin-bottom: .7rem; }
.redshift-rules table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.redshift-rules th, .redshift-rules td { padding: .6rem; border: 1px solid #343b47; text-align: left; }
.redshift-rules th { color: #fca5a5; }
.redshift-rules .note { padding: 1rem; border: 1px solid rgba(239,68,68,.4); margin-top: 1rem; }
@media (max-width: 480px) {
  .rules-tabs a { flex: 1 1 100%; }
  .variant-table { font-size: .75rem; }
  .variant-table th, .variant-table td, .redshift-rules th, .redshift-rules td { padding: .4rem; overflow-wrap: anywhere; }
}
@media print {
  #page-rules .no-print { display: none !important; }
  #page-rules .rule-card { break-inside: avoid; }
}

.rules-cheatcards { margin: .5rem auto 2rem; max-width: 56rem; }
.rules-cheatcards > h2 { text-align: center; margin-bottom: 1rem; }
.rules-cheatcards-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.rules-cheatcards-grid .cheat-link { max-width: 420px; width: 100%; margin: 0 auto; }
.cheatcards-update { font-size: .9rem; line-height: 1.6; }
.cheatcards-update p + p { margin-top: .7rem; }
@media (max-width: 640px) { .rules-cheatcards-grid { grid-template-columns: 1fr; } }
