/* Additions for the slim public page and the members area */
.cta-row { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; }
.signin { font: 400 var(--s-1)/1.3 var(--f-type); text-transform: uppercase; letter-spacing: .08em; }

.mbar { background: var(--ink); color: var(--paper); border-bottom: 3px solid var(--ink); padding-block: 14px; }
.mbar .wrap { display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: center; justify-content: space-between; }
.mbar .brand { font: 400 1.5rem/1 var(--f-display); text-transform: uppercase; color: var(--paper); text-decoration: none; }
.mbar .brand span { background: var(--pink); color: var(--ink); padding: 0 .2em; margin-left: .15em; }
.mbar .brand:hover { background: none; }
.mbar button { font: 400 .8rem/1 var(--f-type); text-transform: uppercase; letter-spacing: .08em; color: var(--paper); background: none; border: 2px solid var(--paper); padding: 8px 12px; cursor: pointer; }

.gate { max-width: 460px; margin: 56px auto; display: grid; gap: 16px; }
.gate h1 { font: 400 clamp(2rem, 7vw, 2.8rem)/1 var(--f-display); text-transform: uppercase; }
.code-input { font-family: var(--f-body); letter-spacing: .14em; text-transform: uppercase; }

.m-hello { font: 400 clamp(2.2rem, 7vw, 4rem)/1 var(--f-display); text-transform: uppercase; margin-block: 34px 8px; }
.m-hello mark { display: inline-block; padding: .04em .14em 0; }
.m-lede { max-width: 60ch; margin-bottom: 30px; }
.m-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 30px; }
.m-nav a { font: 400 .85rem/1 var(--f-heavy); text-transform: uppercase; border: 2px solid var(--ink); padding: 9px 12px; text-decoration: none; background: #fff; }
.m-sheets { display: grid; gap: 30px; padding-bottom: 60px; }
.m-sheets .sheet { width: 100%; }
.m-sheets .sheet > .wrap { max-width: none; }
.m-list { margin: 0; padding-left: 1.2em; display: grid; gap: 10px; max-width: 68ch; }
.m-list li::marker { color: var(--pink-ink); font-weight: 700; }
.m-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 22px 32px; }
.m-grid h3 { font: 400 1.05rem/1.2 var(--f-heavy); text-transform: uppercase; margin-bottom: 8px; }
.say { font-family: var(--f-type); background: #fff; border: 2px solid var(--ink); padding: 10px 14px; display: inline-block; transform: rotate(-.6deg); }
.rules .m-list li::marker { color: var(--pink); }