/* Styles for public/login.php (moved out of the page) */
.card-scene { perspective:1000px; width:100%; max-width:420px; }
.card-flipper { position:relative; transition:transform .55s cubic-bezier(.4,0,.2,1); transform-style:preserve-3d; }
.card-flipper.flipped { transform:rotateY(180deg); }
.card-face { backface-visibility:hidden; -webkit-backface-visibility:hidden; width:100%; }
.card-face.back { transform:rotateY(180deg); position:absolute; top:0; left:0; right:0; }

/* PIN display */
.pin-display {
  background: var(--bg2);
  border: 1px solid var(--border-md);
  border-radius: var(--radius);
  padding: 10px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
}
.pin-label { font-size: 12px; color: var(--text-3); }
.pin-value {
  font-family: 'DM Mono', monospace;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: .2em;
  color: var(--amber);
}