.rules-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:760px;margin:0 auto;padding:16px}a.wordmark{text-decoration:none}.rules{--w: 44px;--d: calc(var(--w) * .15);max-width:760px;margin:0 auto;padding:8px 16px 64px;line-height:1.55}.rules h1{margin:24px 0 8px;font:400 clamp(2rem,6vw,2.8rem) / 1.1 "Bungee",var(--ui);color:#d8fbff;text-shadow:0 0 6px var(--cyan),0 0 24px rgb(63 227 255 / .45)}.rules .lede{margin:0 0 40px;font-size:1.2rem;max-width:52ch}.rules section{margin-top:48px}.rules h2{margin:0 0 8px;font:600 1.45rem/1.2 var(--ui);color:var(--amber)}.rules p{max-width:64ch;margin:0 0 16px}.rules .note{color:var(--muted)}.demos{display:flex;flex-wrap:wrap;gap:24px 40px;margin-top:24px}figure{margin:0;max-width:280px}figcaption{margin-top:14px;font-size:.92rem;color:var(--muted)}.demo-row,.pair{display:flex}.pair{gap:8px}.demo-stack{position:relative;width:calc(var(--w) * 1.65 + var(--d));height:calc(var(--w) * 1.3 + var(--d))}.demo-stack .tile{position:absolute;left:0;top:var(--d)}.demo-stack .tile+.tile{left:calc(var(--w) * .65);top:0}.pairs{list-style:none;padding:0;margin:24px 0;display:grid;gap:18px}.pairs li{display:flex;align-items:center;gap:20px}.pairs .pair{flex:none;--w: 38px;--d: calc(var(--w) * .15)}.no-match .pair{opacity:.5}.guide{--w: 36px;--d: calc(var(--w) * .15);margin:24px 0 0;display:grid;gap:22px}.guide dt{font-weight:600;margin-bottom:8px}.guide dt span{font-weight:400;color:var(--muted);margin-left:8px}.guide dd{margin:0;display:flex;flex-wrap:wrap;gap:8px}.controls-list{display:grid;gap:12px;margin:16px 0 20px}.controls-list div{display:grid;grid-template-columns:11rem 1fr;gap:16px}.controls-list dt{font-weight:600}.controls-list dd{margin:0}kbd{display:inline-block;margin-left:6px;padding:1px 6px;font:600 .8rem/1.4 var(--ui);color:var(--cyan);border:1px solid rgb(63 227 255 / .45);border-radius:4px}@media(max-width:520px){.rules{--w: 38px}.guide{--w: 30px;gap:18px}.guide dd{gap:6px}.controls-list div{grid-template-columns:1fr;gap:2px}}