/* ── THE MEMBERS (phase two, 2026-10-15): what a signed-in member sees, and the ways in. Loaded by /good-boy/,
   /sub-level/ and every drop page, after the page's own sheets. ── */

/* ON THE SUB LEVEL PAGE: the sign-in, a small block under the card; the account line once signed in */
.sl-signin { display: grid; gap: var(--space-sm); justify-items: start; margin: 0; }
.sl-signin[hidden], .sl-account[hidden] { display: none; }
.sl-signin-k { margin: 0; font-size: 0.9375rem; font-weight: 700; color: var(--cream); }
.sl-signin-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }   /* the honeypot, off screen */
.sl-signin-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-sm); width: 100%; }
.sl-signin-in {
  display: block; width: 100%; min-width: 0; min-height: 44px; padding: 8px 12px;
  font: 500 1rem/1.35 var(--body); color: var(--navy-cream);
  background: oklch(0.97 0.03 95 / 0.08); border: 2px solid oklch(0.97 0.03 95 / 0.3); border-radius: 0;
}
.sl-signin-in::placeholder { color: var(--navy-dim); }
.sl-signin-in:focus-visible { outline: 3px solid var(--cyan); outline-offset: 2px; }
.btn.sl-signin-go { min-height: 44px; font-size: 0.9375rem; border-width: 3px; box-shadow: 3px 3px 0 var(--ink); }
.sl-signin-say { margin: 0; font-size: 0.9375rem; font-weight: 700; color: var(--cream); }
.sl-signin-say.bad { color: oklch(0.72 0.17 27); }
.sl-signin-say:empty { display: none; }
.sl-signin.done .sl-signin-row { display: none; }
.sl-account { display: grid; gap: 6px; justify-items: start; margin: 0; }
.sl-account-k { margin: 0; font-family: var(--display); font-size: 1.125rem; line-height: 1.05; text-transform: uppercase; color: var(--cream); text-shadow: 2px 2px 0 var(--ink); }
.sl-account-line { margin: 0; font-size: 0.9375rem; color: var(--navy-cream); overflow-wrap: anywhere; }
.sl-account-links { display: flex; flex-wrap: wrap; gap: var(--space-md); margin: 2px 0 0; font-size: 0.9375rem; font-weight: 700; }
.sl-account-links a, .sl-account-links button {
  margin: 0; padding: 0; border: 0; background: none; cursor: pointer;
  font: inherit; font-weight: 700; color: var(--cream); text-decoration: underline; text-underline-offset: 3px;
}
.sl-account-links a:focus-visible, .sl-account-links button:focus-visible { outline: 3px solid var(--cyan); outline-offset: 3px; }
/* a member does not get sold the thing they have */
html.is-member .sl-go, html.is-member .sl-stick, html.is-member .btn.fd-join { display: none; }

/* IN THE FEED: a locked post comes open for a member — feed.js lifts .is-locked and the lock; nothing else moves */

/* ON A DROP'S PAGE: the gate over the picture for anyone not signed in */
.gate {
  position: absolute; inset: 0; z-index: 6;
  display: grid; align-content: center; justify-items: center; gap: var(--space-md);
  padding: var(--space-xl); text-align: center;
  background: oklch(0.13 0.035 262 / 0.76); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.gate-k { margin: 0; font-family: var(--display); font-size: clamp(1.75rem, 8vw, 2.5rem); line-height: 1; text-transform: uppercase; color: var(--yellow); text-shadow: 3px 3px 0 var(--ink); }
.gate-line { margin: 0; max-width: 30ch; font-size: 1rem; line-height: 1.4; color: var(--navy-cream); }
.btn.gate-go { margin-top: var(--space-sm); font-size: 1.125rem; border-width: 3px; box-shadow: 4px 4px 0 var(--ink); }
.gate-in { font-size: 0.9375rem; font-weight: 700; color: var(--cream); text-decoration: underline; text-underline-offset: 3px; }
body.gated .stage video { filter: blur(14px) brightness(0.6); }
