/* Locked games and quizzes, and member sign-in (js/nx-access.js).
   Loaded by the Library, play.html, quizzes.html and signin.html. */

/* Library tiles: a small lock on the icon of a members' game */
.nx-app-lock { position: absolute; left: -9px; bottom: -9px; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #282858; color: #fedb71; border: 2px solid #fff; }
.nx-app-lock svg { width: 14px; height: 14px; }
.nx-go-item .nx-app-icon { position: relative; }
.nx-go-item .nx-app-lock { width: 22px; height: 22px; left: -7px; bottom: -7px; }
.nx-go-item .nx-app-lock svg { width: 11px; height: 11px; }

/* Quiz cards: the same, as a label under the text */
.nx-quiz-lock { display: inline-flex; align-items: center; gap: 5px; margin: 8px 6px 0 0; padding: 3px 9px; border-radius: 999px; background: #282858; border: 1.5px solid #282858; font-size: 12px; font-weight: 700; color: #fedb71; }

/* The game sheet in the Library, when the game is locked */
.nx-status.is-locked { border-style: solid; }
.nx-sheet .nx-signin { margin-top: -4px; }

/* "Already a member? Sign in with your email" */
.nx-signin { font-family: Geist, Inter, system-ui, sans-serif; color: #282858; }
.nx-signin-lead { margin: 0; font-size: 15px; line-height: 1.5; }
.nx-signin-open { background: none; border: 0; padding: 4px 0; font: inherit; font-weight: 700; color: #282858; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.nx-signin-form { margin-top: 10px; }
.nx-signin-form label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.nx-signin-row { display: flex; flex-wrap: wrap; gap: 8px; }
.nx-signin-row input { flex: 1 1 200px; min-width: 0; min-height: 46px; padding: 10px 14px; border: 2px solid #282858; border-radius: 12px; background: #fff; color: #1a1a1a; font: 16px Geist, Inter, system-ui, sans-serif; }
.nx-signin-row input:focus-visible { outline: 3px solid #4f46e5; outline-offset: 1px; }
.nx-signin-row button { min-height: 46px; padding: 10px 18px; border: 2px solid #282858; border-radius: 999px; background: #282858; color: #fedb71; font: 700 15px Geist, Inter, system-ui, sans-serif; cursor: pointer; }
.nx-signin-row button:disabled { opacity: 0.6; cursor: default; }
.nx-signin-status { margin: 8px 0 0; font-size: 14px; line-height: 1.5; color: #282858; }
.nx-signin-status:empty { display: none; }
.nx-signin-status.is-error { color: #b42318; font-weight: 600; }

/* Library hero: who is signed in */
.nx-member-line { margin: 16px 0 0; font-size: 15px; color: var(--navy, #282858); }
.nx-member-line .nx-signin-open { padding: 0; }
.nx-member-line > svg { vertical-align: -3px; }
.nx-member-line .nx-signin { margin-top: 0; }

/* play.html and quizzes.html: a locked game or quiz */
.px-lock-badge { display: inline-flex; align-items: center; gap: 6px; margin: 2px 0 12px; padding: 5px 12px; border-radius: 999px; background: #fff6d6; border: 2px solid #282858; font-weight: 700; font-size: 14px; color: #282858; }
.px-lock a.px-btn { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.px-lock .nx-signin { margin-top: 16px; text-align: left; }