/* Her own password at set-up, and Face ID or fingerprint if she wants it. Gigi, 20 October 2026.
   The world's own pieces (the door's form, the white press with its red edge) do the dressing;
   this only places them. */

.dhb-word { max-width: 28rem; margin: var(--dhb-space-lg, 2.6rem) auto 0; text-align: center; }
.dhb-word[hidden], .dhb-word [hidden] { display: none !important; }
.dhb-word--life { margin-bottom: var(--dhb-space-lg, 2.6rem); }

.dhb-word__step { animation: dhb-word-in .7s var(--dhb-ease, ease) both; }
@keyframes dhb-word-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .dhb-word__step { animation: none; } }

.dhb-word__head {
  font-family: var(--dhb-font-display, serif);
  font-size: clamp(1.7rem, 4.4vw, 2.5rem);
  line-height: 1.15;
  color: #fff;
  text-shadow: 3px 3px 0 #E40037;
  margin: 0 0 var(--dhb-space-sm, 1rem);
}

.dhb-word__line {
  font-family: 'Josefin Sans', -apple-system, 'Segoe UI', sans-serif;
  font-size: clamp(1.05rem, 2.2vw, 1.25rem);
  line-height: 1.5;
  margin: 0 auto var(--dhb-space-md, 1.6rem);
  max-width: 24rem;
}

.dhb-word__who { opacity: .85; }
.dhb-word__hint { margin-top: .6rem; }

.dhb-word__show, .dhb-word__away {
  background: none; border: 0; padding: 0 0 1px; margin-left: .5rem;
  font: inherit; color: inherit; cursor: pointer;
  border-bottom: 1px solid currentColor;
}
.dhb-word__away { margin-left: 0; }

.dhb-word__note { min-height: 1.4em; margin-top: .8rem; }

/* On the door: one quiet line under Come In, only on a device that can. */
.dhb-word__face-in {
  display: inline-block;
  margin-top: var(--dhb-space-sm, 1rem);
  background: none; border: 0; padding: .4rem 0 2px;
  font-family: 'Josefin Sans', -apple-system, 'Segoe UI', sans-serif;
  font-size: 1rem; font-weight: 600; letter-spacing: .02em;
  color: inherit; cursor: pointer;
  border-bottom: 1px solid currentColor;
}
.dhb-word__face-in[hidden] { display: none; }
